einundzwanzig/einundzwanzig-portal
1
0
Fork 0
mirror of https://github.com/Einundzwanzig-Podcast/einundzwanzig-portal.git synced 2025-12-11 06:46:47 +00:00
Code Issues Packages Projects Releases Wiki Activity

Audio Player added

Browse Source
This commit is contained in:
Benjamin Takats
2022-12-06 21:10:08 +01:00
committed by Affekt Software Development
parent d37957903e
commit 87010aabb9
3 changed files with 61 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
resources/views/layouts/app.blade.php
View File

@@ -14,6 +14,29 @@
<!-- Styles -->
@livewireStyles
<style>
#seekObjContainer {
position: relative;
width: 400px;
margin: 0 5px;
height: 5px;
}
#seekObj {
position: relative;
width: 100%;
height: 100%;
background-color: #e3e3e3;
border: 1px solid black;
}
#percentage {
position: absolute;
left: 0;
top: 0;
height: 100%;
background-color: coral;
}
[x-cloak] {
display: none !important;
}
@@ -39,6 +62,31 @@
{{ $slot }}
</main>
</div>
<div
x-data="{
}"
class="hidden fixed bottom-0 w-full flex items-center gap-6 bg-white py-4 px-4 md:px-6">
<audio x-ref="audio">
<source src="https://thenewcode.com/assets/audio/24-ghosts-III.mp3" type="audio/mp3">
</audio>
<div class="hidden md:block">
<x-button primary @click="togglePlay"><i class="fa fa-thin fa-play"></i></x-button>
</div>
<div
class="mb-[env(safe-area-inset-bottom)] flex flex-1 flex-col gap-3 overflow-hidden p-1 justify-center items-center">
<div
class="truncate text-center text-sm font-bold leading-6 md:text-left"
>
PLAYER
</div>
<div class="flex justify-between gap-6">
<div class="md:hidden">
<x-button primary @click="togglePlay"><i class="fa fa-thin fa-play"></i></x-button>
</div>
</div>
</div>
</div>
@stack('modals')
@livewireScripts
</body>