diff --git a/TODO.md b/TODO.md new file mode 100644 index 0000000..690a622 --- /dev/null +++ b/TODO.md @@ -0,0 +1,12 @@ +# TODO + +## Refactor Recipe Search Component + +Refactor `src/lib/components/Search.svelte` to use the new `SearchInput.svelte` component for the visual input part. This will: +- Reduce code duplication between recipe search and prayer search +- Keep the visual styling consistent across the site +- Separate concerns: SearchInput handles the UI, Search.svelte handles recipe-specific filtering logic + +Files involved: +- `src/lib/components/Search.svelte` - refactor to use SearchInput +- `src/lib/components/SearchInput.svelte` - the reusable input component diff --git a/src/lib/components/SearchInput.svelte b/src/lib/components/SearchInput.svelte new file mode 100644 index 0000000..9bf953a --- /dev/null +++ b/src/lib/components/SearchInput.svelte @@ -0,0 +1,87 @@ + + + + diff --git a/src/lib/components/prayers/BruderKlausGebet.svelte b/src/lib/components/prayers/BruderKlausGebet.svelte index 4ff968f..1df8d35 100644 --- a/src/lib/components/prayers/BruderKlausGebet.svelte +++ b/src/lib/components/prayers/BruderKlausGebet.svelte @@ -1,24 +1,30 @@ -

- Mein Herr und mein Gott, - My Lord and my God, - nimm alles von mir, - take from me everything - was mich hindert zu Dir. - that distances me from Thee. -

-

- Mein Herr und mein Gott, - My Lord and my God, - gib alles mir, - give me everything - was mich führet zu Dir. - that brings me closer to Thee. -

-

- Mein Herr und mein Gott, - My Lord and my God, - nimm mich mir - detach me from myself - und gib mich ganz zu eigen Dir. - to give my all to Thee. -

+ + + +

+ Mein Herr und mein Gott, + My Lord and my God, + nimm alles von mir, + take from me everything + was mich hindert zu Dir. + that distances me from Thee. +

+

+ Mein Herr und mein Gott, + My Lord and my God, + gib alles mir, + give me everything + was mich führet zu Dir. + that brings me closer to Thee. +

+

+ Mein Herr und mein Gott, + My Lord and my God, + nimm mich mir + detach me from myself + und gib mich ganz zu eigen Dir. + to give my all to Thee. +

+
diff --git a/src/lib/components/prayers/JosephGebet.svelte b/src/lib/components/prayers/JosephGebet.svelte index 8362b41..52cfd33 100644 --- a/src/lib/components/prayers/JosephGebet.svelte +++ b/src/lib/components/prayers/JosephGebet.svelte @@ -1,14 +1,20 @@ -

- Jungfräulicher Vater Jesu, - Virgin Father of Jesus, - Reinster Bräutigam Mariä, - Most pure Spouse of Mary, - Sankt Joseph, bitte Tag für Tag bei Jesus, dem Sohn Gottes. - Saint Joseph, pray each day to Jesus, the Son of God. - Seine Kraft und Gnade soll uns stärken, - May His power and grace strengthen us, - dass wir siegreich streiten im Leben - that we may fight victoriously in life - und die Krone von Ihm erhalten im Sterben. - and receive the crown from Him at death. -

+ + + +

+ Jungfräulicher Vater Jesu, + Virgin Father of Jesus, + Reinster Bräutigam Mariä, + Most pure Spouse of Mary, + Sankt Joseph, bitte Tag für Tag bei Jesus, dem Sohn Gottes. + Saint Joseph, pray each day to Jesus, the Son of God. + Seine Kraft und Gnade soll uns stärken, + May His power and grace strengthen us, + dass wir siegreich streiten im Leben + that we may fight victoriously in life + und die Krone von Ihm erhalten im Sterben. + and receive the crown from Him at death. +

+
diff --git a/src/lib/components/prayers/MichaelGebet.svelte b/src/lib/components/prayers/MichaelGebet.svelte index 830351d..ad1f26e 100644 --- a/src/lib/components/prayers/MichaelGebet.svelte +++ b/src/lib/components/prayers/MichaelGebet.svelte @@ -1,32 +1,38 @@ -

- Sáncte Míchael Archángele, - Heiliger Erzengel Michael, - Saint Michael the Archangel, - defénde nos in proélio, - verteidige uns im Kampfe! - defend us in battle. - cóntra nequítam et insídias - Gegen die Bosheit und Nachstellungen - Be our protection against the wickedness - diáboli ésto præsídium. - des Teufels sei unser Schutz. - and snares of the devil. - Ímperet ílli Déus, súpplices deprecámur: - »Gott gebiete ihm!«, so bitten wir flehentlich. - May God rebuke him, we humbly pray; - tuque, Prínceps milítæ cæléstis, - Du aber, Fürst der himmlischen Heerscharen, - and do thou, O Prince of the heavenly host, - Sátanam aliósque spíritus malígnos, - stosse den Satan und die anderen bösen Geister, - by the power of God, thrust into hell Satan - qui ad perditiónem animárum - pervagántur in múndo, - die in der Welt umhergehen, - um die Seelen zu verderben, - and all the evil spirits - who prowl about the world seeking the ruin of souls. - divína virtúte, in inférnum detrúde. Amen. - durch die Kraft Gottes in die Hölle. Amen. - Amen. -

