misc messy design progress, fix table error, add more placeholder content to pages, etc

web/src/app/aktuelt/[slug]/page.tsx

@@ -69,7 +69,7 @@ export default async function Page({ params }: { params: { slug: string } }) {
         )}
         <p>{formatDate(news.firstPublishedAt, commonDateFormat)}</p>
       </section>
-      <section className="page-content">
+      <section className="pageContent">
         <Blocks blocks={news.body} />
       </section>
     </main>

web/src/app/arrangementer/[slug]/page.tsx

@@ -52,7 +52,7 @@ export default async function Page({ params }: { params: { slug: string } }) {
     <>
       <main className="site-main" id="main">
         <EventHeader event={event} />
-        <section className="page-content">
+        <section className="pageContent">
           <DateList />
           <Blocks blocks={event.body} />
         </section>

web/src/app/foreninger/[slug]/page.tsx

@@ -63,9 +63,10 @@ export default async function Page({ params }: { params: { slug: string } }) {
           />
         )}
       </section>
-      <section className="page-content">
+      <section className="pageContent">
         <Blocks blocks={association.body} />
         <table>
+          <tbody>
             <tr>
               <th>Type</th>
               <td>{association.associationType}</td>
@@ -76,6 +77,7 @@ export default async function Page({ params }: { params: { slug: string } }) {
                 <td>{association.websiteUrl}</td>
               </tr>
             )}
+          </tbody>
         </table>
       </section>
     </main>

web/src/app/lokaler/[slug]/page.tsx

@@ -61,9 +61,10 @@ export default async function Page({ params }: { params: { slug: string } }) {
           />
         )}
       </section>
-      <section className="page-content">
+      <section className="pageContent">
         <Blocks blocks={venue.body} />
         <table>
+          <tbody>
             <tr>
               <th>Etasje</th>
               <td>{venue.floor}</td>
