Alexander/homepage
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

rosary: apply liturgical colors to season badge

Browse Source 
Lent badge uses --purple (nord15) with white text; Eastertide badge
uses --nord6 (white) with --nord0 dark text.
This commit is contained in:
Alexander Bocken
2026-02-21 16:50:28 +01:00
parent b255fc01e9
commit 694444aa0f
1 changed files with 19 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
src/routes/[faithLang=faithLang]/[rosary=rosaryLang]/MysterySelector.svelte
View File

@@ -189,12 +189,25 @@
.badge-stack .today-badge { .badge-stack .today-badge {
position: static; position: static;
} }
/* Season badge uses liturgical colors */
.season-lent .season-badge {
background: var(--purple);
color: white;
}
.season-eastertide .season-badge {
background: var(--nord6);
color: var(--nord0);
}
</style> </style>
<div class="mystery-selector" class:four-mysteries={includeLuminous}> <div class="mystery-selector" class:four-mysteries={includeLuminous}>
<a <a
class="mystery-button" class="mystery-button"
class:selected={selectedMystery === 'freudenreich'} class:selected={selectedMystery === 'freudenreich'}
class:season-lent={season === 'lent' && seasonalMystery === 'freudenreich'}
class:season-eastertide={season === 'eastertide' && seasonalMystery === 'freudenreich'}
href={mysteryHref('freudenreich')} href={mysteryHref('freudenreich')}
onclick={(e) => { e.preventDefault(); selectMystery('freudenreich'); }} onclick={(e) => { e.preventDefault(); selectMystery('freudenreich'); }}
> >
@@ -211,6 +224,8 @@
<a <a
class="mystery-button" class="mystery-button"
class:selected={selectedMystery === 'schmerzhaften'} class:selected={selectedMystery === 'schmerzhaften'}
class:season-lent={season === 'lent' && seasonalMystery === 'schmerzhaften'}
class:season-eastertide={season === 'eastertide' && seasonalMystery === 'schmerzhaften'}
href={mysteryHref('schmerzhaften')} href={mysteryHref('schmerzhaften')}
onclick={(e) => { e.preventDefault(); selectMystery('schmerzhaften'); }} onclick={(e) => { e.preventDefault(); selectMystery('schmerzhaften'); }}
> >
@@ -227,6 +242,8 @@
<a <a
class="mystery-button" class="mystery-button"
class:selected={selectedMystery === 'glorreichen'} class:selected={selectedMystery === 'glorreichen'}
class:season-lent={season === 'lent' && seasonalMystery === 'glorreichen'}
class:season-eastertide={season === 'eastertide' && seasonalMystery === 'glorreichen'}
href={mysteryHref('glorreichen')} href={mysteryHref('glorreichen')}
onclick={(e) => { e.preventDefault(); selectMystery('glorreichen'); }} onclick={(e) => { e.preventDefault(); selectMystery('glorreichen'); }}
> >
@@ -244,6 +261,8 @@
<a <a
class="mystery-button" class="mystery-button"
class:selected={selectedMystery === 'lichtreichen'} class:selected={selectedMystery === 'lichtreichen'}
class:season-lent={season === 'lent' && seasonalMystery === 'lichtreichen'}
class:season-eastertide={season === 'eastertide' && seasonalMystery === 'lichtreichen'}
href={mysteryHref('lichtreichen')} href={mysteryHref('lichtreichen')}
onclick={(e) => { e.preventDefault(); selectMystery('lichtreichen'); }} onclick={(e) => { e.preventDefault(); selectMystery('lichtreichen'); }}
> >