fix: lighter footer, dot-only card tags, deselect_all fr translation
Build and Deploy Verso / deploy (push) Successful in 14m46s
Build and Deploy Verso / deploy (push) Successful in 14m46s
- Footer: pale teal (#edf7f4) with noise grain instead of dark navy; serif author credit darker (#1a2e3b), right col monospace muted; teal→blue 2px stripe preserved; same treatment on login page - Card tags: render as 8px coloured dots only (title attr for tooltip) — no text means no wrapping, consistent card heights across the grid - i18n fr.json: add deselect_all → "Tout désélectionner" Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
claude
@@ -106,26 +106,14 @@ const ProjectCard = memo(function ProjectCard({
|
||||
</div>
|
||||
{projectTags.length > 0 && (
|
||||
<div className="lumiere-card-tags">
|
||||
{projectTags.map(tag => {
|
||||
const color = getTagColor(tag)
|
||||
return (
|
||||
{projectTags.map(tag => (
|
||||
<span
|
||||
key={tag._id}
|
||||
className="lumiere-card-tag"
|
||||
style={{
|
||||
backgroundColor: color + '22',
|
||||
color,
|
||||
borderColor: color + '55',
|
||||
}}
|
||||
>
|
||||
<span
|
||||
className="lumiere-card-tag-dot"
|
||||
style={{ backgroundColor: color }}
|
||||
style={{ backgroundColor: getTagColor(tag) }}
|
||||
title={tag.name}
|
||||
/>
|
||||
{tag.name}
|
||||
</span>
|
||||
)
|
||||
})}
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
<span className="lumiere-card-date">{date}</span>
|
||||
|
||||
@@ -52,17 +52,17 @@
|
||||
}
|
||||
|
||||
// ── Login page footer — Lumière override ──────────────────────────────────────
|
||||
// Same dark-navy treatment as the project page footer.
|
||||
// Same light-teal treatment as the project page footer.
|
||||
body:has(.login-page) footer.site-footer {
|
||||
position: relative;
|
||||
background-color: #0d1b24 !important;
|
||||
background-color: #edf7f4 !important;
|
||||
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.28'/%3E%3C/svg%3E") !important;
|
||||
background-size: 200px 200px !important;
|
||||
background-repeat: repeat !important;
|
||||
border-top: none !important;
|
||||
color: rgba(255, 255, 255, 0.38) !important;
|
||||
color: #64748b !important;
|
||||
font-size: 0.78rem;
|
||||
letter-spacing: 0.03em;
|
||||
letter-spacing: 0.025em;
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
@@ -76,7 +76,7 @@ body:has(.login-page) footer.site-footer {
|
||||
}
|
||||
|
||||
a {
|
||||
color: rgba(255, 255, 255, 0.38) !important;
|
||||
color: #64748b !important;
|
||||
text-decoration: none;
|
||||
transition: color 0.15s ease;
|
||||
|
||||
@@ -87,7 +87,8 @@ body:has(.login-page) footer.site-footer {
|
||||
|
||||
.col-lg-9 .site-footer-items > li:first-child a {
|
||||
font-family: Georgia, 'Times New Roman', 'DejaVu Serif', serif;
|
||||
color: rgba(255, 255, 255, 0.55) !important;
|
||||
color: #1a2e3b !important;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.col-lg-3 {
|
||||
@@ -95,15 +96,24 @@ body:has(.login-page) footer.site-footer {
|
||||
font-size: 0.70rem;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.07em;
|
||||
color: #94a3b8 !important;
|
||||
|
||||
a {
|
||||
color: #94a3b8 !important;
|
||||
|
||||
&:hover {
|
||||
color: #2a9d8f !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.text-muted {
|
||||
color: rgba(255, 255, 255, 0.16) !important;
|
||||
color: #b8d4cf !important;
|
||||
}
|
||||
|
||||
--link-color: rgba(255, 255, 255, 0.38);
|
||||
--link-color: #64748b;
|
||||
--link-hover-color: #2a9d8f;
|
||||
--link-visited-color: rgba(255, 255, 255, 0.38);
|
||||
--link-visited-color: #64748b;
|
||||
}
|
||||
|
||||
.login-lumiere-card {
|
||||
|
||||
@@ -663,34 +663,25 @@ $lum-noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' wi
|
||||
}
|
||||
|
||||
// ── Card tags ─────────────────────────────────────────────────────────────
|
||||
// Shown as compact coloured dots only — no text — so cards with/without
|
||||
// tags stay the same height and long tag names never wrap.
|
||||
|
||||
.lumiere-card-tags {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 4px;
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
.lumiere-card-tag {
|
||||
display: inline-flex;
|
||||
flex-wrap: nowrap;
|
||||
gap: 5px;
|
||||
margin-top: 5px;
|
||||
align-items: center;
|
||||
gap: 4px;
|
||||
font-size: 0.65rem;
|
||||
font-weight: 500;
|
||||
padding: 2px 6px;
|
||||
border-radius: 999px;
|
||||
border: 1px solid;
|
||||
max-width: 80px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.lumiere-card-tag-dot {
|
||||
flex-shrink: 0;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-radius: 50%;
|
||||
display: inline-block;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
// ── Selection bar — tool buttons ──────────────────────────────────────────
|
||||
@@ -741,20 +732,20 @@ $lum-noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' wi
|
||||
}
|
||||
|
||||
// ── Footer — Lumière override ─────────────────────────────────────────────────
|
||||
// Dark-navy footer with noise texture, gradient accent stripe, and two type
|
||||
// treatments: serif copyright on the left, monospace meta links on the right.
|
||||
// Pale teal canvas with noise grain, 2px teal→blue accent stripe at top.
|
||||
// Left col: serif author credit. Right col: monospace/uppercase meta links.
|
||||
// !important beats :root [data-theme='default'] .project-ds-nav-page footer.site-footer.
|
||||
|
||||
.project-list-lumiere footer.site-footer {
|
||||
position: relative;
|
||||
background-color: #0d1b24 !important;
|
||||
background-color: #edf7f4 !important;
|
||||
background-image: #{$lum-noise} !important;
|
||||
background-size: 200px 200px !important;
|
||||
background-repeat: repeat !important;
|
||||
border-top: none !important;
|
||||
color: rgba(255, 255, 255, 0.38) !important;
|
||||
color: #64748b !important;
|
||||
font-size: 0.78rem;
|
||||
letter-spacing: 0.03em;
|
||||
letter-spacing: 0.025em;
|
||||
|
||||
// Teal-to-blue gradient stripe matching the navbar accent
|
||||
&::before {
|
||||
@@ -769,7 +760,7 @@ $lum-noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' wi
|
||||
}
|
||||
|
||||
a {
|
||||
color: rgba(255, 255, 255, 0.38) !important;
|
||||
color: #64748b !important;
|
||||
text-decoration: none;
|
||||
transition: color 0.15s ease;
|
||||
|
||||
@@ -781,7 +772,8 @@ $lum-noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' wi
|
||||
// Author credit — warm serif for a human touch
|
||||
.col-lg-9 .site-footer-items > li:first-child a {
|
||||
font-family: Georgia, 'Times New Roman', 'DejaVu Serif', serif;
|
||||
color: rgba(255, 255, 255, 0.55) !important;
|
||||
color: $lum-text !important;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
// Meta links (AGPL, source code) — subtle monospace/uppercase treatment
|
||||
@@ -790,14 +782,23 @@ $lum-noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' wi
|
||||
font-size: 0.70rem;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.07em;
|
||||
color: $lum-text-muted !important;
|
||||
|
||||
a {
|
||||
color: $lum-text-muted !important;
|
||||
|
||||
&:hover {
|
||||
color: $lum-teal !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Pipe separators — nearly invisible
|
||||
// Pipe separators
|
||||
.text-muted {
|
||||
color: rgba(255, 255, 255, 0.16) !important;
|
||||
color: #b8d4cf !important;
|
||||
}
|
||||
|
||||
--link-color: rgba(255, 255, 255, 0.38);
|
||||
--link-color: #64748b;
|
||||
--link-hover-color: #{$lum-teal};
|
||||
--link-visited-color: rgba(255, 255, 255, 0.38);
|
||||
--link-visited-color: #64748b;
|
||||
}
|
||||
|
||||
@@ -333,6 +333,7 @@
|
||||
"deleting": "Suppression en cours",
|
||||
"demonstrating_git_integration": "Démonstration de l’intégration Git",
|
||||
"department": "Département",
|
||||
"deselect_all": "Tout désélectionner",
|
||||
"descending": "Descendant",
|
||||
"description": "Description",
|
||||
"dictionary": "Dictionnaire",
|
||||
|
||||
Reference in New Issue
Block a user