quoije/oscars-pool
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Tweak navbar blur and admin i18n

Browse Source
This commit is contained in:
Mathieu Moran
2026-02-01 20:56:25 -05:00
parent e0886f2c8a
commit e8745ed88d
5 changed files with 30 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/css/app.css
+16 -3
View File
@@ -400,7 +400,7 @@ footer {
}
/* Smooth navbar transition while i18n loads
- Keep navbar visible but subtly blurred/faded to avoid abrupt disappearance.
- Keep navbar visible with a soft fade/slide to avoid abrupt disappearance.
- Make elements non-interactive until translations are applied. */
body:not(.i18n-ready) nav.navbar,
body:not(.i18n-ready) .navbar,
@@ -409,12 +409,25 @@ body:not(.i18n-ready) .navbar .nav-link,
body:not(.i18n-ready) .navbar .navbar-text,
body:not(.i18n-ready) .navbar .btn {
transition: filter 220ms ease, opacity 220ms ease, transform 220ms ease;
filter: blur(6px) saturate(0.9) grayscale(0.06);
opacity: 0.85;
/* Light mode & default: fully fade out navbar until i18n is ready
so fallback labels never flash. */
opacity: 0;
transform: translateY(-2px);
pointer-events: none;
}
/* Dark mode: keep the original soft blur effect while loading
so the navbar stays visible but its text is obscured. */
html[data-theme="dark"] body:not(.i18n-ready) nav.navbar,
html[data-theme="dark"] body:not(.i18n-ready) .navbar,
html[data-theme="dark"] body:not(.i18n-ready) .navbar .navbar-brand,
html[data-theme="dark"] body:not(.i18n-ready) .navbar .nav-link,
html[data-theme="dark"] body:not(.i18n-ready) .navbar .navbar-text,
html[data-theme="dark"] body:not(.i18n-ready) .navbar .btn {
filter: blur(6px) saturate(0.9) grayscale(0.06);
opacity: 0.85;
}
/* When translations are ready, restore full clarity and interactivity */
body.i18n-ready nav.navbar,
body.i18n-ready .navbar,