From d08e834f49bee2a73a0677648d40104de11af297 Mon Sep 17 00:00:00 2001
From: claude <claude@verso>
Date: Fri, 12 Jun 2026 13:55:36 +0000
Subject: [PATCH] fix: footer default font size, tag dots inline in meta row,
 OLTooltip
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Footer: remove font-size/letter-spacing overrides so the browser
  default applies; monospace right col keeps its uppercase + tracking
  but no longer shrinks the font
- Card tags: move coloured dots into the .lumiere-card-meta flex row
  instead of a separate div — zero added height, all cards uniform
- Card tags tooltip: replace native title attr with OLTooltip (React
  Bootstrap tooltip) for a consistent Verso look on hover

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 .../components/project-list-lumiere.tsx       | 20 ++++++++++---------
 .../stylesheets/pages/login-register.scss     |  3 ---
 .../pages/project-list-lumiere.scss           | 15 +-------------
 3 files changed, 12 insertions(+), 26 deletions(-)

diff --git a/services/web/frontend/js/features/project-list/components/project-list-lumiere.tsx b/services/web/frontend/js/features/project-list/components/project-list-lumiere.tsx
index 5594ed9906..39617178c2 100644
--- a/services/web/frontend/js/features/project-list/components/project-list-lumiere.tsx
+++ b/services/web/frontend/js/features/project-list/components/project-list-lumiere.tsx
@@ -6,6 +6,7 @@ import { getOwnerName } from '../util/project'
 import { fromNowDate } from '../../../utils/dates'
 import { ProjectCompiler } from '../../../../../types/project-settings'
 import { getTagColor } from '../util/tag'
+import OLTooltip from '@/shared/components/ol/ol-tooltip'
 import getMeta from '@/utils/meta'
 import DefaultNavbar from '@/shared/components/navbar/default-navbar'
 import Footer from '@/shared/components/footer/footer'
@@ -103,19 +104,20 @@ const ProjectCard = memo(function ProjectCard({
                   {ownerName}
                 </span>
               )}
-            </div>
-            {projectTags.length > 0 && (
-              <div className="lumiere-card-tags">
-                {projectTags.map(tag => (
+              {projectTags.map(tag => (
+                <OLTooltip
+                  key={tag._id}
+                  id={`tag-${tag._id}-${project.id}`}
+                  description={tag.name}
+                  overlayProps={{ placement: 'top' }}
+                >
                   <span
-                    key={tag._id}
                     className="lumiere-card-tag-dot"
                     style={{ backgroundColor: getTagColor(tag) }}
-                    title={tag.name}
+                    translate="no"
                   />
-                ))}
-              </div>
-            )}
+                </OLTooltip>
+              ))}</div>
             <span className="lumiere-card-date">{date}</span>
           </div>
         </a>
diff --git a/services/web/frontend/stylesheets/pages/login-register.scss b/services/web/frontend/stylesheets/pages/login-register.scss
index fdd5025c1d..cba50d01f6 100644
--- a/services/web/frontend/stylesheets/pages/login-register.scss
+++ b/services/web/frontend/stylesheets/pages/login-register.scss
@@ -61,8 +61,6 @@ body:has(.login-page) footer.site-footer {
   background-repeat: repeat !important;
   border-top: none !important;
   color: #64748b !important;
-  font-size: 0.78rem;
-  letter-spacing: 0.025em;
 
   &::before {
     content: '';
@@ -93,7 +91,6 @@ body:has(.login-page) footer.site-footer {
 
   .col-lg-3 {
     font-family: ui-monospace, 'SFMono-Regular', 'Fira Code', Consolas, monospace;
-    font-size: 0.70rem;
     text-transform: uppercase;
     letter-spacing: 0.07em;
     color: #94a3b8 !important;
diff --git a/services/web/frontend/stylesheets/pages/project-list-lumiere.scss b/services/web/frontend/stylesheets/pages/project-list-lumiere.scss
index 8b8fdb28a7..09a602a0df 100644
--- a/services/web/frontend/stylesheets/pages/project-list-lumiere.scss
+++ b/services/web/frontend/stylesheets/pages/project-list-lumiere.scss
@@ -663,17 +663,7 @@ $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: nowrap;
-    gap: 5px;
-    margin-top: 5px;
-    align-items: center;
-    overflow: hidden;
-  }
+  // Dots live inside .lumiere-card-meta so they add zero extra height.
 
   .lumiere-card-tag-dot {
     flex-shrink: 0;
@@ -744,8 +734,6 @@ $lum-noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' wi
   background-repeat: repeat !important;
   border-top: none !important;
   color: #64748b !important;
-  font-size: 0.78rem;
-  letter-spacing: 0.025em;
 
   // Teal-to-blue gradient stripe matching the navbar accent
   &::before {
@@ -779,7 +767,6 @@ $lum-noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' wi
   // Meta links (AGPL, source code) — subtle monospace/uppercase treatment
   .col-lg-3 {
     font-family: ui-monospace, 'SFMono-Regular', 'Fira Code', Consolas, monospace;
-    font-size: 0.70rem;
     text-transform: uppercase;
     letter-spacing: 0.07em;
     color: $lum-text-muted !important;