fixes

gfi-ihk-2024/stories/components/nav/nav.scss

@@ -277,12 +277,6 @@
         top: 50%;
         margin-top: calc(var(--icon-size) / -2);
         text-align: center;
-        @media(max-width: 999px) {
-          top: calc(50% - 3px);
-        }
-        @media(max-width: 767px) {
-          top: calc(50% - 6px);
-        }
       }
 
       @media(max-width: 359px), (max-width: 767px) and (orientation: landscape) {
@@ -299,6 +293,19 @@
         background-color: rgba(var(--theme-color-primary-rgb), 0.06);
       }
     }
+
+    .back {
+      a {
+        &:before {
+          @media(max-width: 999px) {
+            top: calc(50% - 3px);
+          }
+          @media(max-width: 767px) {
+            top: calc(50% - 6px);
+          }
+        }
+      }
+    }
   }
 }
 .page-header {

gfi-ihk-2024/stories/components/testimonial/TestimonialComponent.js

@@ -26,8 +26,10 @@ export const createTestimonial =
 
     const blockquote = createElement('blockquote', [], null, div3);
     createElement('p', [], text, blockquote);
-    createElement('p', ['author'], author, blockquote);
-    createElement('p', ['author-subline'], subline, blockquote);
+    const div4 = createElement('div', ['author-text'], null, blockquote);
+    const div5 = createElement('div', ['author-text--inner'], null, div4);
+    createElement('p', ['author'], author, div5);
+    createElement('p', ['author-subline'], subline, div5);
 
     if (article === true) {
         console.log(article);

gfi-ihk-2024/stories/components/testimonial/testimonial.js

@@ -3,23 +3,29 @@ import $ from 'jquery';
 function moveTestimonialImage() {
     $('.has-sidebar .image-text').each(function () {
         var $container = $(this);
-        var $image = $container.find('.image-text--image');
-        var $firstParagraph = $container.find('.image-text--text blockquote p:first-child');
+        var $image = $container.children('.image-text--image');
+        var $firstParagraph = $container.find('.image-text--text blockquote > p:first-child');
+
+        if ($image.length === 0) return;
 
         if ($(window).width() < 768) {
-            // Bild nach dem ersten Paragraphen einfügen
-            $firstParagraph.after($image);
+            // Nur verschieben, wenn noch nicht verschoben
+            if (!$image.data('moved')) {
+                $firstParagraph.after($image);
+                $image.data('moved', true);
+            }
         } else {
-            // Bild zurück an erste Position im Container
-            $container.prepend($image);
+            // Nur zurück verschieben, wenn verschoben wurde
+            if ($image.data('moved')) {
+                $container.prepend($image);
+                $image.data('moved', false);
+            }
         }
     });
 }
 
-// Beim Laden ausführen
 $(document).ready(function () {
     moveTestimonialImage();
 });
 
-// Bei Resize ausführen
-$(window).on('resize', moveTestimonialImage);
+$(window).on('resize', moveTestimonialImage);

gfi-ihk-2024/stories/components/testimonial/testimonial.scss

@@ -180,13 +180,13 @@
       .image-text--image {
         position: absolute;
         right: 0;
-        bottom: 63px;
+        bottom: 78px;
         width: 100px;
         @media(max-width: 767px) {
           position: relative;
           right: auto;
           bottom: auto;
-          margin: 40px 0 15px 0;
+          margin: 0 0 15px 0;
         }
         &:after {
           display: none;
@@ -201,35 +201,90 @@
       blockquote {
         p:not(.author, .author-subline) {
           margin-left: -40px;
-          padding-bottom: 10px;
+          padding-bottom: 65px;
+          padding-left: 30px;
+          margin-bottom: 0;
           @media(max-width: 767px) {
             margin-left: 0;
+            margin-bottom: 0;
+            padding-left: 0;
+            padding-bottom: 50px;
           }
           &:before {
             margin-left: 0;
           }
+          &:after {
+            left: 0;
+            position: absolute;
+            bottom: 23px;
+            background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0MCA0MCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDAgNDAiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxwYXRoIGQ9Ik0xNyA4LjljLTIuOSAxLjUtNS4xIDMuMi02LjYgNS4yQzkgMTYgOC4zIDE4LjQgOC4zIDIxLjNjLjItLjEuNS0uMSAxLS4xIDIuMSAwIDMuOC43IDUuMyAyIDEuNSAxLjIgMi4yIDMgMi4yIDUuMiAwIDIuNS0uNyA0LjQtMi4xIDUuOS0xLjQgMS40LTMuMiAyLjEtNS40IDIuMS0zLjEgMC01LjQtMS4xLTYuOS0zLjNDLjcgMzAuNyAwIDI3LjYgMCAyMy41YzAtNC42IDEuMS04LjcgMy40LTEyLjJzNS44LTYuNCAxMC40LTguN0wxNyA4Ljl6bTIzIDBjLTIuOSAxLjUtNS4xIDMuMi02LjYgNS4yLTEuNCAxLjktMi4xIDQuMy0yLjEgNy4yLjItLjEuNS0uMSAxLS4xIDIuMSAwIDMuOC43IDUuMyAyIDEuNSAxLjIgMi4yIDMgMi4yIDUuMiAwIDIuNS0uNyA0LjQtMi4xIDUuOS0xLjQgMS40LTMuMiAyLjEtNS40IDIuMS0zLjEgMC01LjQtMS4xLTYuOS0zLjMtMS41LTIuMy0yLjItNS40LTIuMi05LjUgMC00LjYgMS4xLTguNyAzLjQtMTIuMlMzMi40IDUgMzcgMi43bDMgNi4yeiIgc3R5bGU9ImZpbGw6IzU2YmQ2NiIvPjwvc3ZnPg==);
+            background-size: 100%;
+            content: "";
+            display: block;
+            height: 30px;
+            margin: 2px 0 2px 0;
+            transform: rotate(180deg);
+            width: 30px;
+            @media(max-width: 767px) {
+              bottom: 8px;
+            }
+          }
         }
-        .author {
-          margin-top: 66px;
+        .author-text {
+          @media(max-width: 767px) {
+            padding-left: 20px;
+          }
+        }
+        .author-text--inner {
+          position: relative;
+          @media(min-width: 768px) {
+            display: flex;
+            flex-direction: column;
+            width: fit-content;
+            margin-left: auto;
+          }
+          &:before {
+            content: "— ";
+            position: absolute;
+            top: 1px;
+            left: -20px;
+            font-family: Source Sans Pro,sans-serif;
+            font-style: normal;
+            line-height: 1.2;
+            font-size: 18px;
+            font-weight: 600;
+            @media(max-width: 767px) {
+              top: -1px;
+            }
+          }
+        }
+        p.author {
+          margin-top: 0;
           padding-top: 2px;
           @media(max-width: 767px) {
             margin-top: 0;
           }
           &:after {
+            display: none;
             top: -56px;
             @media(max-width: 767px) {
               top: -155px;
             }
           }
+          &:before {
+            display: none;
+          }
         }
-        .author,
-        .author-subline {
+        p.author,
+        p.author-subline {
           padding-right: 115px;
+          text-align: left;
+          @media(max-width: 767px) {
+            padding-left: 0;
+            padding-right: 0;
+          }
         }
       }
-      @media(max-width: 767px) {
-
-      }
     }
   }
 }