Lang menu and autodetect
All checks were successful
ci / test-commons-core (push) Successful in 56s
ci / analyze (push) Successful in 1m39s
site / deploy (push) Successful in 44s
ci / test-app-seeds (push) Successful in 7m29s
release / fdroid_reference_armeabi_v7a (push) Successful in 42m36s
release / fdroid_reference_arm64_v8a (push) Successful in 33m58s
release / fdroid_reference_x86_64 (push) Successful in 26m15s
release / play (push) Successful in 12m49s

This commit is contained in:
vjrj 2026-07-21 18:24:09 +02:00
parent 1b439e9499
commit 538b28e5d2
6 changed files with 128 additions and 18 deletions

View file

@ -71,9 +71,55 @@ a { color: var(--green); }
}
.site-nav a { color: #fff; text-decoration: none; opacity: .95; white-space: nowrap; }
.site-nav a:hover { text-decoration: underline; }
.lang-switch { display: inline-flex; gap: .6rem; font-size: .92rem; white-space: nowrap; }
.lang-switch .current { opacity: .7; }
.lang-switch a.lang { color: #fff; }
/* A typical globe+code language menu (<details>/<summary>, no JS) instead of
spelling out every language name in the header scales past 3 languages
without crowding the About/Legal links. */
.lang-switch {
position: relative;
font-size: .9rem;
}
.lang-switch summary {
display: inline-flex;
align-items: center;
gap: .35rem;
cursor: pointer;
list-style: none;
padding: .3rem .6rem;
border-radius: 999px;
border: 1px solid rgba(255, 255, 255, .4);
color: #fff;
}
.lang-switch summary::-webkit-details-marker { display: none; }
.lang-switch summary::after { content: "▾"; font-size: .7em; opacity: .85; }
.lang-switch[open] summary::after { content: "▴"; }
.lang-switch summary:hover { border-color: #fff; }
.lang-code { font-weight: 600; letter-spacing: .02em; }
.lang-menu {
position: absolute;
inset-inline-end: 0;
top: calc(100% + .4rem);
margin: 0;
padding: .35rem;
list-style: none;
min-width: 9rem;
background: #fff;
color: var(--title);
border-radius: 10px;
box-shadow: 0 8px 24px rgba(0, 0, 0, .22);
z-index: 10;
}
.lang-menu li + li { margin-top: .1rem; }
.lang-menu a.lang,
.lang-menu span.current {
display: block;
padding: .45rem .6rem;
border-radius: 6px;
text-decoration: none;
white-space: nowrap;
}
.lang-menu a.lang { color: var(--title); }
.lang-menu a.lang:hover { background: var(--container); }
.lang-menu span.current { color: var(--muted); font-weight: 600; }
/* Narrow phones: brand on its own row, nav wraps beneath it, left-aligned. */
@media (max-width: 560px) {