tweak upcoming design, use bgpig on event pages

web/src/components/events/EventHeader.tsx

@@ -5,7 +5,7 @@ import { Pig } from "../general/Pig";
 import Link from "next/link";
 
 export const EventHeader = ({ event }: { event: EventFragment }) => {
-  const featuredImage: any = event.featuredImage
+  const featuredImage: any = event.featuredImage;
 
   return (
     <div className={styles.eventHeader}>
@@ -72,9 +72,6 @@ export const EventHeader = ({ event }: { event: EventFragment }) => {
             sizes="100vw"
           />
         )}
-        <div className={styles.pig}>
-          <Pig type="student" />
-        </div>
       </div>
     </div>
   );

web/src/components/events/UpcomingEvents.tsx

@@ -6,7 +6,12 @@ import Link from "next/link";
 export const UpcomingEvents = ({ events }: { events: EventFragment[] }) => {
   return (
     <section className={styles.upcomingWrapper}>
-      <h2 className="suphead">Denne uka på Chateau Neuf</h2>
+      <h2 className="circlehead">
+        <span className="circle"></span>
+        <span className="circle"></span>
+        <span className="circle"></span>
+        Denne uka på Chateau Neuf
+      </h2>
       <ul className={styles.eventList}>
         {events.slice(0, 5).map((event) => (
           <EventItem key={event.id} event={event} mode="list" size="medium" />

web/src/components/events/eventHeader.module.scss

@@ -24,16 +24,4 @@
 .details {
   font-family: var(--font-serif);
   font-size: var(--font-size-lead);
-}
-
-.pig {
-  position: absolute;
-  bottom: 0;
-  right: -2.5rem;
-  transform: translateY(50%);
-  color: var(--color-white);
-
-  >div {
-    width: 30vw;
-  }
 }

web/src/components/events/upcomingEvents.module.scss

@@ -7,7 +7,7 @@
   overflow-x: hidden;
 
   h2 {
-    margin-bottom: 1rem;
+    margin-bottom: .5rem;
   }
 }