tidy up footer font sizes etc

web/src/components/layout/Footer.tsx

@@ -15,7 +15,7 @@ export const Footer = () => {
       <div className={styles.contact}>
         <ul className={styles.contactList}>
           <li className={styles.contactItem}>
-            <h2>Følg oss</h2>
+            <h2 className="suphead">Følg oss</h2>
             <ul>
               <li>
                 <a href="#" target="_blank">
@@ -40,7 +40,7 @@ export const Footer = () => {
             </ul>
           </li>
           <li className={styles.contactItem}>
-            <h2>Kontakt oss</h2>
+            <h2 className="suphead">Kontakt oss</h2>
             <p>
               Generell kontaktinfo
               <br />
@@ -54,7 +54,7 @@ export const Footer = () => {
             </p>
           </li>
           <li className={styles.contactItem}>
-            <h2>Besøk oss</h2>
+            <h2 className="suphead">Besøk oss</h2>
             <p>
               Det Norske Studentersamfund
               <br />
@@ -68,7 +68,7 @@ export const Footer = () => {
             </p>
           </li>
           <li className={styles.contactItem}>
-            <h2>Åpningstider</h2>
+            <h2 className="suphead">Åpningstider</h2>
             <p>
               Glassbaren
               <br />

web/src/components/layout/footer.module.scss

@@ -4,6 +4,11 @@
   align-items: flex-end;
   padding: var(--spacing-sitepadding);
   background: var(--color-background-secondary);
+
+  button {
+    font-size: var(--font-size-caption);
+    background: var(--color-neufPink);
+  }
 }
 
 .contactList {
@@ -17,4 +22,17 @@
 .contactItem {
   list-style: none;
   grid-column: span 3;
+
+  h2 {
+    margin-bottom: 1em;
+  }
+
+  ul {
+    list-style: none;
+  }
+
+  ul,
+  p {
+    font-size: var(--font-size-caption);
+  }
 }

web/src/css/base.scss

@@ -73,6 +73,13 @@ h6 {
   line-height: 1.2;
 }
 
+.suphead {
+  font-size: var(--font-size-caption);
+  font-weight: 700;
+  text-transform: uppercase;
+  letter-spacing: .05em;
+}
+
 button {
   border-radius: 10rem;
   background: var(--color-cta);
@@ -80,7 +87,7 @@ button {
   border: none;
   padding: 1rem 1.5rem;
   font-family: inherit;
-  font-size: inherit;
+  font-size: var(--font-size-body);
   font-weight: 500;
   transition: opacity var(--transition-easing);
   cursor: pointer;