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

prayers: add English translations for all prayer components

Browse Source 
Add official Catholic English translations to all prayer components
for /faith/* routes. Prayer names on /faith/prayers are now displayed
in English. Remove unused Angelus.svelte component.
This commit is contained in:
Alexander Bocken
2026-02-02 16:36:34 +01:00
parent 1a5117e8d0
commit 69293c39f9
21 changed files with 584 additions and 243 deletions
Download Patch File Download Diff File Expand all files Collapse all files

196
src/lib/components/prayers/Prayer.svelte
View File

@@ -6,14 +6,18 @@
// Get context if available (graceful fallback for standalone usage)
let showLatinStore;
let langStore;
try {
const context = getLanguageContext();
showLatinStore = context.showLatin;
langStore = context.lang;
} catch {
showLatinStore = null;
langStore = null;
}
let showLatin = $derived(showLatinStore ? $showLatinStore : true);
let urlLang = $derived(langStore ? $langStore : 'de');
</script>
<style>
@@ -22,8 +26,8 @@
flex-direction: column;
}
/* Reverse order when German is primary */
.prayer-wrapper.german-primary :global(p) {
/* Reverse order when vernacular is primary */
.prayer-wrapper.vernacular-primary :global(p) {
flex-direction: column-reverse;
}
@@ -32,97 +36,197 @@
display: block;
}
/* Latin primary (default) */
.prayer-wrapper :global(v:lang(la)) {
/* === GERMAN MODE (default, /glaube/*) === */
/* Hide English in German mode */
.prayer-wrapper.lang-de :global(v:lang(en)) {
display: none;
}
/* Latin primary styling (German mode) */
.prayer-wrapper.lang-de :global(v:lang(la)) {
color: var(--nord6);
}
.prayer-wrapper :global(v:lang(de)) {
.prayer-wrapper.lang-de :global(v:lang(de)) {
color: grey;
}
@media(prefers-color-scheme: light) {
.prayer-wrapper.lang-de :global(v:lang(la)) {
color: black;
}
}
/* Vernacular primary mode (German) */
.prayer-wrapper.lang-de.vernacular-primary :global(v:lang(de)) {
color: var(--nord6);
}
.prayer-wrapper.lang-de.vernacular-primary :global(v:lang(la)) {
color: grey;
}
@media(prefers-color-scheme: light) {
.prayer-wrapper.lang-de.vernacular-primary :global(v:lang(de)) {
color: black;
}
}
/* Monolingual mode (German) - hide Latin, show only German */
.prayer-wrapper.lang-de.monolingual :global(v:lang(la)) {
display: none;
}
.prayer-wrapper.lang-de.monolingual :global(v:lang(de)) {
color: var(--nord6);
margin-bottom: 0.5em;
}
@media(prefers-color-scheme: light) {
.prayer-wrapper.lang-de.monolingual :global(v:lang(de)) {
color: black;
}
}
/* === ENGLISH MODE (/faith/*) === */
/* Hide German in English mode */
.prayer-wrapper.lang-en :global(v:lang(de)) {
display: none;
}
/* Latin primary styling (English mode) */
.prayer-wrapper.lang-en :global(v:lang(la)) {
color: var(--nord6);
}
.prayer-wrapper.lang-en :global(v:lang(en)) {
color: grey;
}
@media(prefers-color-scheme: light) {
.prayer-wrapper.lang-en :global(v:lang(la)) {
color: black;
}
}
/* Vernacular primary mode (English) */
.prayer-wrapper.lang-en.vernacular-primary :global(v:lang(en)) {
color: var(--nord6);
}
.prayer-wrapper.lang-en.vernacular-primary :global(v:lang(la)) {
color: grey;
}
@media(prefers-color-scheme: light) {
.prayer-wrapper.lang-en.vernacular-primary :global(v:lang(en)) {
color: black;
}
}
/* Monolingual mode (English) - hide Latin, show only English */
.prayer-wrapper.lang-en.monolingual :global(v:lang(la)) {
display: none;
}
.prayer-wrapper.lang-en.monolingual :global(v:lang(en)) {
color: var(--nord6);
margin-bottom: 0.5em;
}
@media(prefers-color-scheme: light) {
.prayer-wrapper.lang-en.monolingual :global(v:lang(en)) {
color: black;
}
}
/* === COMMON STYLES === */
.prayer-wrapper :global(i) {
font-style: normal;
color: var(--nord11);
font-weight: 900;
}
@media(prefers-color-scheme: light) {
.prayer-wrapper :global(v:lang(la)) {
color: black;
}
}
/* German primary mode */
.prayer-wrapper.german-primary :global(v:lang(de)) {
color: var(--nord6);
}
.prayer-wrapper.german-primary :global(v:lang(la)) {
color: grey;
}
@media(prefers-color-scheme: light) {
.prayer-wrapper.german-primary :global(v:lang(de)) {
color: black;
}
}
/* Mystery text styling */
.prayer-wrapper :global(v.mystery-text:lang(la)) {
/* Mystery text styling - German mode */
.prayer-wrapper.lang-de :global(v.mystery-text:lang(la)) {
color: var(--nord11) !important;
font-weight: 700;
font-size: 1.1em;
}
.prayer-wrapper :global(v.mystery-text:lang(de)) {
.prayer-wrapper.lang-de :global(v.mystery-text:lang(de)) {
color: var(--nord12) !important;
font-weight: 700;
font-size: 0.95em;
}
.prayer-wrapper.german-primary :global(v.mystery-text:lang(de)) {
.prayer-wrapper.lang-de.vernacular-primary :global(v.mystery-text:lang(de)) {
color: var(--nord11) !important;
font-weight: 700;
font-size: 1.1em;
}
.prayer-wrapper.german-primary :global(v.mystery-text:lang(la)) {
.prayer-wrapper.lang-de.vernacular-primary :global(v.mystery-text:lang(la)) {
color: var(--nord12) !important;
font-weight: 700;
font-size: 0.95em;
}
/* Hide Latin in monolingual mode */
.prayer-wrapper.monolingual :global(v:lang(la)) {
.prayer-wrapper.lang-de.monolingual :global(v.mystery-text:lang(la)) {
display: none;
}
/* German gets primary styling in monolingual mode */
.prayer-wrapper.monolingual :global(v:lang(de)) {
color: var(--nord6);
margin-bottom: 0.5em;
.prayer-wrapper.lang-de.monolingual :global(v.mystery-text:lang(de)) {
color: var(--nord11) !important;
font-weight: 700;
font-size: 1.1em;
}
@media(prefers-color-scheme: light) {
.prayer-wrapper.monolingual :global(v:lang(de)) {
color: black;
}
/* Mystery text styling - English mode */
.prayer-wrapper.lang-en :global(v.mystery-text:lang(la)) {
color: var(--nord11) !important;
font-weight: 700;
font-size: 1.1em;
}
/* Hide Latin mystery text in monolingual mode */
.prayer-wrapper.monolingual :global(v.mystery-text:lang(la)) {
.prayer-wrapper.lang-en :global(v.mystery-text:lang(en)) {
color: var(--nord12) !important;
font-weight: 700;
font-size: 0.95em;
}
.prayer-wrapper.lang-en.vernacular-primary :global(v.mystery-text:lang(en)) {
color: var(--nord11) !important;
font-weight: 700;
font-size: 1.1em;
}
.prayer-wrapper.lang-en.vernacular-primary :global(v.mystery-text:lang(la)) {
color: var(--nord12) !important;
font-weight: 700;
font-size: 0.95em;
}
.prayer-wrapper.lang-en.monolingual :global(v.mystery-text:lang(la)) {
display: none;
}
/* German mystery text gets prominent styling in monolingual mode */
.prayer-wrapper.monolingual :global(v.mystery-text:lang(de)) {
.prayer-wrapper.lang-en.monolingual :global(v.mystery-text:lang(en)) {
color: var(--nord11) !important;
font-weight: 700;
font-size: 1.1em;
}
</style>
<div class="prayer-wrapper" class:german-primary={!latinPrimary} class:monolingual={!showLatin}>
<div
class="prayer-wrapper"
class:vernacular-primary={!latinPrimary}
class:monolingual={!showLatin}
class:lang-de={urlLang === 'de'}
class:lang-en={urlLang === 'en'}
>
{@render children?.()}
</div>