Veranstaltungsliste für Artikelseiten

gfi-ihk-2024/stories/components/magazine-article/MagazineArticleComponent.js

@@ -7,6 +7,7 @@ import {createBlockquote} from "../../atoms/blockquote/BlockquoteComponent";
 import {createContact} from "../contact/ContactComponent";
 import {createPrintShare} from "../print-share/PrintShareComponent";
 import {createInfobox} from "../infobox/InfoboxComponent";
+import {createEventsSection} from "../../sections/events/EventsComponent";
 
 export const createMagazineArticle = ({
   addArticleComponents = true,
@@ -33,6 +34,7 @@ export const createMagazineArticle = ({
     createElement('p', [], lorem2, article);
     createElement('h2', [], 'Consectetur adipisicing elit', article);
     createElement('p', [], lorem2, article);
+    article.appendChild(createEventsSection({}));
     article.appendChild(createBlockquote({}));
     article.appendChild(createContact({}));
     article.appendChild(createPrintShare({}));

gfi-ihk-2024/stories/pages/article/ArticlePage.js

@@ -11,6 +11,7 @@ import {createSurvey} from "../../sections/survey/SurveyComponent";
 import {createAnchorLinks} from "../../components/anchor-links/AnchorLinksComponent";
 import {lorem1, lorem2} from "../../_global/scripts/lorem";
 import {createVideo} from "../../components/video/VideoComponent";
+import {createEventsSection} from "../../sections/events/EventsComponent";
 
 export const createArticlePage =
   ({
@@ -39,6 +40,7 @@ export const createArticlePage =
     createElement('p', [], 'Beim Förderprogramm go-digital handelt es sich um eine. Das <a href="#">go-digital Förderprogramm</a> richtet sich an Unternehmen mit weniger als 100 Beschäftigten. Gefördert werden die Bereiche IT-Sicherheit, digitale Markterschließung und digitalisierte Geschäftsprozesse.', main);
     createElement('p', [], lorem1, main);
 
+    main.appendChild(createEventsSection({}));
     main.appendChild(createGallery({}));
     main.appendChild(createSteps({}));
     main.appendChild(createAccordion({}));

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

@@ -5,6 +5,12 @@
   padding: var(--section-padding) 0;
   background-color: var(--theme-color-primary-dimmed-04);
 
+  .has-sidebar &,
+  .magazine-article & {
+    padding-left: calc(var(--section-padding) / 2);
+    padding-right: calc(var(--section-padding) / 2);
+  }
+
   .container > h2 {
     margin-top: var(--section-headline-margin);
   }