From 2b503cd3b2ecc7d1014ccb3cae0587cf80bd9434 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Mathias=20Gla=CC=88ser?= <mathias.glaeser@beaufort.ch>
Date: Sun, 14 Jun 2026 15:55:50 +0200
Subject: [PATCH] Update Gesamtscore chart preview

---
 components/charts.html | 20 +++++++++++++++++++-
 1 file changed, 19 insertions(+), 1 deletion(-)

diff --git a/components/charts.html b/components/charts.html
index 5b8511d..6d59d39 100644
--- a/components/charts.html
+++ b/components/charts.html
@@ -53,7 +53,7 @@
     <p class="sg-preview-label">Component: Gesamtscore-Balken</p>
 
     <div class="sg-form-preview-area sg-chart-preview-area">
-      <div class="sg-score-bar-list sg-score-bar-list--single-score" data-component="score-bar-list">
+      <div class="sg-score-bar-list" data-component="score-bar-list">
         <div class="sg-score-bar-item" data-component="score-bar">
           <p class="sg-score-bar-label sg-bar-label" data-component-part="score-label">Score:</p>
           <div class="sg-score-bar sg-score-bar--marker-mid" data-component-part="score-track">
@@ -62,6 +62,24 @@
           </div>
           <p class="sg-bar-label sg-score-state--positive" data-component-part="score-state">attraktiv</p>
         </div>
+
+        <div class="sg-score-bar-item" data-component="score-bar">
+          <p class="sg-score-bar-label sg-bar-label" data-component-part="score-label">Score:</p>
+          <div class="sg-score-bar sg-score-bar--marker-mid" data-component-part="score-track">
+            <div class="sg-score-bar__value sg-score-bar__value--neutral sg-score-bar__value--w64" data-component-part="score-value" data-component-state="warning"></div>
+            <div class="sg-score-bar__median-marker" data-component-part="score-median-marker"></div>
+          </div>
+          <p class="sg-bar-label sg-score-state--warning" data-component-part="score-state">abwarten</p>
+        </div>
+
+        <div class="sg-score-bar-item" data-component="score-bar">
+          <p class="sg-score-bar-label sg-bar-label" data-component-part="score-label">Score:</p>
+          <div class="sg-score-bar sg-score-bar--marker-mid" data-component-part="score-track">
+            <div class="sg-score-bar__value sg-score-bar__value--negative sg-score-bar__value--w35" data-component-part="score-value" data-component-state="negative"></div>
+            <div class="sg-score-bar__median-marker sg-score-bar__median-marker--outline" data-component-part="score-median-marker" data-component-variant="outline"></div>
+          </div>
+          <p class="sg-bar-label sg-score-state--negative" data-component-part="score-state">unattraktiv</p>
+        </div>
       </div>
     </div>
   </section>