smedmunds/TriggerFrontend
1
0
Fork 0
Code Issues Pull Requests Actions Projects Releases Wiki Activity

Working preview on time of day playlist
All checks were successful
Deploy to production / build (push) Successful in 19s
Details

Browse Source
This commit is contained in:
Sean Edmunds
2026-10-13 14:05:51 -05:00
parent 1f86881533
commit 4bcd1e4858
1 changed files with 89 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

97
src/pages/settings/components/Theming/ThemePlaylists/components/ThemePlaylistStack.tsx
View File

@@ -194,8 +194,29 @@ export function ThemePlaylistStack({
{cardPlaylist?.name === 'Time of Day' ? (
<>
<Parallax
{...presentationProps}
style={{ position: 'absolute', top: 16 * 1, zIndex: 3 }}
{...(!(
hover &&
Number(themeList[0]) ===
Number(themeList[Math.floor(new Date().getHours() / 6)])
) && presentationProps)}
// style={{ position: 'absolute', top: 16 * 1, zIndex: 3 }}
style={{
position: 'absolute',
top: !(
hover &&
Number(themeList[0]) ===
Number(themeList[Math.floor(new Date().getHours() / 6)])
)
? 16 * 1
: 16,
zIndex: !(
hover &&
Number(themeList[0]) ===
Number(themeList[Math.floor(new Date().getHours() / 6)])
)
? 3
: 4,
}}
>
<ThemeCardPreview
cardTheme={
@@ -206,8 +227,28 @@ export function ThemePlaylistStack({
/>
</Parallax>
<Parallax
{...presentationProps}
style={{ position: 'absolute', top: 16 * 2, zIndex: 2 }}
{...(!(
hover &&
Number(themeList[1]) ===
Number(themeList[Math.floor(new Date().getHours() / 6)])
) && presentationProps)}
style={{
position: 'absolute',
top: !(
hover &&
Number(themeList[1]) ===
Number(themeList[Math.floor(new Date().getHours() / 6)])
)
? 16 * 2
: 16,
zIndex: !(
hover &&
Number(themeList[1]) ===
Number(themeList[Math.floor(new Date().getHours() / 6)])
)
? 2
: 4,
}}
>
<ThemeCardPreview
cardTheme={
@@ -218,8 +259,28 @@ export function ThemePlaylistStack({
/>
</Parallax>
<Parallax
{...presentationProps}
style={{ position: 'absolute', top: 16 * 3, zIndex: 1 }}
{...(!(
hover &&
Number(themeList[2]) ===
Number(themeList[Math.floor(new Date().getHours() / 6)])
) && presentationProps)}
style={{
position: 'absolute',
top: !(
hover &&
Number(themeList[2]) ===
Number(themeList[Math.floor(new Date().getHours() / 6)])
)
? 16 * 3
: 16,
zIndex: !(
hover &&
Number(themeList[2]) ===
Number(themeList[Math.floor(new Date().getHours() / 6)])
)
? 1
: 4,
}}
>
<ThemeCardPreview
cardTheme={
@@ -230,8 +291,28 @@ export function ThemePlaylistStack({
/>
</Parallax>
<Parallax
{...presentationProps}
style={{ position: 'absolute', top: 16 * 4, zIndex: 0 }}
{...(!(
hover &&
Number(themeList[3]) ===
Number(themeList[Math.floor(new Date().getHours() / 6)])
) && presentationProps)}
style={{
position: 'absolute',
top: !(
hover &&
Number(themeList[3]) ===
Number(themeList[Math.floor(new Date().getHours() / 6)])
)
? 16 * 4
: 0,
zIndex: !(
hover &&
Number(themeList[3]) ===
Number(themeList[Math.floor(new Date().getHours() / 6)])
)
? 0
: 4,
}}
>
<ThemeCardPreview
cardTheme={