alois/Verso
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: target footer.site-footer (ThinFooter) in Lumière theme
Build and Deploy Verso / deploy (push) Successful in 14m49s
Details

Browse Source 
Verso forces showThinFooter=true for non-SaaS instances, rendering
footer.site-footer everywhere — never .fat-footer. All previous footer
theme rules silently matched nothing. Fix both project and login page
footer selectors. Also increase login logo max-width to 520px, and
remove bottom inset/radius from thumbnail (folder-behind-card effect).

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
claude
2026-06-12 12:23:36 +00:00
parent f9622820c7
commit 194ffe54db
2 changed files with 23 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files
services/web/frontend/stylesheets/pages/login-register.scss
+9 -12
View File
@@ -47,25 +47,22 @@
.verso-login-logo {
display: block;
margin: 0 auto;
max-width: 400px;
max-width: 520px;
}
}
// ── Login page footer — Lumière override ──────────────────────────────────────
body:has(.login-page) .fat-footer {
background: #c8e4de !important;
// Verso always renders ThinFooter (footer.site-footer), not .fat-footer.
body:has(.login-page) footer.site-footer {
background-color: #c8e4de !important;
color: #1a2e3b !important;
border-top: 1px solid rgba(42, 157, 143, 0.2);
border-top-color: rgba(42, 157, 143, 0.2) !important;
.footer-section-heading {
color: #2a9d8f !important;
}
a {
color: #64748b !important;
.fat-footer-base {
color: #4a5568 !important;
#language-picker-toggle {
color: #64748b !important;
&:hover {
color: #2a9d8f !important;
}
}
services/web/frontend/stylesheets/pages/project-list-lumiere.scss
+14 -19
View File
@@ -547,12 +547,12 @@ $lum-noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' wi
top: 6px;
left: 6px;
right: 6px;
bottom: 6px;
bottom: 0;
width: calc(100% - 12px);
height: calc(100% - 12px);
height: calc(100% - 6px);
object-fit: cover;
object-position: top center;
border-radius: 4px;
border-radius: 4px 4px 0 0;
z-index: 1;
transition: transform 0.18s ease;
}
@@ -663,29 +663,24 @@ $lum-noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' wi
}
// ── Footer — Lumière override ─────────────────────────────────────────────────
// The dark theme rule is :root [data-theme='default'] .project-ds-nav-page
// .fat-footer with specificity (0,4,0), which beats a plain class selector.
// We use !important on actual properties to guarantee the light-teal look
// regardless of the user's theme preference.
// Verso always renders a ThinFooter (site-footer) because showThinFooter is
// forced true for non-SaaS instances. Target footer.site-footer, not .fat-footer.
// !important beats the dark theme rule:
// :root [data-theme='default'] .project-ds-nav-page footer.site-footer (0,3,1).
.project-list-lumiere .fat-footer {
background: #c8e4de !important;
.project-list-lumiere footer.site-footer {
background-color: #c8e4de !important;
color: $lum-text !important;
border-top: 1px solid $lum-border;
border-top-color: $lum-border !important;
.footer-section-heading {
color: $lum-teal !important;
}
a {
color: $lum-text-sub !important;
.fat-footer-base {
color: $lum-text-muted !important;
#language-picker-toggle {
color: $lum-text-sub !important;
&:hover {
color: $lum-teal !important;
}
}
// Links override
--link-color: #{$lum-text-sub};
--link-hover-color: #{$lum-teal};
--link-visited-color: #{$lum-text-sub};