add more practical info content, opening hours + some association sketching

web/src/components/associations/associationItem.module.scss

@@ -1,12 +1,18 @@
-.venueItem {
+.associationItem {
   position: relative;
   list-style: none;
+  display: grid;
+  grid-template-columns: 1fr 2fr;
+  align-items: flex-start;
+  gap: 1rem;
+  background: var(--color-white);
+  color: var(--color-black);
+  padding: 1rem;
 }
 
 .image {
   width: 100%;
-  padding-top: 60%;
-  background: var(--color-placeholder);
+  padding-top: 100%;
   position: relative;
 
   img {
@@ -14,19 +20,21 @@
     top: 0;
     width: 100%;
     height: 100%;
-    object-fit: cover;
+    object-fit: contain;
   }
 }
 
 .text {
-  padding: .8rem 0;
+  padding: 0;
 }
 
-.excerpt {}
+.title {
+  font-size: 1.2rem;
+  margin-bottom: 1rem;
+}
 
-.title,
-.details {
-  font-size: 1.6rem;
+.excerpt {
+  font-size: var(--font-size-caption);
 }
 
 .details {

web/src/components/associations/associationList.module.scss

@@ -1,6 +1,6 @@
 .associationList {
   display: grid;
-  grid-template-columns: repeat(2, 1fr);
+  grid-template-columns: repeat(3, 1fr);
   column-gap: var(--spacing-gap-column);
   row-gap: var(--spacing-gap-row);
   padding-bottom: var(--spacing-section-bottom);

web/src/components/layout/Footer.tsx

@@ -62,14 +62,22 @@ export const Footer = () => {
             </p>
           </li>
           <li className={styles.contactItem}>
-            <h2 className="suphead">Åpningstider</h2>
-            <p>
-              Glassbaren
-              <br />
-              Andre lokaler?
-              <br />
-              Generelle åpningstider?
-            </p>
+            <h2 className="suphead">Åpningstider i dag</h2>
+            <table className="openingHours">
+              <tr>
+                <td>Glassbaren</td>
+                <td>15:00—00:30</td>
+              </tr>
+              <tr>
+                <td>Bokcaféen</td>
+                <td>19:00—23:30</td>
+              </tr>
+              <tr>
+                <td>Ekspedisjonen</td>
+                <td>15:00—00:00</td>
+              </tr>
+            </table>
+            <Link href="/praktisk#apningstider">Se alle åpningstider</Link>
           </li>
         </ul>
       </div>

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

@@ -25,7 +25,7 @@
 
 .contactItem {
   list-style: none;
-  grid-column: span 3;
+  grid-column: span 4;
 
   h2 {
     margin-bottom: 1em;
@@ -36,7 +36,9 @@
   }
 
   ul,
-  p {
+  p,
+  table,
+  a {
     font-size: var(--font-size-caption);
   }
 }