+ + + +

+ Sáncte Míchael Archángele, + Heiliger Erzengel Michael, + Saint Michael the Archangel, + defénde nos in proélio, + verteidige uns im Kampfe! + defend us in battle. + cóntra nequítam et insídias + Gegen die Bosheit und Nachstellungen + Be our protection against the wickedness + diáboli ésto præsídium. + des Teufels sei unser Schutz. + and snares of the devil. + Ímperet ílli Déus, súpplices deprecámur: + »Gott gebiete ihm!«, so bitten wir flehentlich. + May God rebuke him, we humbly pray; + tuque, Prínceps milítæ cæléstis, + Du aber, Fürst der himmlischen Heerscharen, + and do thou, O Prince of the heavenly host, + Sátanam aliósque spíritus malígnos, + stosse den Satan und die anderen bösen Geister, + by the power of God, thrust into hell Satan + qui ad perditiónem animárum + pervagántur in múndo, + die in der Welt umhergehen, + um die Seelen zu verderben, + and all the evil spirits + who prowl about the world seeking the ruin of souls. + divína virtúte, in inférnum detrúde. Amen. + durch die Kraft Gottes in die Hölle. Amen. + Amen. +

+
diff --git a/src/lib/components/prayers/Prayer.svelte b/src/lib/components/prayers/Prayer.svelte index 0b67dbf..a980e34 100644 --- a/src/lib/components/prayers/Prayer.svelte +++ b/src/lib/components/prayers/Prayer.svelte @@ -2,7 +2,7 @@ import type { Snippet } from 'svelte'; import { getLanguageContext } from '$lib/contexts/languageContext.js'; - let { latinPrimary = true, children } = $props<{ latinPrimary?: boolean, children?: Snippet }>(); + let { latinPrimary = true, hasLatin = true, children } = $props<{ latinPrimary?: boolean, hasLatin?: boolean, children?: Snippet }>(); // Get context if available (graceful fallback for standalone usage) let showLatinStore; @@ -47,6 +47,12 @@ .prayer-wrapper :global(v:lang(de)), .prayer-wrapper :global(v:lang(en)) { color: grey; } +/* No-Latin prayers: vernacular gets primary color */ +.prayer-wrapper.no-latin :global(v:lang(de)), +.prayer-wrapper.no-latin :global(v:lang(en)) { + color: var(--nord6); +} + /* Vernacular primary overrides */ .prayer-wrapper.vernacular-primary :global(v:lang(de)), .prayer-wrapper.vernacular-primary :global(v:lang(en)) { @@ -67,7 +73,9 @@ .prayer-wrapper :global(v:lang(la)), .prayer-wrapper.vernacular-primary :global(v:lang(de)), .prayer-wrapper.vernacular-primary :global(v:lang(en)), - .prayer-wrapper.monolingual :global(v:not(:lang(la))) { + .prayer-wrapper.monolingual :global(v:not(:lang(la))), + .prayer-wrapper.no-latin :global(v:lang(de)), + .prayer-wrapper.no-latin :global(v:lang(en)) { color: black; } } @@ -145,6 +153,7 @@ class="prayer-wrapper" class:vernacular-primary={!latinPrimary} class:monolingual={!showLatin} + class:no-latin={!hasLatin} class:lang-de={urlLang === 'de'} class:lang-en={urlLang === 'en'} > diff --git a/src/routes/[faithLang=faithLang]/[prayers=prayersLang]/+page.svelte b/src/routes/[faithLang=faithLang]/[prayers=prayersLang]/+page.svelte index c96ba98..b9ed564 100644 --- a/src/routes/[faithLang=faithLang]/[prayers=prayersLang]/+page.svelte +++ b/src/routes/[faithLang=faithLang]/[prayers=prayersLang]/+page.svelte @@ -1,9 +1,11 @@ @@ -70,13 +221,9 @@ @media (max-width: 800px) { .container{ column-count: 1; - padding-left: calc((100% - 600px ) * 0.5); /* ugly*/ + padding-left: calc((100% - 600px) * 0.5); } } -:global(.container > *){ - break-inside: avoid-column; /* Prevent children from splitting across columns */ - margin-bottom: 1em; -} h1{ text-align: center; font-size: 3rem; @@ -86,6 +233,37 @@ h1{ justify-content: center; margin-bottom: 2rem; } + +/* Search result styling */ +.prayer-wrapper { + position: relative; + break-inside: avoid-column; + margin-bottom: 1em; +} +.prayer-wrapper.no-match { + display: none; +} +.prayer-wrapper.secondary-match { + opacity: 0.7; +} +.prayer-wrapper.secondary-match::before { + content: attr(data-match-label); + position: absolute; + top: 0.3em; + right: 0.3em; + font-size: 0.65em; + padding: 0.2em 0.5em; + background: var(--nord3); + color: var(--nord6); + border-radius: 4px; + z-index: 1; +} +@media(prefers-color-scheme: light) { + .prayer-wrapper.secondary-match::before { + background: var(--nord4); + color: var(--nord0); + } +}

