From 297d0cb79af541ed6810da800c7c99bf57b77d71 Mon Sep 17 00:00:00 2001
From: elise <hei@elisejakob.no>
Date: Fri, 9 Aug 2024 15:20:56 +0200
Subject: [PATCH] add general contact block

---
 web/src/app/kontakt/page.tsx                  |  2 +
 .../components/blocks/GeneralContactBlock.tsx | 29 ++++++++++++++
 .../blocks/contactSection.module.scss         |  4 ++
 .../blocks/generalContactBlock.module.scss    | 38 +++++++++++++++++++
 4 files changed, 73 insertions(+)
 create mode 100644 web/src/components/blocks/GeneralContactBlock.tsx
 create mode 100644 web/src/components/blocks/generalContactBlock.module.scss

diff --git a/web/src/app/kontakt/page.tsx b/web/src/app/kontakt/page.tsx
index 6133e15..c3adc7e 100644
--- a/web/src/app/kontakt/page.tsx
+++ b/web/src/app/kontakt/page.tsx
@@ -3,6 +3,7 @@ import { ContactIndexFragment } from "@/gql/graphql";
 import { getClient } from "@/app/client";
 import { PageHeader } from "@/components/general/PageHeader";
 import { PageContent } from "@/components/general/PageContent";
+import { GeneralContactBlock } from "@/components/blocks/GeneralContactBlock";
 
 const ContactIndexDefinition = graphql(`
   fragment ContactIndex on ContactIndex {
@@ -32,6 +33,7 @@ export default async function Page() {
   return (
     <main className="site-main" id="main">
       <PageHeader heading={index.title} lead={index.lead} />
+      <GeneralContactBlock />
       {index.body && <PageContent blocks={index.body} />}
     </main>
   );
diff --git a/web/src/components/blocks/GeneralContactBlock.tsx b/web/src/components/blocks/GeneralContactBlock.tsx
new file mode 100644
index 0000000..bfc79de
--- /dev/null
+++ b/web/src/components/blocks/GeneralContactBlock.tsx
@@ -0,0 +1,29 @@
+//import { GeneralContactBlock as GeneralContactBlockType } from "@/gql/graphql";
+import styles from "./generalContactBlock.module.scss";
+import { Blocks } from "./Blocks";
+
+export const GeneralContactBlock = ({/*
+  block,
+}: {
+  block: GeneralContactBlockType;
+*/}) => {
+  return (
+    <section className={styles.generalContact}>
+      {/*<Blocks blocks={block.items} />*/}
+      <ul>
+        <li>
+          <span className={styles.label}>Generelle henvendelser</span>
+          <a href="mailto:post@neuf.no" target="_blank">post@neuf.no</a>
+        </li>
+        <li>
+          <span className={styles.label}>Billetter</span>
+          <a href="mailto:billetter@neuf.no" target="_blank">billetter@neuf.no</a>
+        </li>
+        <li>
+          <span className={styles.label}>Hittegods</span>
+          <a href="mailto:hittegods@neuf.no" target="_blank">hittegods@neuf.no</a>
+        </li>
+      </ul>
+    </section>
+  );
+};
diff --git a/web/src/components/blocks/contactSection.module.scss b/web/src/components/blocks/contactSection.module.scss
index c572f49..248304e 100644
--- a/web/src/components/blocks/contactSection.module.scss
+++ b/web/src/components/blocks/contactSection.module.scss
@@ -15,6 +15,10 @@
   &:last-child {
     margin-bottom: 0;
   }
+
+  &:first-child {
+    margin-top: 0;
+  }
 }
 
 .heading {
diff --git a/web/src/components/blocks/generalContactBlock.module.scss b/web/src/components/blocks/generalContactBlock.module.scss
new file mode 100644
index 0000000..b9a81bd
--- /dev/null
+++ b/web/src/components/blocks/generalContactBlock.module.scss
@@ -0,0 +1,38 @@
+.generalContact {
+  margin: calc(var(--spacing-sitepadding-block)*2)
+    calc(var(--spacing-sitepadding-inline) * -1) 0;
+  padding: var(--spacing-sitepadding-block) var(--spacing-sitepadding-inline);
+  background: var(--color-goldenBeige);
+
+  ul {
+    list-style: none;
+    display: grid;
+    grid-template-columns: repeat(3, 1fr);
+    column-gap: var(--spacing-gap-column);
+    row-gap: var(--spacing-gap-row);
+  }
+
+  a {
+    font-family: var(--font-serif);
+    font-size: var(--font-size-lead);
+
+    &:hover {
+      color: var(--color-deepBrick);
+      opacity: 1;
+    }
+  }
+}
+
+.label {
+  font-weight: 600;
+  display: block;
+}
+
+@media (max-width: 800px) {
+  .generalContact {
+    ul {
+      grid-template-columns: 1fr;
+      row-gap: calc(var(--spacing-gap-row)*2);
+    }
+  }
+}
\ No newline at end of file