djsundog/ffplayout
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

smaller breakpoints

Browse Source
This commit is contained in:
jb-alvarado 2024-09-25 07:48:31 +02:00
parent bb059f2e63
commit da970aa4ff
5 changed files with 11 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/components/HeaderMenu.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<div class="navbar bg-base-100 min-h-[52px] p-0 shadow"> <div class="navbar bg-base-100 min-h-[52px] p-0 shadow-md">
<NuxtLink class="navbar-brand min-w-[46px] p-2" href="/"> <NuxtLink class="navbar-brand min-w-[46px] p-2" href="/">
<img src="~/assets/images/ffplayout-small.png" class="img-fluid" alt="Logo" width="30" height="30" /> <img src="~/assets/images/ffplayout-small.png" class="img-fluid" alt="Logo" width="30" height="30" />
</NuxtLink> </NuxtLink>

2
frontend/components/MediaBrowser.vue
View File

@ -43,7 +43,7 @@
:id="`file-${index}`" :id="`file-${index}`"
:key="element.name" :key="element.name"
class="w-full border-b border-t border-base-content/20" class="w-full border-b border-t border-base-content/20"
:class="{ 'grabbing cursor-grab': width > 768 && configStore.playout.processing.mode === 'playlist' }" :class="{ 'grabbing cursor-grab': width > 739 && configStore.playout.processing.mode === 'playlist' }"
> >
<td class="ps-2 py-1 w-[20px]" :class="{'timeHidden': configStore.playout.playlist.infinit}"> <td class="ps-2 py-1 w-[20px]" :class="{'timeHidden': configStore.playout.playlist.infinit}">
<i v-if="mediaType(element.name) === 'audio'" class="bi-music-note-beamed" /> <i v-if="mediaType(element.name) === 'audio'" class="bi-music-note-beamed" />

13
frontend/components/PlaylistTable.vue
View File

@ -25,7 +25,7 @@
{{ t('player.play') }} {{ t('player.play') }}
</div> </div>
</th> </th>
<th class="w-[85px] p-0 text-center hidden md:table-cell"> <th class="w-[85px] p-0 text-center hidden 2xs:table-cell">
<div class="border-b border-my-gray px-4 py-3 -mb-[2px]"> <div class="border-b border-my-gray px-4 py-3 -mb-[2px]">
{{ t('player.duration') }} {{ t('player.duration') }}
</div> </div>
@ -50,7 +50,7 @@
{{ t('player.edit') }} {{ t('player.edit') }}
</div> </div>
</th> </th>
<th class="w-[85px] p-0 text-center hidden md:table-cell justify-center"> <th class="w-[85px] p-0 text-center hidden 2xs:table-cell justify-center">
<div class="border-b border-my-gray px-4 py-3 -mb-[2px]"> <div class="border-b border-my-gray px-4 py-3 -mb-[2px]">
{{ t('player.delete') }} {{ t('player.delete') }}
</div> </div>
@ -78,7 +78,7 @@
'!bg-lime-500/30': '!bg-lime-500/30':
playlistStore.playoutIsRunning && listDate === todayDate && index === currentIndex, playlistStore.playoutIsRunning && listDate === todayDate && index === currentIndex,
'!bg-amber-600/40': element.overtime, '!bg-amber-600/40': element.overtime,
'text-base-content/50': element.category === 'advertisement' 'text-base-content/50': element.category === 'advertisement',
}" }"
> >
<td v-if="!configStore.playout.playlist.infinit" class="ps-4 py-2 text-left"> <td v-if="!configStore.playout.playlist.infinit" class="ps-4 py-2 text-left">
@ -92,7 +92,7 @@
<i class="bi-play-fill" /> <i class="bi-play-fill" />
</button> </button>
</td> </td>
<td class="py-2 text-center hidden md:table-cell">{{ secToHMS(element.duration) }}</td> <td class="py-2 text-center hidden 2xs:table-cell">{{ secToHMS(element.duration) }}</td>
<td class="py-2 text-center hidden xl:table-cell"> <td class="py-2 text-center hidden xl:table-cell">
{{ secToHMS(element.in) }} {{ secToHMS(element.in) }}
</td> </td>
@ -112,7 +112,7 @@
<i class="bi-pencil-square" /> <i class="bi-pencil-square" />
</button> </button>
</td> </td>
<td class="py-2 text-center hidden md:table-cell justify-center hover:text-base-content/70"> <td class="py-2 text-center hidden 2xs:table-cell justify-center hover:text-base-content/70">
<button @click="deletePlaylistItem(index)"> <button @click="deletePlaylistItem(index)">
<i class="bi-x-circle-fill" /> <i class="bi-x-circle-fill" />
</button> </button>
@ -345,7 +345,8 @@ function deletePlaylistItem(index: number) {
padding-bottom: 0.5rem; padding-bottom: 0.5rem;
} }
#playlist-container .sortable-ghost td:nth-last-child(3) { #playlist-container .sortable-ghost td:nth-last-child(3),
#playlist-container .sortable-ghost td:nth-last-child(-n + 1) {
display: table-cell !important; display: table-cell !important;
} }

2
frontend/pages/player.vue
View File

@ -35,7 +35,7 @@
class="border border-my-gray rounded shadow" class="border border-my-gray rounded shadow"
> >
<pane <pane
v-if="width > 768" v-if="width > 739"
class="relative h-full !bg-base-300 rounded-s" class="relative h-full !bg-base-300 rounded-s"
min-size="0" min-size="0"
max-size="80" max-size="80"

1
frontend/tailwind.config.ts
View File

@ -56,6 +56,7 @@ module.exports = {
screens: { screens: {
xxs: '374px', xxs: '374px',
xs: '500px', xs: '500px',
'2xs': '739px',
'2sm': '825px', '2sm': '825px',
'2md': '876px', '2md': '876px',
'4xl': { min: '1971px' }, '4xl': { min: '1971px' },