From c682cb615e5098e6ad8ab699a2ce36edf453da23 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Mathias=20Gla=CC=88ser?= <mathias.glaeser@beaufort.ch>
Date: Wed, 20 May 2026 15:26:20 +0200
Subject: [PATCH] Align score-bar labels and bars in shared list grid columns

---
 styleguide.css | 13 ++++++-------
 1 file changed, 6 insertions(+), 7 deletions(-)

diff --git a/styleguide.css b/styleguide.css
index 5606d23..ca0a3c3 100644
--- a/styleguide.css
+++ b/styleguide.css
@@ -2220,17 +2220,16 @@ section + section {
 /* ========================================================= */
 
 .sg-score-bar-list {
-  display: flex;
-  flex-direction: column;
-  gap: var(--spacing-small);
+  display: grid;
+  grid-template-columns: var(--layout-score-bar-item-columns);
+  column-gap: var(--layout-score-bar-item-gap);
+  row-gap: var(--spacing-small);
+  align-items: center;
   width: 100%;
 }
 
 .sg-score-bar-item {
-  display: grid;
-  grid-template-columns: var(--layout-score-bar-item-columns);
-  gap: var(--layout-score-bar-item-gap);
-  align-items: center;
+  display: contents;
 }
 
 .sg-score-bar-list--single-score {