Create separate cssModules for each section, and cleanup the folder s…

…tructure

src/summersplash2022/Content.tsx

@@ -1,44 +1,12 @@
 import style from './index.module.css';
 import { HandbookPage } from './utils/handBookPages';
-import GreenBlob from './nyutdannet/img/greenBlob';
-import Apply from './nyutdannet/sections/søkJobb';
+import Apply from './sections/søkJobb';
 import { ApplyType } from './utils/utils';
-import AfterApplying from './nyutdannet/sections/hvaSkjerEtterSonaadsfristen';
-import WhyVariant from './nyutdannet/sections/hvorforAkkurattVariant';
-import LandingPage from './nyutdannet/sections/forside';
-
-const summerstudentsQuotes = [
-  {
-    name: 'Emma',
-    quote: `“Jeg er utrolig glad for å få være en del av variantgjengen i
-    sommer! Det er gøy å se hvordan kjerneverdier som åpenhet og
-    læreglede virkelig praktiseres i arbeidshverdagen, ikke bare
-    på papiret. Det gjør at jeg føler meg veldig inkludert og
-    lærer masse, samtidig som vi har det mye moro!\”`,
-    picture: require('./img/emma.svg'),
-  },
-  {
-    name: 'Mathias',
-    quote: `“Sommeren i Variant ga meg en smakebit av hva det vil si å
-    være konsulent. Med ekte kunder og reelle behov lærte jeg
-    masse og fikk vist frem ferdighetene mine. Gjennom sosiale
-    arrangementer og pulserende Slack-kanaler følte jeg meg
-    inkludert allerede før dag én. Jevnlige sparringer ga faglig
-    påfyll og støtte til teamet, og folkene her er rett og slett
-    herlige 🤗”`,
-    picture: require('./img/mathias.svg'),
-  },
-  {
-    name: 'Swarny',
-    quote: `“Sommeren hos Variant har vært helt fantastisk. Vi fikk jobbe
-    med et megakult og aktuelt prosjekt med god oppfølging, både
-    fra Variant og kunden. Selv om Variant er et konsulentselskap,
-    har de et godt sosialt miljø hvor alle er inkluderende, ivrige
-    og åpne. Jeg er superfornøyd med at
-    jeg søkte sommerjobb hos Variant!!”`,
-    picture: require('./img/swarny.svg'),
-  },
-];
+import AfterApplying from './sections/hvaSkjerEtterSonaadsfristen';
+import WhyVariant from './sections/hvorforAkkurattVariant';
+import LandingPage from './sections/forside';
+import omJobbenStyle from './sections/hvemSokerVi.module.css';
+import SummerstudentsQuotes from './sections/hvaSierSommerstudentene';
 
 const Content = () => {
   const norwayMap = require('./img/norway summer job.svg');
@@ -51,12 +19,12 @@ const Content = () => {
           className={style.sectionLightBeige}
         />
         <section
-          className={`${style.aboutTheJobOrEmployeeSection} ${style.sectionDarkBlue}`}
+          className={`${omJobbenStyle.section} ${style.sectionDarkBlue}`}
           id="hvagarsommerjobbenutpa"
         >
           <h2>Hva går sommerjobben ut på?</h2>
-          <div className={style.aboutTheJobOrEmployeeSectionFlex}>
-            <div className={style.aboutTheJobOrEmployeeSectionTextAboveImg}>
+          <div className={omJobbenStyle.flex}>
+            <div className={omJobbenStyle.textAboveImg}>
               <p>
                 En sommerjobb i Variant er en fin mulighet til å anvende det du
                 har lært på skolen i praksis. Det forventes ikke at du er
@@ -77,7 +45,7 @@ const Content = () => {
                 uker ferie i mellomtiden.
               </p>
             </div>
-            <p className={style.aboutTheJobOrEmployeeSectionTextBelowImg}>
+            <p className={omJobbenStyle.textBelowImg}>
               I Variant liker vi åpenhet. Det betyr at du selvsagt ikke trenger
               å lure på hvordan kontrakten din vil se ut for sommeren, den
               ligger nemlig åpent og tilgjengelig på våre nettsider. Timelønnen
@@ -86,44 +54,17 @@ const Content = () => {
               🤓). Under “Hvorfor akkurat Variant?” ned kan du lese mer om hva
               Variant står for og tilbyr.
             </p>
-            <div className={style.aboutTheJobOrEmployeeSectionImgWrapper}>
+            <div className={omJobbenStyle.imgWrapper}>
               <img
                 src={norwayMap}
                 alt="Vi ansetter 10 i Trondheim, 10 i Oslo og 3 i Bergen"
-                className={style.aboutTheJobOrEmployeeSectionImg}
+                className={omJobbenStyle.img}
               />
             </div>
           </div>
         </section>
 
-        <section
-          className={`${style.summerstudentQuotesSection} ${style.sectionDarkTeal}`}
-          id="hvameneraretssommerstudenter"
-        >
-          <h2>Hva mener årets sommerstudenter?</h2>
-          {summerstudentsQuotes.map((student) => (
-            <div className={style.summerstudent} key={student.name}>
-              <img
-                src={student.picture}
-                alt={`Bilde av ${student.name}`}
-                className={style.summerstudentPicture}
-              />
-              <div>
-                <p className={style.summerstudentQuote}>{student.quote}</p>
-                <p className={style.summerstudentName}>- {student.name}</p>
-              </div>
-            </div>
-          ))}
-
-          <GreenBlob className={style.summerStudentQuotesSectionGreenBlobTop} />
-          <GreenBlob
-            className={style.summerStudentQuotesSectionGreenBlobMiddle}
-          />
-          <GreenBlob
-            className={style.summerStudentQuotesSectionGreenBlobBottom}
-          />
-        </section>
-
+        <SummerstudentsQuotes />
         <WhyVariant
           pages={[
             HandbookPage.INTENTIONS_AND_VALUES,

src/summersplash2022/img/applyImgWithBlob.tsx

@@ -1,4 +1,4 @@
-import style from 'src/summersplash2022/index.module.css';
+import style from '../sections/søkJobb.module.css';
 
 const ApplyImgWithBlob = ({ color }: { color: string }) => {
   return (
@@ -9,7 +9,7 @@ const ApplyImgWithBlob = ({ color }: { color: string }) => {
       fill="none"
       xmlns="http://www.w3.org/2000/svg"
       xmlnsXlink="http://www.w3.org/1999/xlink"
-      className={style.applyImgWithBlob}
+      className={style.imgWithBlob}
     >
       <path
         d="M0.311042 320.682C-6.49875 393.377 100.266 418.132 148.171 473.226C187.3 518.228 196.446 592.499 253.086 611.396C310.404 630.519 372.109 597.839 422.787 564.846C467.134 535.974 486.027 485.851 514.425 441.253C548.714 387.405 605.512 342.761 604.793 279.011C603.982 207.115 570.419 132.142 510.49 92.3222C451.315 53.0026 371.839 57.8024 303.94 79.1057C246.169 97.2313 221.328 160.222 173.962 197.908C116.768 243.413 7.11514 248.048 0.311042 320.682Z"

src/summersplash2022/nyutdannet/img/graduateToggleArrow.tsx → src/summersplash2022/img/graduateToggleArrow.tsx

@@ -1,4 +1,4 @@
-import style from 'src/summersplash2022/index.module.css';
+import style from 'src/summersplash2022/sections/forside.module.css';
 
 const GraduateToggleArrow = () => {
   return (

src/summersplash2022/img/landingpageImgWithBlob.tsx

@@ -1,4 +1,4 @@
-import style from 'src/summersplash2022/index.module.css';
+import style from '../sections/forside.module.css';
 
 const LandingPageImgWithBlob = () => {
   return (
@@ -9,7 +9,7 @@ const LandingPageImgWithBlob = () => {
       fill="none"
       xmlns="http://www.w3.org/2000/svg"
       xmlnsXlink="http://www.w3.org/1999/xlink"
-      className={style.landingpageImgWithBlob}
+      className={style.imgWithBlob}
     >
       <path
         fill-rule="evenodd"

src/summersplash2022/img/merInfo.tsx

@@ -1,4 +1,4 @@
-import style from 'src/summersplash2022/nyutdannet/nyutdannet.module.css';
+import style from 'src/summersplash2022/sections/forside.module.css';
 const MoreInfo = (props: { white: boolean }) => {
   if (props.white) {
     return (

src/summersplash2022/img/summerjobToggleArrow.tsx

@@ -1,4 +1,4 @@
-import style from 'src/summersplash2022/index.module.css';
+import style from 'src/summersplash2022/sections/forside.module.css';
 
 const SummerjobToggleArrow = () => {
   return (