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>
<p>
<v lang="la">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="en">Glory be to the Father, and to the Son, and to the Holy Spirit.</v>
<v lang="la"><i><sup>⚬</sup></i>Glória Patri, et Fílio, et Spirítui Sancto.</v>
<v lang="de"><i><sup>⚬</sup></i>Ehre sei dem Vater und dem Sohne und dem Hl. Geiste.</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="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>

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

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

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

@@ -30,7 +30,7 @@ div.gebet{
.gebet_wrapper{
padding: 1em;
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;
}
@media(prefers-color-scheme: light){

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

@@ -198,10 +198,21 @@
border-radius: 8px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
position: relative;
font-size: 1.25em;
text-align: center;
}
.prayers-content {
scroll-snap-type: y proximity;
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>