{labels.title}

@@ -93,56 +271,49 @@ h1{ + +
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

{labels.gloriaIntro}

- -
- - - - - - - - - - - - - - - - +{#each sortedPrayers as prayer (prayer.id)} +
+ {#if prayer.id === 'gloria'} + +

{labels.gloriaIntro}

+ +
+ {:else} + + {#if prayer.id === 'signOfCross'} + + {:else if prayer.id === 'gloriaPatri'} + + {:else if prayer.id === 'paternoster'} + + {:else if prayer.id === 'credo'} + + {:else if prayer.id === 'aveMaria'} + + {:else if prayer.id === 'salveRegina'} + + {:else if prayer.id === 'fatima'} + + {:else if prayer.id === 'michael'} + + {:else if prayer.id === 'bruderKlaus'} + + {:else if prayer.id === 'joseph'} + + {:else if prayer.id === 'confiteor'} + + {/if} + + {/if} +
+{/each}
diff --git a/src/routes/[faithLang=faithLang]/[prayers=prayersLang]/Gebet.svelte b/src/routes/[faithLang=faithLang]/[prayers=prayersLang]/Gebet.svelte index 654ee29..c0b3ce4 100644 --- a/src/routes/[faithLang=faithLang]/[prayers=prayersLang]/Gebet.svelte +++ b/src/routes/[faithLang=faithLang]/[prayers=prayersLang]/Gebet.svelte @@ -1,6 +1,8 @@ -
+{#if href} + +
+

{name}

+ +
+ +
+
+
+{:else} +

{name}

+{/if} diff --git a/src/routes/[faithLang=faithLang]/[prayers=prayersLang]/[prayer]/+page.server.ts b/src/routes/[faithLang=faithLang]/[prayers=prayersLang]/[prayer]/+page.server.ts new file mode 100644 index 0000000..8aced78 --- /dev/null +++ b/src/routes/[faithLang=faithLang]/[prayers=prayersLang]/[prayer]/+page.server.ts @@ -0,0 +1,28 @@ +import type { PageServerLoad } from "./$types"; +import { error } from "@sveltejs/kit"; + +// Valid prayer slugs (both languages) +const validSlugs = new Set([ + 'das-heilige-kreuzzeichen', 'the-sign-of-the-cross', + 'gloria-patri', + 'paternoster', 'our-father', + 'credo', 'nicene-creed', + 'ave-maria', 'hail-mary', + 'salve-regina', + 'das-fatimagebet', 'fatima-prayer', + 'gloria', + 'gebet-zum-hl-erzengel-michael', 'prayer-to-st-michael-the-archangel', + 'bruder-klaus-gebet', 'prayer-of-st-nicholas-of-flue', + 'josephgebet-des-hl-papst-pius-x', 'prayer-to-st-joseph-by-pope-st-pius-x', + 'das-confiteor', 'the-confiteor' +]); + +export const load: PageServerLoad = async ({ params }) => { + if (!validSlugs.has(params.prayer)) { + throw error(404, 'Prayer not found'); + } + + return { + prayer: params.prayer + }; +}; diff --git a/src/routes/[faithLang=faithLang]/[prayers=prayersLang]/[prayer]/+page.svelte b/src/routes/[faithLang=faithLang]/[prayers=prayersLang]/[prayer]/+page.svelte new file mode 100644 index 0000000..a50d5c6 --- /dev/null +++ b/src/routes/[faithLang=faithLang]/[prayers=prayersLang]/[prayer]/+page.svelte @@ -0,0 +1,162 @@ + + + + {prayerName} - Bocken + + + + +
+

{prayerName}

+ +
+ +
+ +
+ {#if prayerId === 'gloria'} +

{gloriaIntro}

+ {/if} +
+ {#if prayerId === 'signOfCross'} + + {:else if prayerId === 'gloriaPatri'} + + {:else if prayerId === 'paternoster'} + + {:else if prayerId === 'credo'} + + {:else if prayerId === 'aveMaria'} + + {:else if prayerId === 'salveRegina'} + + {:else if prayerId === 'fatima'} + + {:else if prayerId === 'gloria'} + + {:else if prayerId === 'michael'} + + {:else if prayerId === 'bruderKlaus'} + + {:else if prayerId === 'joseph'} + + {:else if prayerId === 'confiteor'} + + {/if} +
+
+