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

prayers: bow-emphasis only for main language

Browse Source
This commit is contained in:
Alexander Bocken
2026-02-02 20:39:11 +01:00
parent 82db2c9e50
commit 95d3be8b82
4 changed files with 80 additions and 149 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/lib/components/prayers/GloriaPatri.svelte
View File

@@ -4,9 +4,9 @@
<Prayer> <Prayer>
<p> <p>
<v lang="la">Glória Patri, et Fílio, et Spirítui Sancto.</v> <v lang="la"><i><sup>⚬</sup></i>Glória Patri, et Fílio, et Spirítui Sancto.</v>
<v lang="de">Ehre sei dem Vater und dem Sohne und dem Hl. Geiste.</v> <v lang="de"><i><sup>⚬</sup></i>Ehre sei dem Vater und dem Sohne und dem Hl. Geiste.</v>
<v lang="en">Glory be to the Father, and to the Son, and to the Holy Spirit.</v> <v lang="en"><i><sup>⚬</sup></i>Glory be to the Father, and to the Son, and to the Holy Spirit.</v>
<v lang="la">Sicut erat in princípio, et nunc, et semper:</v> <v lang="la">Sicut erat in princípio, et nunc, et semper:</v>
<v lang="de">Wie es war am Anfang, so auch jetzt und allezeit</v> <v lang="de">Wie es war am Anfang, so auch jetzt und allezeit</v>
<v lang="en">As it was in the beginning, is now, and ever shall be,</v> <v lang="en">As it was in the beginning, is now, and ever shall be,</v>

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

