Fix highlighted state on the white service-box variant

BewerbungWebseite/Pages/Shared/_PortfolioStyles.cshtml

@@ -23,6 +23,16 @@
             overflow-wrap: break-word;
         }
 
+        /* Grosse Ueberschriften (h1) sind meist ein einzelnes Wort oder wenige
+           kurze Woerter -- ein Umbruch mitten im Wort sieht dort schlimmer aus
+           als ein leichtes Ueberlaufen. Nur an Leerzeichen umbrechen; ein
+           einzelnes zu langes Wort laeuft notfalls ueber statt zerrissen zu
+           werden. */
+        #hero h1, #about h1, #skills h1, #projects h1, #goals h1, #experience h1, #documents h1, #contact h1 {
+            overflow-wrap: normal;
+            word-break: normal;
+        }
+
         #about {
             background: #fff;
         }
@@ -162,6 +172,13 @@
             background-size: cover;
             background-position: center;
             background-repeat: no-repeat;
+
+            /* Feste Innenabstaende statt sich auf die Zentrierung durch
+               align-items: center zu verlassen: bei kurzem Text sackt der
+               Inhalt sonst so weit nach oben, dass der Kicker unter der
+               halbtransparenten Nav-Leiste verschwindet, und unten fehlt
+               dann Platz nach den Social-Links. */
+            padding: 140px 0 60px;
         }
 
         #hero .slider-content h1 {
@@ -175,7 +192,6 @@
         #hero .slider-thumb-images img {
             aspect-ratio: 1 / 1;
             object-fit: cover;
-            clip-path: polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%);
         }
 
         #hero .hero-actions {

BewerbungWebseite/wwwroot/css/page-editor.css

@@ -82,6 +82,16 @@
     cursor: text;
 }
 
+/* Grosse Ueberschriften (h1) sind meist ein einzelnes Wort oder wenige kurze
+   Woerter -- ein Umbruch mitten im Wort (siehe oben) sieht dort schlimmer aus
+   als ein leichtes Ueberlaufen. Deshalb hier zurueck auf normales Verhalten:
+   nur an Leerzeichen umbrechen, ein einzelnes zu langes Wort laeuft notfalls
+   ueber statt zerrissen zu werden. */
+.pe-editing h1[contenteditable="true"] {
+    overflow-wrap: normal;
+    word-break: normal;
+}
+
 .pe-editing [contenteditable="true"]:focus {
     outline: 2px solid #2f6bff;
     background: rgba(47, 107, 255, .08);

BewerbungWebseite/wwwroot/css/style.css

@@ -2813,9 +2813,30 @@ li.nav-item {
   bottom: 0;
   transition: 0.5s;
 }
-.active.techno-sinlge-service-box:hover:before {
+.active.techno-sinlge-service-box-1:before {
+  position: absolute;
+  content: "";
+  z-index: -1;
+  width: 100%;
+  height: 100%;
+  background: #ed2c41;
+  left: 0;
+  bottom: 0;
+  transition: 0.5s;
+}
+.active.techno-sinlge-service-box:hover:before,
+.active.techno-sinlge-service-box-1:hover:before {
   height: 0;
 }
+.active.techno-sinlge-service-box-1:hover .techno-service-icon i {
+  color: #ed2c41;
+}
+.active.techno-sinlge-service-box-1:hover .techno-service-title h2 {
+  color: #151423;
+}
+.active.techno-sinlge-service-box-1:hover .techno-service-title p {
+  color: #33354b;
+}
 .active.techno-sinlge-service-box:hover .techno-service-icon i {
   color: #ed2c41;
 }

BewerbungWebseite/wwwroot/js/page-editor.js

@@ -75,11 +75,34 @@
         return text.trim();
     }
 
+    // Liest den sichtbaren Text eines Feldes. Der Zeichenzaehler (.pe-charcount)
+    // steht bei den meisten Feldern als Geschwister ausserhalb -- bei der
+    // hervorgehobenen letzten Hero-Titelzeile aber technisch bedingt *innerhalb*
+    // desselben Elements, das hier ausgelesen wird (Feld und Listen-Eintrag sind
+    // dort zwei verschachtelte Elemente statt eines). Ohne dieses Ausblenden
+    // wuerde "3 / 50" als echter Text mitgespeichert. Kurzes Verstecken statt
+    // eines Klons, damit innerText zuverlaessig auf dem echten, gerenderten
+    // Element berechnet wird (auf einem loesgeloesten Klon liefert innerText in
+    // manchen Browsern keine verlaesslichen Werte).
     function readValue(node) {
         if (node.tagName === "INPUT" || node.tagName === "TEXTAREA") {
             return node.value;
         }
-        return normalizeText(node.innerText, node.dataset.multiline === "true");
+
+        var counters = node.querySelectorAll(".pe-charcount");
+        var previousDisplay = [];
+        counters.forEach(function (counter, i) {
+            previousDisplay[i] = counter.style.display;
+            counter.style.display = "none";
+        });
+
+        var text = node.innerText;
+
+        counters.forEach(function (counter, i) {
+            counter.style.display = previousDisplay[i];
+        });
+
+        return normalizeText(text, node.dataset.multiline === "true");
     }
 
     function collect(container) {