add icon list block and a fun happy placeholder piggy

web/src/components/blocks/IconListBlock.tsx

@@ -0,0 +1,75 @@
+import styles from "./iconListBlock.module.scss";
+
+export const IconListBlock = ({ block }: any) => {
+  return (
+    <div className={styles.iconListBlock}>
+      <ul className={styles.iconList}>
+        <li className={styles.iconListItem}>
+          <div className={styles.icon}>
+            <img src="/assets/icons/neufneuf.svg" />
+          </div>
+          <div className={styles.text}>
+            <h2>Et viktig poeng i denne lista</h2>
+            <p>
+              Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut
+              molestie tortor a interdum blandit. Sed ac purus sit amet libero
+              posuere molestie.
+            </p>
+          </div>
+        </li>
+        <li className={styles.iconListItem}>
+          <div className={styles.icon}>
+            <img src="/assets/icons/neufneuf.svg" />
+          </div>
+          <div className={styles.text}>
+            <h2>Et viktig poeng i denne lista</h2>
+            <p>
+              Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut
+              molestie tortor a interdum blandit. Sed ac purus sit amet libero
+              posuere molestie.
+            </p>
+          </div>
+        </li>
+        <li className={styles.iconListItem}>
+          <div className={styles.icon}>
+            <img src="/assets/icons/neufneuf.svg" />
+          </div>
+          <div className={styles.text}>
+            <h2>Et viktig poeng i denne lista</h2>
+            <p>
+              Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut
+              molestie tortor a interdum blandit. Sed ac purus sit amet libero
+              posuere molestie.
+            </p>
+          </div>
+        </li>
+        <li className={styles.iconListItem}>
+          <div className={styles.icon}>
+            <img src="/assets/icons/neufneuf.svg" />
+          </div>
+          <div className={styles.text}>
+            <h2>Et viktig poeng i denne lista</h2>
+            <p>
+              Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut
+              molestie tortor a interdum blandit. Sed ac purus sit amet libero
+              posuere molestie.
+            </p>
+          </div>
+        </li>
+        <li className={styles.iconListItem}>
+          <div className={styles.icon}>
+            <img src="/assets/icons/neufneuf.svg" />
+          </div>
+          <div className={styles.text}>
+            <h2>Et viktig poeng i denne lista</h2>
+            <p>
+              Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut
+              molestie tortor a interdum blandit. Sed ac purus sit amet libero
+              posuere molestie.
+            </p>
+          </div>
+        </li>
+      </ul>
+    </div>
+  );
+};

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

@@ -0,0 +1,60 @@
+.iconListBlock {
+  margin: 5rem auto;
+  max-width: 68rem;
+}
+
+.iconList {
+  list-style: none;
+  display: grid;
+  grid-template-columns: repeat(2, 1fr);
+  column-gap: var(--spacing-gap-column);
+  row-gap: var(--spacing-gap-row);
+}
+
+.iconListItem {
+  display: flex;
+  align-items: flex-start;
+  gap: 1.6rem;
+
+  &:nth-of-type(3n+1) {
+    .icon {
+      background: var(--color-goldenBeige);
+    }
+  }
+
+  &:nth-of-type(3n+2) {
+    .icon {
+      background: var(--color-neufPink);
+    }
+  }
+
+  &:nth-of-type(3n+3) {
+    .icon {
+      background: var(--color-goldenOrange);
+    }
+  }
+}
+
+.text {
+  margin-bottom: 1rem;
+
+  h2 {
+    font-size: var(--font-size-lead);
+    margin: .5rem 0;
+  }
+}
+
+.icon {
+  flex: none;
+  width: 3.4rem;
+  height: 3.4rem;
+  background: var(--color-goldenBeige);
+  border-radius: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+
+  img {
+    width: 100%;
+  }
+}

web/src/components/general/Body.tsx

@@ -1,9 +1,11 @@
 import { FeaturedBlock } from "../blocks/FeaturedBlock";
+import { IconListBlock } from "../blocks/IconListBlock";
 import styles from "./body.module.scss";
 
 export const Body = () => {
   return (
     <>
+      <IconListBlock />
       <FeaturedBlock />
       <FeaturedBlock />
       <div className={styles.body}>