@@ -21,204 +21,124 @@
</script> </script>
<style> <style>
/* === LAYOUT === */
.prayer-wrapper :global(p) { .prayer-wrapper :global(p) {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
} }
/* Reverse order when vernacular is primary */
.prayer-wrapper.vernacular-primary :global(p) { .prayer-wrapper.vernacular-primary :global(p) {
flex-direction: column-reverse; flex-direction: column-reverse;
} }
.prayer-wrapper :global(v) { .prayer-wrapper :global(v) {
margin: 0;
display: block; display: block;
margin: 0;
} }
/* === GERMAN MODE (default, /glaube/*) === */ /* === LANGUAGE VISIBILITY === */
.prayer-wrapper.lang-de :global(v:lang(en)),
/* Hide English in German mode */ .prayer-wrapper.lang-en :global(v:lang(de)),
.prayer-wrapper.lang-de :global(v:lang(en)) { .prayer-wrapper.monolingual :global(v:lang(la)) {
display: none; display: none;
} }
/* Latin primary styling (German mode) */ /* === BASE COLORS (dark mode) === */
.prayer-wrapper.lang-de :global(v:lang(la)) { .prayer-wrapper :global(v:lang(la)) { color: var(--nord6); }
.prayer-wrapper :global(v:lang(de)),
.prayer-wrapper :global(v:lang(en)) { color: grey; }
/* Vernacular primary overrides */
.prayer-wrapper.vernacular-primary :global(v:lang(de)),
.prayer-wrapper.vernacular-primary :global(v:lang(en)) {
color: var(--nord6); color: var(--nord6);
} }
.prayer-wrapper.vernacular-primary :global(v:lang(la)) {
.prayer-wrapper.lang-de :global(v:lang(de)) {
color: grey; color: grey;
} }
@media(prefers-color-scheme: light) { /* Monolingual spacing */
.prayer-wrapper.lang-de :global(v:lang(la)) { .prayer-wrapper.monolingual :global(v:not(: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); color: var(--nord6);
margin-bottom: 0.5em; margin-bottom: 0.5em;
} }
/* === LIGHT MODE === */
@media (prefers-color-scheme: light) { @media (prefers-color-scheme: light) {
.prayer-wrapper.lang-de.monolingual :global(v:lang(de)) { .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))) {
color: black; color: black;
} }
} }
/* === ENGLISH MODE (/faith/*) === */ /* === INLINE / RUBRIC TEXT === */
/* Base: all vernacular inline text is grey */
/* Hide German in English mode */ .prayer-wrapper :global(v[lang=de] > i),
.prayer-wrapper.lang-en :global(v:lang(de)) { .prayer-wrapper :global(v[lang=en] > i) {
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; color: grey;
} }
@media(prefers-color-scheme: light) { /* Monolingual override */
.prayer-wrapper.lang-en :global(v:lang(la)) { .prayer-wrapper.monolingual :global(v[lang=de] > i),
color: black; .prayer-wrapper.monolingual :global(v[lang=en] > i) {
} color: var(--red);
} }
/* Vernacular primary mode (English) */ /* Latin (always emphasized) */
.prayer-wrapper.lang-en.vernacular-primary :global(v:lang(en)) { .prayer-wrapper :global(v[lang=la] > i) {
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); color: var(--nord11);
font-weight: 900; font-weight: 900;
} }
/* === MYSTERY TEXT (shared base) === */
/* Mystery text styling - German mode */ .prayer-wrapper :global(v.mystery-text) {
.prayer-wrapper.lang-de :global(v.mystery-text:lang(la)) {
color: var(--nord11) !important;
font-weight: 700; font-weight: 700;
}
/* Latin mystery — always primary */
.prayer-wrapper :global(v.mystery-text:lang(la)),
.prayer-wrapper :global(v.mystery-text:lang(la) > i) {
color: var(--nord11) !important;
font-size: 1.1em; font-size: 1.1em;
} }
.prayer-wrapper.lang-de :global(v.mystery-text:lang(de)) { /* Vernacular mystery — bilingual only */
.prayer-wrapper:not(.monolingual)
:global(v.mystery-text:lang(de)),
.prayer-wrapper:not(.monolingual)
:global(v.mystery-text:lang(en)),
.prayer-wrapper:not(.monolingual)
:global(v.mystery-text:lang(de) > i),
.prayer-wrapper:not(.monolingual)
:global(v.mystery-text:lang(en) > i) {
color: var(--nord12) !important; color: var(--nord12) !important;
font-weight: 700;
font-size: 0.95em; font-size: 0.95em;
} }
.prayer-wrapper.lang-de.vernacular-primary :global(v.mystery-text:lang(de)) { /* Vernacular-primary emphasis */
.prayer-wrapper.monolingual
:global(v.mystery-text:lang(de)),
.prayer-wrapper.monolingual
:global(v.mystery-text:lang(en)),
.prayer-wrapper.monolingual
:global(v.mystery-text:lang(de) > i),
.prayer-wrapper.monolingual
:global(v.mystery-text:lang(en) > i) {
color: var(--nord11) !important; color: var(--nord11) !important;
font-weight: 700;
font-size: 1.1em; font-size: 1.1em;
} }
.prayer-wrapper.lang-de.vernacular-primary :global(v.mystery-text:lang(la)) { .prayer-wrapper.vernacular-primary
:global(v.mystery-text:lang(la)) {
color: var(--nord12) !important; color: var(--nord12) !important;
font-weight: 700;
font-size: 0.95em; font-size: 0.95em;
} }
.prayer-wrapper.lang-de.monolingual :global(v.mystery-text:lang(la)) { /* Monolingual: hide Latin mystery */
.prayer-wrapper.monolingual
:global(v.mystery-text:lang(la)) {
display: none; display: none;
} }
.prayer-wrapper.lang-de.monolingual :global(v.mystery-text:lang(de)) {
color: var(--nord11) !important;
font-weight: 700;
font-size: 1.1em;
}
/* 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;
}
.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;
}
.prayer-wrapper.lang-en.monolingual :global(v.mystery-text:lang(en)) {
color: var(--nord11) !important;
font-weight: 700;
font-size: 1.1em;
}
</style> </style>
<div <div

2
src/routes/[faithLang=faithLang]/[prayers=prayersLang]/Gebet.svelte
View File

@@ -30,7 +30,7 @@ div.gebet{
.gebet_wrapper{ .gebet_wrapper{
padding: 1em; padding: 1em;
background-color: var(--accent-dark); background-color: var(--accent-dark);
box-shadow: 0 0 1em black; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
max-width: 600px; max-width: 600px;
} }
@media(prefers-color-scheme: light){ @media(prefers-color-scheme: light){

13
src/routes/[faithLang=faithLang]/angelus/+page.svelte
View File

@@ -198,10 +198,21 @@
border-radius: 8px; border-radius: 8px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
position: relative; position: relative;
font-size: 1.25em;
text-align: center;
} }
.prayers-content { .prayers-content {
scroll-snap-type: y proximity; scroll-snap-type: y proximity;
max-width: 700px; max-width: 700px;
} }
v[lang=de] i,
v[lang=en] i{
color: grey;
}
:global(.monolingual) v[lang=de] i,
:global(.monolingual) v[lang=en] i{
color: var(--red);
}
</style> </style>