Bladeren bron

Mehr und verbesserte farben

Leonard Schulz 1 jaar geleden
bovenliggende
commit
a5663d2e14

+ 27 - 6
src/main/resources/static/css/global.css

@@ -36,13 +36,34 @@
 }
 
 /* Alternative Farben mit besserem Kontrast */
-:root[data-color-scheme="alternative"] {
+:root[data-color-scheme="alt-a"] {
   --rot-hell: #ffe6f5;
-  --gelb-hell: #ffeccc;
-  --gruen-hell: #e6f9ff;
-  --rot: #cc0044;
-  --gelb: #b8620e;
-  --gruen: #008a8a;
+  --gelb-hell: #fff2cc;
+  --gruen-hell: #e6f7ff;
+  --rot: #cc0044;   
+  --gelb: #b8620e;  
+  --gruen: #0077b6; 
+}
+
+/* Alternative B – maximale Kontrastunterscheidung */
+:root[data-color-scheme="alt-b"] {
+  --rot-hell: #ffe6f0;
+  --gelb-hell: #e6ebff;
+  --gruen-hell: #eaf7d4;
+  --rot: #d00070;   
+  --gelb:#0040ff ;  
+  --gruen: #7a9e00; 
+}
+
+/* Alternative Pastell (ohne Ampel-Assoziation) */
+:root[data-color-scheme="alt-pastell"] {
+  --rot-hell:#ffeef2  ;  
+  --gelb-hell:#f3e8ff; 
+  --gruen-hell:  #e8f0ff;
+
+  --rot: #e67891;      
+  --gelb: #9d6ee8;     
+  --gruen: #4f9df7;     
 }
 
 /* =============================================================================

+ 3 - 1
src/main/resources/static/js/color-scheme.js

@@ -17,7 +17,9 @@ function toggleColorPicker() {
 function updateColorNames(scheme) {
   const colorNames = {
     'standard': { added: 'grün', removed: 'rot', changed: 'gelb' },
-    'alternative': { added: 'blau', removed: 'pink', changed: 'orange' }
+    'alt-a': { added: 'türkis', removed: 'magenta', changed: 'orange' },
+    'alt-b': { added: 'grün', removed: 'rot', changed: 'blau' },
+    'alt-pastell': { added: 'blau', removed: 'pink', changed: 'lila' }
   };
   
   const names = colorNames[scheme] || colorNames['standard'];

+ 4 - 2
src/main/resources/templates/fragments/legend.html

@@ -29,8 +29,10 @@
       <div class="color-picker-popup hidden" id="colorPickerPopup" role="dialog" aria-labelledby="color-picker-label">
         <label id="color-picker-label" for="colorSchemeSelect">Farbwahl:</label>
         <select id="colorSchemeSelect" class="color-scheme-select" onchange="changeColorScheme(this.value)" aria-describedby="color-scheme-hint">
-          <option value="standard">Standard</option>
-          <option value="alternative">Pastell</option>
+          <option value="standard">Standard (Ampel)</option>
+          <option value="alt-a">Rot-Grün-Schwäche</option>
+          <option value="alt-b">Maximaler Kontrast</option>
+          <option value="alt-pastell">Pastellfarben</option>
         </select>
       </div>
     </div>

+ 0 - 35
src/main/resources/templates/test.html

@@ -36,41 +36,6 @@
     </div>
   </form>
 
-  <!-- Nach erstem Submit: Vorgang/Zeitraum-Auswahl -->
-  <div class="full" th:if="${leftCandidates != null}">
-    <h2>Baseline-Auswahl (links)</h2>
-    <form method="post" action="/vergleich" class="row">
-      <input type="hidden" name="leftJson" th:value="${leftJson}"/>
-      <input type="hidden" name="rightJson" th:value="${rightJson}"/>
-      <input type="hidden" name="validate" th:value="${validate}"/>
-      <input type="hidden" name="schemaName" th:value="${schemaName}"/>
-      <input type="hidden" name="kunde" th:value="${activeKunde}"/>
-
-      <label>Vorgang (links):
-        <select name="leftVorgangId">
-          <option th:each="v : ${leftCandidates}" th:value="${v.id}"
-                  th:text="${v.aktenzeichen != null ? v.aktenzeichen : v.id}"
-                  th:selected="${v.id == leftVorgangId}"></option>
-        </select>
-      </label>
-      <label>Zeitraum (links):
-        <select name="leftZeitraumId">
-          <option th:each="z : ${leftZeitraeumeOfSelected}" th:value="${z.id}"
-                  th:text="${z.beginn} + ' – ' + ${z.ende}"
-                  th:selected="${z.id == leftZeitraumId}"></option>
-        </select>
-      </label>
-      <label>Zeitraum (rechts):
-        <select name="rightZeitraumId">
-          <option th:each="z : ${zeitraeumeRight}" th:value="${z.id}"
-                  th:text="${z.beginn} + ' – ' + ${z.ende}"
-                  th:selected="${z.id == rightZeitraumId}"></option>
-        </select>
-      </label>
-      <button type="submit">Ansicht aktualisieren</button>
-    </form>
-  </div>
-
   <script>
     function updateSchema() {
       const schemaSelect = document.getElementById('schemaSelect');