@@ -100,6 +101,7 @@ export default async function Page({ params }: { params: { slug: string } }) {
               <th>A/V</th>
               <td>{venue.capabilityAudioVideo}</td>
             </tr>
+          </tbody>
         </table>
       </section>
     </main>

web/src/app/medlem/page.tsx

@@ -9,7 +9,7 @@ export default async function Page() {
   return (
     <main className="site-main" id="main">
       <PageHeader heading="Bli medlem" />
-      <p>Som medlem kan du... får du... glede og samvær</p>
+      <p className="lead">Som medlem kan du... får du... glede og samvær</p>
       <p>
         <a
           href="https://galtinn.neuf.no/register"
@@ -24,7 +24,7 @@ export default async function Page() {
           Mitt medlemskap &rarr;
         </a>
       </p>
-      <p>Inngang til foreningene</p>
+      <p>(+ Inngang til foreningene et sted under her)</p>
       <IconListBlock />
     </main>
   );

web/src/app/praktisk/page.tsx

@@ -97,6 +97,7 @@ export default async function Page() {
           <div className="openingHoursItem">
             <h3>Glassbaren (1. etasje)</h3>
             <table className="openingHours">
+              <tbody>
                 <tr>
                   <td>Man—Tor</td>
                   <td>15:00—00:30</td>
@@ -109,11 +110,13 @@ export default async function Page() {
                   <td>Lør—Søn</td>
                   <td>Åpent ved arrangement</td>
                 </tr>
+              </tbody>
             </table>
           </div>
           <div className="openingHoursItem">
             <h3>Bokcaféen (2. etasje)</h3>
             <table className="openingHours">
+              <tbody>
                 <tr>
                   <td>Tir—Tor</td>
                   <td>19:00—23:30</td>
@@ -122,6 +125,7 @@ export default async function Page() {
                   <td>Fre</td>
                   <td>19:00—01:30</td>
                 </tr>
+              </tbody>
             </table>
           </div>
         </div>
@@ -130,6 +134,7 @@ export default async function Page() {
           <div className="openingHoursItem">
             <h3>Slottsmester og telefon</h3>
             <table className="openingHours">
+              <tbody>
                 <tr>
                   <td>Man—Fre</td>
                   <td>15:00—00:00</td>
@@ -138,6 +143,7 @@ export default async function Page() {
                   <td>Lør</td>
                   <td>14:00—00:00</td>
                 </tr>
+              </tbody>
             </table>
             <p>Ekspedisjonen er også åpen under arrangementer på huset.</p>
             <Link href="/kontakt">Se kontaktinfo til ekspedisjonen &rarr;</Link>

web/src/app/utleie/page.tsx

@@ -23,7 +23,16 @@ export default async function Page() {
     <>
       <main className="site-main" id="main">
         <PageHeader heading="Utleie" />
-        <VenueList venues={venues} />
+        <p className="lead">
+          Chateau Neuf har lokaler til diverse arrangementer, og alle våre
+          lokaler er tilgjengelige for utleie, både for studenter,
+          utdanningsinstitusjoner og andre. Vi har blant annet huset
+          Spellemannsprisen og Dalai Lama!
+        </p>
+        <p>Her kommer mer om utleiereglement etc.</p>
+        <br />
+        <br />
+        <VenueList heading="Våre lokaler" venues={venues} />
       </main>
       <BgPig type="key" />
     </>

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

@@ -16,7 +16,7 @@
   bottom: 0;
   right: 0;
   transform: translate(1vw, 20%);
-  z-index: 1;
+  z-index: 600;
   transition: opacity .6s ease;
 
   &[data-inview=true] {

web/src/components/layout/Footer.tsx

@@ -2,10 +2,14 @@ import Link from "next/link";
 import styles from "./footer.module.scss";
 import { NeonChillPig } from "../general/pigs/fun/NeonChillPig";
 import { ToTop } from "./ToTop";
+import { LogoNeuf } from "../general/Logo";
 
 export const Footer = () => {
   return (
     <footer className={styles.footer}>
+      <div className={styles.logo}>
+        <LogoNeuf />
+      </div>
       <div className={styles.contact}>
         <ul className={styles.contactList}>
           <li className={styles.contactItem}>
@@ -64,6 +68,7 @@ export const Footer = () => {
           <li className={styles.contactItem}>
             <h2 className="suphead">Åpningstider i dag</h2>
             <table className="openingHours">
+              <tbody>
                 <tr>
                   <td>Glassbaren</td>
                   <td>15:00—00:30</td>
@@ -76,6 +81,7 @@ export const Footer = () => {
                   <td>Ekspedisjonen</td>
                   <td>15:00—00:00</td>
                 </tr>
+              </tbody>
             </table>
             <Link href="/praktisk#apningstider">Se alle åpningstider</Link>
           </li>

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

@@ -1,7 +1,4 @@
 .footer {
-  display: flex;
-  justify-content: space-between;
-  align-items: flex-end;
   min-height: 60vh;
   padding: var(--spacing-sitepadding);
   background: var(--color-chateauBlue);
@@ -42,3 +39,12 @@
     font-size: var(--font-size-caption);
   }
 }
+
+.logo {
+  width: 12rem;
+  margin-bottom: var(--spacing-section-bottom);
+
+  >div {
+    width: 100%;
+  }
+}

web/src/components/venues/VenueList.tsx

@@ -2,12 +2,28 @@ import { VenueFragment } from "@/gql/graphql";
 import { VenueItem } from "./VenueItem";
 import styles from "./venueList.module.scss";
 
-export const VenueList = ({ venues }: { venues: VenueFragment[] }) => {
+export const VenueList = ({
+  venues,
+  heading,
+}: {
+  venues: VenueFragment[];
+  heading: string;
+}) => {
   return (
+    <div>
+      {heading && (
+        <h2 className="circlehead">
+          <span className="circle"></span>
+          <span className="circle"></span>
+          <span className="circle"></span>
+          {heading}
+        </h2>
+      )}
       <ul className={styles.venueList}>
         {venues.map((venue) => (
           <VenueItem key={venue.id} venue={venue} />
         ))}
       </ul>
+    </div>
   );
 };

web/src/css/base.scss

@@ -37,7 +37,6 @@ body {
 .site-main {
   padding: var(--spacing-sitepadding) var(--spacing-sitepadding) 0;
   min-height: 100vh;
-  position: relative;
   animation: fadeUp .8s ease-out forwards;
 
   &.index {
@@ -95,6 +94,7 @@ h6 {
   font-weight: 700;
   text-transform: uppercase;
   letter-spacing: .05em;
+  margin-bottom: 1rem;
 
   .circle {
     display: inline-block;