bugfixing

gfi-ihk-2024/stories/_global/styles/main.scss

@@ -13,7 +13,7 @@
 
   --theme-color-secondary: #56BD66;
   --theme-color-secondary-microsite: var(--theme-color-secondary);
-  --swatches-secondary-700: #247929;
+  --theme-color-secondary-intensed: #247929;
   --theme-color-secondary-dimmed: #E4F1E4;
 
   --theme-color-gradient-01: var(--theme-color-primary);

gfi-ihk-2024/stories/_global/styles/storybook-preview.scss

@@ -93,6 +93,7 @@
 
 .sb-main-padded.sb-show-main > #root > .a-z {
   max-width: 880px;
+  margin-top: var(--section-margin);
 
   .letters {
     top: 0;

gfi-ihk-2024/stories/atoms/badge/BadgeComponent.js

@@ -4,5 +4,5 @@ import {createElement} from "../../_global/scripts/helpers";
 export const createBadge = ({
   count = 8,
 }) => {
-  return createElement('span', ['badge', 'variant-base'], count.toString());
+  return createElement('span', ['badge'], count.toString());
 }

gfi-ihk-2024/stories/components/a-z/a-z.scss

@@ -1,5 +1,6 @@
 @use '../../_global/styles/mixins' as *;
 @use '../../_global/styles/vars' as *;
+@use '../linklist/linklist';
 
 h1 + .a-z {
   margin-top: 30px;
@@ -18,7 +19,7 @@ h1 + .a-z {
   flex-wrap: wrap;
   overflow: hidden;
   margin: 0 0 0 -2px;
-  padding: 10px 0 0;
+  padding: 10px 0 20px;
   z-index: 2;
   box-shadow: 0 -2px 0 0 var(--color-background);
 
@@ -167,13 +168,36 @@ h1 + .a-z {
     .accordion-content .contact-wrapper {
       margin: 0;
     }
+    .accordion {
+      > .linklist {
+        margin-top: 0;
+
+        > li:first-child {
+          border-top: 0;
+        }
+      }
+    }
   }
 }
 
-.a-z{
-  .faq-heading{
+.a-z {
+  .faq-heading {
     margin-top: 10px !important;
   }
+
+  .outer.accordion {
+    margin: 0;
+
+    > .linklist,
+    > ul {
+      border-bottom: none;
+
+      > li {
+        padding-left: var(--linklist-icon-padding);
+        border-top: none;
+      }
+    }
+  }
 }
 .a-z-list{
   .responsiveContainer {

gfi-ihk-2024/stories/components/accordion/AccordionComponent.js

@@ -22,7 +22,7 @@ export const createAccordion =
     if (type === 'regular') {
       items.map((item) => {
         const li = createElement('li', [], null, ul);
-        const a = createElement('a', ['accordion-toggler','variant-subtle-primary-hover'], item.title, li);
+        const a = createElement('a', ['accordion-toggler','variant-subtle-secondary-hover'], item.title, li);
         const content = createElement('div', ['accordion-content'], item.content, li);
 
         // a.href = '#' + item.id;
@@ -41,8 +41,8 @@ export const createAccordion =
     if (type === 'event') {
       items.map((item, index) => {
         const li = createElement('li', [], null, ul);
-        const toggler = createElement('a', ['accordion-toggler','variant-subtle-primary-hover'], null, li);
-        const content = createElement('div', ['accordion-content','variant-subtle-primary'], null, li);
+        const toggler = createElement('a', ['accordion-toggler','variant-subtle-secondary-hover'], null, li);
+        const content = createElement('div', ['accordion-content','variant-subtle-secondary'], null, li);
 
         toggler.href = '#js-event-' + index;
         content.id = 'js-event-' + index;

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

@@ -31,6 +31,7 @@
     > li {
       padding-left: var(--accordion-icon-width);
       border-top: 1px solid var(--color-surface-inset);
+      margin-bottom: 0;
     }
 
     > li.inAccordion {
@@ -387,16 +388,6 @@
     margin-top: 2px;
     list-style-type: none;
   }
-
-  .accordion {
-    > .linklist {
-      margin-top: 0;
-
-      > li:first-child {
-        border-top: 0;
-      }
-    }
-  }
 }
 
 .accordion>.linklist>li.inAccordion.open .accordion-toggler:before, .accordion>ul>li.inAccordion.open .accordion-toggler:before {

gfi-ihk-2024/stories/components/election-form/ElectionFormComponent.js

@@ -17,7 +17,7 @@ export const createElectionForm =
     const electionForm = createElement('div', ['election-form', 'variant-solid'], null, null, inlineStyles);
     createElement('h2', [], title, electionForm);
 
-    const form = createElement('form', ['election-form--form'], null, electionForm);
+    const form = createElement('form', ['election-form--form','variant-base'], null, electionForm);
     const selectWrapper = createElement('div', ['input-wrapper'], null, form);
     selectWrapper.appendChild(createInputSelect({
       placeholder: placeholderElectionGroup,

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

@@ -91,6 +91,14 @@
       @include copyright;
       opacity: 1 !important;
     }
+
+    .btn {
+      background-color: var(--color-button-tertiary-background);
+      color: var(--color-button-tertiary-text);
+      &:after {
+        box-shadow: 0 0 0 var(--button-hover-shadow-size) var(--color-button-tertiary-background);
+      }
+    }
   }
 
   &[data-type="grid"] {

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

@@ -72,6 +72,10 @@ article.col div.strong {
   }
   .infobox--content {
     flex: 1;
+    > .btn {
+      background: var(--color-button-secondary-background);
+      color: var(--color-button-secondary-text);
+    }
   }
   .icon-box {
     flex-shrink: 0;

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

@@ -66,6 +66,7 @@
         left: calc(var(--linklist-focus-padding) * 0.5);
         transform: translate3d(0, 0, 0);
         text-decoration: underline;
+        color: var(--color-decoration);
       }
 
       &:before {

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

@@ -336,7 +336,8 @@
   .secondary {
     position: relative;
     z-index: 1;
-    background-color: var(--swatches-primary-100);
+    background-color: var(--color-button-secondary-background);
+    color: var(--color-button-secondary-text);
     text-align: left;
 
     ul {

gfi-ihk-2024/stories/components/search-form/search-form.scss

@@ -34,6 +34,10 @@
 
   .toggle-actions {
     padding: 30px 0;
+    .btn {
+      background: var(--color-button-tertiary-background);
+      color: var(--color-button-tertiary-text)
+    }
 
     .btn.open::before {
       @include icon-minus;

gfi-ihk-2024/stories/components/superlist-entry/SuperlistEntryComponent.js

@@ -24,7 +24,7 @@ export const createSuperlistEntrySection = ({
         onlyForStorybook.appendChild(section);
     }
 
-    const graphic = createElement('div', ['graphic','variant-solid'], null, section);
+    const graphic = createElement('div', ['graphic', centered ? 'variant-accent' : 'variant-solid'], null, section);
     createElement('div', ['icon-box', icon], null, graphic);
     const container = createElement('div', ['textbox'], null, section);
     createElement('h3', [], headline, container);

gfi-ihk-2024/stories/components/superlist-entry/superlist-entry.scss

@@ -145,13 +145,13 @@
       position: absolute;
       left: 0;
       top: 0;
-      background: var(--color-decoration);
+      background: var(--color-background);
       @media (min-width: 768px) {
         left: 50%;
         transform: translate(-50%, 0);
       }
       .icon-box {
-        color: var(--color-background);
+        color: var(--color-text);
       }
     }
     .textbox {

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

@@ -232,7 +232,7 @@
 }
 
 [date-type='hero'], .teaser.hero, .teaser.pictoHero {
-  .image-box ~ .text-box {
+  .image-box ~ div.text-box {
     padding-top: 0.9em;
 
     .title {

gfi-ihk-2024/stories/sections/quick-facts/quick-facts.scss

@@ -45,7 +45,7 @@
       position: absolute;
       width: 374px;
       height: 374px;
-      background-color: #9AD7A3;
+      background-color: var(--swatches-secondary-300);
       top: 50%;
       left: 50%;
       border-radius: 50%;

gfi-ihk-2024/stories/sections/teasers/teasers.scss

@@ -480,7 +480,7 @@
     bottom: 8px;
   }
 
-  img {
+  :not(.icon) > img {
     position: absolute;
     display: block;
     top: 0;
@@ -499,7 +499,7 @@
       position: relative;
     }
 
-    .image-box ~ .text-box {
+    .image-box ~ div.text-box {
       padding-top: 16px;
 
       h4, .like-h4 {