make separate component for pageContent

web/src/components/blocks/Blocks.tsx

@@ -13,68 +13,64 @@ import { ContactEntityBlock } from "./ContactEntityBlock";
 import { NeufAddressSectionBlock } from "./NeufAddressSectionBlock";
 import { OpeningHoursSectionBlock } from "./OpeningHoursSectionBlock";
 
-export const Blocks = ({ blocks }: any) => {
+export const Blocks = ({ blocks, pageContent }: { blocks: any, pageContent?: boolean }) => {
   const sections = blocks.filter(
     (block: any) => block?.__typename === "PageSectionBlock"
   );
 
-  return (
-    <div className="blockContent">
-      {blocks.map((block: any) => {
-        switch (block?.blockType) {
-          case "RichTextBlock":
-            return <RichTextBlock block={block} />;
-            break;
-          case "ImageWithTextBlock":
-            return <ImageWithTextBlock block={block} />;
-            break;
-            case "EmbedBlock":
-              return <EmbedBlock block={block} />;
-              break;
-          case "ImageSliderBlock":
-            return <ImageSliderBlock block={block} />;
-            break;
-          case "HorizontalRuleBlock":
-            return <HorizontalRuleBlock block={block} />;
-            break;
-          case "FeaturedBlock":
-            return <FeaturedBlock block={block} />;
-            break;
-          case "AccordionBlock":
-            return <AccordionBlock block={block} />;
-            break;
-          case "FactBoxBlock":
-            return <FactBoxBlock block={block} />;
-            break;
-          case "PageSectionBlock":
-            return <PageSectionBlock block={block} />;
-            break;
-          case "PageSectionNavigationBlock":
-            return <PageSectionNavigationBlock sections={sections} />;
-            break;
-          case "ContactSectionBlock":
-            return <ContactSectionBlock block={block} />;
-            break;
-          case "ContactSubsectionBlock":
-            return <ContactSubsectionBlock block={block} />;
-            break;
-          case "ContactListBlock":
-            return <ContactListBlock block={block} />;
-            break;
-          case "ContactEntityBlock":
-            return <ContactEntityBlock block={block} />;
-            break;
-          case "NeufAddressSectionBlock":
-            return <NeufAddressSectionBlock />;
-            break;
-          case "OpeningHoursSectionBlock":
-            return <OpeningHoursSectionBlock />;
-            break;
-          default:
-            console.log("unsupported block", block);
-            return <div>Unsupported block type {block?.blockType}</div>;
-        }
-      })}
-    </div>
-  )
+  return blocks.map((block: any) => {
+    switch (block?.blockType) {
+      case "RichTextBlock":
+        return <RichTextBlock block={block} />;
+        break;
+      case "ImageWithTextBlock":
+        return <ImageWithTextBlock block={block} />;
+        break;
+        case "EmbedBlock":
+          return <EmbedBlock block={block} />;
+          break;
+      case "ImageSliderBlock":
+        return <ImageSliderBlock block={block} pageContent />;
+        break;
+      case "HorizontalRuleBlock":
+        return <HorizontalRuleBlock block={block} />;
+        break;
+      case "FeaturedBlock":
+        return <FeaturedBlock block={block} />;
+        break;
+      case "AccordionBlock":
+        return <AccordionBlock block={block} />;
+        break;
+      case "FactBoxBlock":
+        return <FactBoxBlock block={block} />;
+        break;
+      case "PageSectionBlock":
+        return <PageSectionBlock block={block} />;
+        break;
+      case "PageSectionNavigationBlock":
+        return <PageSectionNavigationBlock sections={sections} />;
+        break;
+      case "ContactSectionBlock":
+        return <ContactSectionBlock block={block} />;
+        break;
+      case "ContactSubsectionBlock":
+        return <ContactSubsectionBlock block={block} />;
+        break;
+      case "ContactListBlock":
+        return <ContactListBlock block={block} />;
+        break;
+      case "ContactEntityBlock":
+        return <ContactEntityBlock block={block} />;
+        break;
+      case "NeufAddressSectionBlock":
+        return <NeufAddressSectionBlock />;
+        break;
+      case "OpeningHoursSectionBlock":
+        return <OpeningHoursSectionBlock />;
+        break;
+      default:
+        console.log("unsupported block", block);
+        return <div>Unsupported block type {block?.blockType}</div>;
+    }
+  });
 };

web/src/components/blocks/ImageSliderBlock.tsx

@@ -14,12 +14,14 @@ import "./swiper.scss";
 export const ImageSliderBlock = ({
   block,
   hero,
+  pageContent
 }: {
   block: ImageSliderBlockType | any;
   hero?: boolean;
+  pageContent?: boolean;
 }) => {
   return (
-    <div className={styles.imageSliderBlock} data-hero={hero}>
+    <div className={styles.imageSliderBlock} data-hero={hero} data-pageContent={pageContent}>
       <Swiper
         pagination={{
           type: "fraction",

web/src/components/blocks/imageSliderBlock.module.scss

@@ -43,7 +43,13 @@
   }
 
   &:last-child {
-    margin-bottom: calc(var(--spacing-section-bottom)*-1);
+    margin-bottom: 0;
+  }
+
+  &[data-pageContent]{
+    &:last-child {
+      margin-bottom: calc(var(--spacing-section-bottom)*-1);
+    }
   }
 
   &[data-hero] {

web/src/components/general/PageContent.tsx

@@ -0,0 +1,10 @@
+import { Blocks } from "@/components/blocks/Blocks";
+import styles from './pageContent.module.scss';
+
+export const PageContent = ({ blocks }: any) => {
+  return (
+    <div className={styles.pageContent}>
+      <Blocks blocks={blocks} pageContent />
+    </div>
+  )
+};

web/src/components/general/accordion.module.scss

@@ -52,10 +52,6 @@
 .accordionContent {
   padding: var(--spacing-m) 0 var(--spacing-s);
   display: none;
-
-  >div {
-    padding-bottom: 0;
-  }
 }
 
 .icon {

web/src/components/general/pageContent.module.scss

@@ -0,0 +1,3 @@
+.pageContent {
+  padding-bottom: var(--spacing-section-bottom);
+}