merge master

content/konventen/fk.md

@@ -1,7 +1,7 @@
 ---
 naam: Faculteiten Konvent Gent vzw
 verkorte_naam: FK Gent
-logo: placeholder.png
+id: fk
 contact: fk@student.ugent.be
 website: https://www.fkgent.be/
 social:
@@ -19,4 +19,5 @@ verenigingen:
   - verkorte_naam: vereniging2
     photo: https://via.placeholder.com/200.png/90f/fff
 ---
+
 Het Faculteiten Konvent overkoepelt meer dan 29 verenigingen. Voor elke opleiding aan de universiteit bestaat er wel een Faculteitskring. Ze verzorgen de opvang van nieuwe studenten en organiseren tal van activiteiten waar elkeen zijn medestudenten kan ontmoeten.

content/konventen/gsr.md

@@ -1,7 +1,7 @@
 ---
 naam: Gentse Studentenraad
+id: gsr
 verkorte_naam: GSR
-logo: placeholder.png
 contact: info@gentsestudentenraad.be
 website: https://www.gentsestudentenraad.be
 social:
@@ -18,5 +18,6 @@ showcase:
   - photo: /assets/logos/GSRB.jpg
   - photo: /assets/logos/GSRC.jpg
 ---
+
 De Gentse Studentenraad is de centrale studentenraad van de UGent. De Gentse Studentenraad vertegenwoordigt en verdedigt (de belangen van) de studenten bij het universiteitsbestuur. Gaande van onderwijsaangelegenheden (Onderwijs- en examenreglement (OER), bijzondere statuten, studiemaatregelen ...) tot sociale zaken (homes, studentenresto's), de thema's die binnen de Gentse Studentenraad worden aangesneden zijn bijzonder divers.
 De Gentse Studentenraad is echter op meer niveaus aanwezig dan enkel het universitaire. In de eerste plaats ondersteunt de Gentse Studentenraad de elf facultaire studentenraden. Ook op het stedelijk niveau en op het Vlaams niveau is de Gentse Studentenraad actief. Daarenboven ondersteunt de Gentse Studentenraad ook verschillende grote en minder grote projecten zoals de Fietsambassade, Cultour en Start to Talk.

content/konventen/hk.md

@@ -1,7 +1,7 @@
 ---
 naam: Home Konvent
+id: hk
 verkorte_naam: HK
-logo: placeholder.png
 contact: hk@student.ugent.be
 website: https://www.homekonvent.be/
 social:
@@ -23,4 +23,5 @@ verenigingen:
   - verkorte_naam: vereniging2
     photo: https://via.placeholder.com/200.png/90f/fff
 ---
+
 Het HK is een plaats waar de verschillende vereningingen van de 5 homes elkaar treffen.

content/konventen/ik.md

@@ -1,7 +1,7 @@
 ---
 naam: Internationaal Konvent
 verkorte_naam: IK Gent
-logo: placeholder.png
+id: ik
 contact: ik@student.ugent.be
 website: https://internationaalkonv.wixsite.com/internationalkonvent
 social:
@@ -24,6 +24,7 @@ verenigingen:
   - verkorte_naam: vereniging2
     photo: https://via.placeholder.com/200.png/90f/fff
 ---
+
 Het IK probeert de buitenlandse studenten en internationale studentenverenigingen te helpen in hun zoektocht naar informatie & ontspanning.
 
 We want international students to feel included by providing information concerning student activities and the university whilst working with internationally minded people and organisations.

content/konventen/kultk.md

@@ -1,7 +1,7 @@
 ---
 naam: Kultureel Konvent
+id: kultk
 verkorte_naam: Kultureel Konvent
-logo: placeholder.png
 contact: kultureelkonvent@gmail.com
 website: http://student.ugent.be/kultkcentraal/index.html
 social:
@@ -10,4 +10,5 @@ social:
 themas:
   - cultuur
 ---
+
 Het KultK telt acht vereningen die elk een eigen deel van de Kultuur met de grote K proberen te introduceren aan de medestudenten.

content/konventen/pfk.md

@@ -1,7 +1,7 @@
 ---
 naam: Politiek en Filosofisch Konvent
 verkorte_naam: PFK
-logo: placeholder.png
+id: pfk
 contact: pfk@student.ugent.be
 website: https://pfk.ugent.be/
 social:
@@ -9,14 +9,6 @@ social:
     link: https://www.facebook.com/PFKGent/
 themas:
   - politiek en filosofisch
-showcase:
-  - photo: https://via.placeholder.com/300.png/09f/fff
-  - photo: https://via.placeholder.com/300.png/09f/fff
-  - photo: https://via.placeholder.com/300.png/09f/fff
-verenigingen:
-  - verkorte_naam: vereniging1
-    photo: https://via.placeholder.com/200.png/90f/fff
-  - verkorte_naam: vereniging2
-    photo: https://via.placeholder.com/200.png/90f/fff
 ---
+
 Het PFK groepeert de politieke, filosofische en levensbeschouwelijke verenigingen aan de UGent. Dit konvent is de uitgelezen plaats om je aan te sluiten bij een ideologische, filosofische of politieke beweging.

content/konventen/wvk.md

@@ -7,6 +7,7 @@ konvent: wvk
 website: https://wvk.ugent.be/
 contact: wvk@student.ugent.be
 ---
+
 Het WVK groepeert alle maatschappelijk-sociaal geïnspireerde studentenverenigingen en alle wetenschappelijke werkgroepen. Als konvent organiseert het WVK zelf (in tegenstelling tot sommige andere konventen) geen eigen activiteiten, maar richt het zich volledig op het samenbrengen en verdedigen van de belangen van de maatschappelijke verenigingen en wetenschappelijke werkgroepen aan de Universiteit Gent.
 
-<iframe src="https://www.facebook.com/plugins/video.php?href=https%3A%2F%2Fwww.facebook.com%2Fwvkcentraal%2Fvideos%2F795092330635099%2F&show_text=0&width=560" width="560" height="315" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true" allowFullScreen="true"></iframe>
+<iframe src="https://www.facebook.com/plugins/video.php?href=https%3A%2F%2Fwww.facebook.com%2Fwvkcentraal%2Fvideos%2F795092330635099%2F&show_text=0&width=560" width="560" height="315" style="border:none;overflow:hidden; margin: auto;" scrolling="no" frameborder="0" allowTransparency="true" allowFullScreen="true"></iframe>

content/quiz/vraag1.md

@@ -352,39 +352,39 @@ antwoorden:
     antwoorden:
       - tekst: biw - Bos- en natuurbeheer
         verenigingen:
-          - naam: fbw
+          - naam: stubio
           - naam: vlk
 
       - tekst: biw - cel- en genbiotechnologie
         verenigingen:
-          - naam: fbw
+          - naam: stubio
           - naam: vlk
 
       - tekst: biw - Chemie en voedingstechnologie
         verenigingen:
-          - naam: fbw
+          - naam: stubio
           - naam: vlk
 
       - tekst: biw - Landbouwkunde
         verenigingen:
-          - naam: fbw
+          - naam: stubio
           - naam: vlk
           - naam: gk
           - naam: iaas
 
       - tekst: biw - Land- en waterbeheer
         verenigingen:
-          - naam: fbw
+          - naam: stubio
           - naam: vlk
 
       - tekst: biw - Milieutechnologie
         verenigingen:
-          - naam: fbw
+          - naam: stubio
           - naam: vlk
 
       - tekst: Biowetenschappen
         verenigingen:
-          - naam: fbw
+          - naam: stubio
           - naam: lila
 
   - tekst: Farmaceutische wetenschappen

content/quiz/vraag3.md

@@ -1,53 +1,205 @@
 ---
-vraag: Wie wil je ontmoeten?
+vraag: Wat zijn je interesses?
 type: meerkeuze
 antwoorden:
-  - tekst: Studenten die uit dezelfde streek afkomstig zijn
-    vraag: Uit welke streek ben jij afkomstig?
-    type: specialCase1
+  - tekst: Archeologie
+    verenigingen:
+      - naam: aw
+
+  - tekst: BDSM
+    verenigingen:
+      - naam: kajira
+
+  - tekst: Consulting
+    verenigingen:
+      - naam: oedc
+
+  - tekst: Cultuur en creatief zijn
+    vraag: Wat zijn je interesses?
+    type: meerkeuze
     antwoorden:
-      - tekst: TODO
+      - tekst: Culturele voorstellingen bijwonen
         verenigingen:
-          - naam: TODO
-
-  - tekst: Eender wie, onafhankelijk van interesses, studies of andere aspecten
+          - naam: cultour
+      - tekst: Dansen
         verenigingen:
-      - naam: theepot
-
-  - tekst: Internationale studenten
-    vereningingen:
-      - naam: esn
-      - naam: International students association gent
-
-  - tekst: Ik ben LGBTQI+ student en zou graag andere LGBTQI+ studenten ontmoeten
+          - naam: gudc
+      - tekst: Dichtkunst en gesproken woord
         verenigingen:
-      - naam: vg
+          - naam: auwla
+      - tekst: Fotografie
+        verenigingen:
+          - naam: schamper
+      - tekst: Muziek spelen
+        verenigingen:
+          - naam: guho
+          - naam: guso
+          - naam: studentenfanfare
+      - tekst: Schilderen en tekenen
+        verenigingen:
+          - naam: modelstudies
+      - tekst: Schrijven
+        verenigingen:
+          - naam: schamper
+          - naam: auwla
+          - naam: prometheus
+      - tekst: Theater
+        verenigingen:
+          - naam: matrak
+      - tekst: Zingen
+        verenigingen:
+          - naam: guk
 
-  - tekst: Ik heb een migratieachtergond en zou graag mensen met eenzelfde achtergrond als mezelf ontmoeten
-    vraag: Je gaf aan een migratieachtergrond te hebben en graag andere studenten te ontmoeten met dezelfde achtergrond. Wat is jouw culturele achtergrond?
-    type: dropdown
+  - tekst: De pers
+    vraag: Wat zijn je interesses?
+    type: meerkeuze
     antwoorden:
-      - tekst: China
+      - tekst: Fotografie
         verenigingen:
-          - naam: chisag
+          - naam: schamper
+      - tekst: Journalistiek
+        verenigingen:
+          - naam: schamper
+          - naam: urgent
+      - tekst: Lay-out
+        verenigingen:
+          - naam: schamper
+      - tekst: Schrijven
+        verenigingen:
+          - naam: schamper
+          - naam: auwla
+          - naam: prometheus
 
+  - tekst: Duurzaamheid
+    verenigingen:
+      - naam: durgent
+
+  - tekst: Economie
+    verenigingen:
+      - naam: flyse
+      - naam: capitant
+      - naam: re9000
+
+  - tekst: Finance
+    verenigingen:
+      - naam: capitant
+
+  - tekst: Kritisch denken en debat
+    verenigingen:
+      - naam: engage
+      - naam: tsg
+
+  - tekst: land- en tuinbouw
+    verenigingen:
+      - naam: gk
+      - naam: stujardin
+
+  - tekst: Me inzetten voor anderen
+    vraag: Wat zijn je interesses?
+    type: meerkeuze
+    antwoorden:
+      - tekst: Andere studenten ondersteunen
+        verenigingen:
+          - naam: flux
+          - naam: cultour
+          - naam: stt
+      - tekst: Cultuur promoten
+        verenigingen:
+          - naam: cultour
+      - tekst: studentenvertegenwoordiging
+        verenigingen:
+          - naam: gsr
+
+  - tekst: ondernemen
+    verenigingen:
+      - naam: flyse
+
+  - tekst: Politiek
+    vraag: Waar ben je specifiek in geïnteresseerd?
+    type: meerkeuze
+    antwoorden:
+      - tekst: Vlaamse en nationale politiek
+        vraag: Welke overtuiging?
+        type: meerkeuze
+        antwoorden:
+          - tekst: Vlaams-Nationalistisch
+            verenigingen:
+              - naam: nsv
+
+          - tekst: Conservatief en Vlaams-Nationalistisch
+            verenigingen:
+              - naam: kvhv
+
+          - tekst: Antikapitalistisch
+            verenigingen:
+              - naam: als
+
+          - tekst: Christendemocratisch
+            verenigingen:
+              - naam: cds
+
+          - tekst: Marxistisch
+            verenigingen:
+              - naam: comac
+
+          - tekst: Ecologistisch
+            verenigingen:
+              - naam: groen
+              - naam: durgent
+
+          - tekst: Vlaams-republikeins
+            verenigingen:
+              - naam: nva
+
+          - tekst: Socialistisch
+            verenigingen:
+              - naam: socialisten
+
+          - tekst: Liberaal
+            verenigingen:
+              - naam: lvsv
+
+      - tekst: Europese politiek
+        verenigingen:
+          - naam: minos
+
+      - tekst: Internationale politiek, Verenigde Naties en debat
+        verenigingen:
+          - naam: vvny
+
+  - tekst: STEM
+    vraag: Wat zijn je interesses?
+    type: meerkeuze
+    antwoorden:
+      - tekst: Techniek
+        verenigingen:
+          - naam: ieee
+          - naam: best
+      - tekst: Wiskunde
+        verenigingen:
+          - naam: prime
+      - tekst: Fysica en sterrenkunde
+        verenigingen:
+          - naam: vvn
+      - tekst: Informatica
+        verenigingen:
+          - naam: zeus
+
+  - tekst: radio maken
+    verenigingen:
+      - naam: urgent
+
+  - tekst: Verschillende culturen
+    vraag: Wat zijn je interesses?
+    type: meerkeuze
+    antwoorden:
       - tekst: Armenië
         verenigingen:
           - naam: hayasa
-
-      - tekst: Indonesië
-        verenigingen:
-          - naam: indosag
-
       - tekst: Japan
         verenigingen:
-          - naam: tnok
-
-      - tekst: Vietnam
+          - naam: tnk
+      - tekst: De Klassieke Oudheid
         verenigingen:
-          - naam: vinasag
-
-      - tekst: Sub-Sahara Afrika
-        verenigingen:
-          - naam: umoja
+          - naam: kk
 ---

content/quiz/vraag4.md

@@ -1,209 +1,53 @@
 ---
-vraag: Wat zijn je interesses?
+vraag: Wie wil je ontmoeten?
 type: meerkeuze
 antwoorden:
-  - tekst: Archeologie
-    verenigingen:
-      - naam: aw
-
-  - tekst: BDSM
-    verenigingen:
-      - naam: kajira
-
-  - tekst: Consulting
-    verenigingen:
-      - naam: oedc
-
-  - tekst: Cultuur en creatief zijn
-    vraag: Wat zijn je interesses?
-    type: meerkeuze
+  - tekst: Studenten die uit dezelfde streek afkomstig zijn
+    vraag: Uit welke streek ben jij afkomstig?
+    type: specialCase1
     antwoorden:
-      - tekst: Culturele voorstellingen bijwonen
+      - tekst: TODO
         verenigingen:
-          - naam: cultour
-      - tekst: Dansen
-        verenigingen:
-          - naam: gudc
-      - tekst: Dichtkunst en gesproken woord
-        verenigingen:
-          - naam: auwla
-      - tekst: Fotografie
-        verenigingen:
-          - naam: schamper
-      - tekst: Illusionisme
-        verenigingen:
-          - naam: illusiona
-      - tekst: Muziek spelen
-        verenigingen:
-          - naam: guho
-          - naam: guso
-          - naam: studentenfanfare
-      - tekst: Schilderen en tekenen
-        verenigingen:
-          - naam: modelstudies
-      - tekst: Schrijven
-        verenigingen:
-          - naam: schamper
-          - naam: auwla
-          - naam: prometheus
-      - tekst: Theater
-        verenigingen:
-          - naam: matrak
-      - tekst: Zingen
-        verenigingen:
-          - naam: guk
+          - naam: TODO
 
-  - tekst: De pers
-    vraag: Wat zijn je interesses?
-    type: meerkeuze
+  - tekst: Eender wie, onafhankelijk van interesses, studies of andere aspecten
+    verenigingen:
+      - naam: theepot
+
+  - tekst: Internationale studenten
+    vereningingen:
+      - naam: esn
+      - naam: International students association gent
+
+  - tekst: Ik ben LGBTQI+ student en zou graag andere LGBTQI+ studenten ontmoeten
+    verenigingen:
+      - naam: vg
+
+  - tekst: Ik heb een migratieachtergond en zou graag mensen met eenzelfde achtergrond als mezelf ontmoeten
+    vraag: Je gaf aan een migratieachtergrond te hebben en graag andere studenten te ontmoeten met dezelfde achtergrond. Wat is jouw culturele achtergrond?
+    type: dropdown
     antwoorden:
-      - tekst: Fotografie
+      - tekst: China
         verenigingen:
-          - naam: schamper
-      - tekst: Journalistiek
-        verenigingen:
-          - naam: schamper
-          - naam: urgent
-      - tekst: Lay-out
-        verenigingen:
-          - naam: schamper
-      - tekst: Schrijven
-        verenigingen:
-          - naam: schamper
-          - naam: auwla
-          - naam: prometheus
+          - naam: chisag
 
-  - tekst: Duurzaamheid
-    verenigingen:
-      - naam: durgent
-
-  - tekst: Economie
-    verenigingen:
-      - naam: flyse
-      - naam: capitant
-      - naam: re9000
-
-  - tekst: Finance
-    verenigingen:
-      - naam: capitant
-
-  - tekst: Kritisch denken en debat
-    verenigingen:
-      - naam: engage
-      - naam: tsg
-
-  - tekst: land- en tuinbouw
-    verenigingen:
-      - naam: gk
-      - naam: stujardin
-
-  - tekst: Me inzetten voor anderen
-    vraag: Wat zijn je interesses?
-    type: meerkeuze
-    antwoorden:
-      - tekst: Andere studenten ondersteunen
-        verenigingen:
-          - naam: flux
-          - naam: cultour
-          - naam: stt
-      - tekst: Cultuur promoten
-        verenigingen:
-          - naam: cultour
-      - tekst: studentenvertegenwoordiging
-        verenigingen:
-          - naam: gsr
-
-  - tekst: ondernemen
-    verenigingen:
-      - naam: flyse
-
-  - tekst: Politiek
-    vraag: Waar ben je specifiek in geïnteresseerd?
-    type: meerkeuze
-    antwoorden:
-      - tekst: Vlaamse en nationale politiek
-        vraag: Welke overtuiging?
-        type: meerkeuze
-        antwoorden:
-          - tekst: Vlaams-Nationalistisch
-            verenigingen:
-              - naam: nsv
-
-          - tekst: Conservatief en Vlaams-Nationalistisch
-            verenigingen:
-              - naam: kvhv
-
-          - tekst: Antikapitalistisch
-            verenigingen:
-              - naam: als
-
-          - tekst: Christendemocratisch
-            verenigingen:
-              - naam: cds
-
-          - tekst: Marxistisch
-            verenigingen:
-              - naam: comac
-
-          - tekst: Ecologistisch
-            verenigingen:
-              - naam: groen
-              - naam: durgent
-
-          - tekst: Vlaams-republikeins
-            verenigingen:
-              - naam: nva
-
-          - tekst: Socialistisch
-            verenigingen:
-              - naam: socialisten
-
-          - tekst: Liberaal
-            verenigingen:
-              - naam: lvsv
-
-      - tekst: Europese politiek
-        verenigingen:
-          - naam: minos
-
-      - tekst: Internationale politiek, Verenigde Naties en debat
-        verenigingen:
-          - naam: vvny
-
-  - tekst: STEM
-    vraag: Wat zijn je interesses?
-    type: meerkeuze
-    antwoorden:
-      - tekst: Techniek
-        verenigingen:
-          - naam: ieee
-          - naam: best
-      - tekst: Wiskunde
-        verenigingen:
-          - naam: prime
-      - tekst: Fysica en sterrenkunde
-        verenigingen:
-          - naam: vvn
-      - tekst: Informatica
-        verenigingen:
-          - naam: zeus
-
-  - tekst: radio maken
-    verenigingen:
-      - naam: urgent
-
-  - tekst: Verschillende culturen
-    vraag: Wat zijn je interesses?
-    type: meerkeuze
-    antwoorden:
       - tekst: Armenië
         verenigingen:
           - naam: hayasa
+
+      - tekst: Indonesië
+        verenigingen:
+          - naam: indosag
+
       - tekst: Japan
         verenigingen:
-          - naam: tnk
-      - tekst: De Klassieke Oudheid
-        verenigingen:
-          - naam: kk
+          - naam: tnok
 
+      - tekst: Vietnam
+        verenigingen:
+          - naam: vinasag
+
+      - tekst: Sub-Sahara Afrika
+        verenigingen:
+          - naam: umoja
 ---

content/search.html.erb

@@ -1,7 +1,7 @@
 <div class="search">
     <div class="search__main">
         <form id="search_form">
-            <label>Wat zoek je? <input type="text"></label>
+            <label>Wat zoek je?</label><input class="search__input" type="text">
             <button type="submit">Zoek!</button>
         </form>
     </div>

content/stylesheets/main.css

@@ -42,21 +42,25 @@ main {
   flex-direction: column;
   justify-content: space-between;
   width: calc(100%-5rem);
-
-  padding: 2rem 2rem 0 2rem;
 }
 
 .main_content {
+  padding: 3rem;
   width: 100%;
+  height: 100%;
   margin: 0 auto;
 }
 
 .beforeTheFold {
   min-height: 100vh;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-around;
+  padding: 4rem;
 }
 
 .quizSpotlight {
-  margin-top: 2rem;
+  margin: 2rem 0;
   font-size: 2rem;
   font-family: Arial, Helvetica, sans-serif;
   font-weight: bold;
@@ -85,11 +89,6 @@ main {
   color: var(--white);
 }
 
-footer {
-  width: 80%;
-  margin: 0 auto;
-}
-
 details {
   margin-bottom: 1rem;
 }
@@ -102,6 +101,8 @@ details[open] {
 
 .align {
   max-width: 1280px;
+  margin: auto;
+  padding: 3rem;
 }
 
 .align .large {
@@ -115,7 +116,7 @@ details[open] {
   width: 5rem;
   height: 100vh;
   padding-bottom: 2rem;
-  transition: width 600ms ease;
+  transition: width 300ms ease;
 }
 
 .navbar-nav {
@@ -132,6 +133,10 @@ details[open] {
   width: 100%;
 }
 
+.nav-item:last-child {
+  margin-top: auto;
+}
+
 .nav-link__logo__wrapper {
   padding: 2rem 0;
 }
@@ -165,6 +170,18 @@ details[open] {
   font-weight: bolder;
 }
 
+.search__main {
+  margin: 3rem;
+}
+
+.search__input {
+  margin: 0 0.5rem;
+}
+
+.hidden {
+  display: none;
+}
+
 .nav-link svg {
   width: 2rem;
   min-width: 2rem;
@@ -197,7 +214,7 @@ details[open] {
 }
 
 .randomVereniging {
-  border: 2px solid var(--yellow);
+  border: 7px solid var(--yellow);
   padding: 1rem;
   margin: 1rem;
 }
@@ -250,8 +267,6 @@ details[open] {
   main {
     margin: 0;
     width: 100%;
-
-    padding: 0.5rem;
   }
 }
 
@@ -341,7 +356,7 @@ header {
 h2 {
   font-family: MyWebFont, futura, Avenir Next, Verdana, Geneva, Tahoma,
     sans-serif;
-  font-size: 3.4rem;
+  font-size: 2.8rem;
 
   font-weight: lighter;
   color: var(--darkblue);
@@ -355,11 +370,6 @@ h2 {
   position: relative;
 }
 
-.studentZijn {
-  margin: 4rem 0 2rem 3rem;
-  margin: 11vh 0 2rem 3rem;
-}
-
 .hidden {
   display: none;
 }
@@ -369,14 +379,7 @@ h2 {
   display: flex;
   position: relative;
   z-index: 2;
-}
-.quote img {
-  width: 103px;
-  height: 185px;
-  margin-right: 2rem;
-}
 
-.quote p {
   max-width: 25rem;
   font-size: 1.5rem;
   font-family: Avenir Next, Verdana, Geneva, Tahoma, sans-serif;
@@ -415,11 +418,11 @@ h2 {
   background: linear-gradient(hsla(0, 0%, 100%, 0), hsla(0, 0%, 100%, 0.6));
 }
 
-.backgroundSquare {
+/* .backgroundSquare {
   z-index: -2;
   position: absolute;
   background-color: var(--lightCyan);
-}
+} */
 
 .header_blueSquare {
   right: 20%;
@@ -432,13 +435,38 @@ h2 {
   z-index: -3;
 }
 
-.header_photo {
-  background: url(/assets/placeholder.jpg) center center;
-  background-size: cover;
-  right: 0;
-  left: 50%;
+.beforeTheFold article {
+  position: relative;
+  max-width: 500px;
+  padding: 2rem 3rem;
+  z-index: 2;
+  margin: unset;
+  backdrop-filter: blur(2px);
+}
+
+.beforeTheFold article::before {
+  opacity: 0.2;
+  z-index: -1;
+  background-color: var(--white);
+  content: "";
+  top: 0;
   bottom: 0;
-  top: 20%;
+  left: 0;
+  right: 0;
+  /* width: 200vw; */
+  position: absolute;
+}
+
+.header_photo {
+  /* background: url(/assets/placeholder.png) center center; */
+  /* background-size: cover; */
+  /* background-size: contain; */
+  /* background-repeat: no-repeat; */
+  position: absolute;
+  width: auto;
+  height: 100vh;
+  right: 0;
+  top: 0;
 }
 
 .underline {
@@ -453,7 +481,7 @@ h2 {
   color: inherit;
   text-decoration: none;
   display: grid;
-  grid-template-columns: minmax(min-content, 25%) 80%;
+  grid-template-columns: minmax(min-content, 25%) 1fr;
 
   background-color: #fff;
   border-radius: 4px;
@@ -465,6 +493,8 @@ h2 {
   gap: 20px;
   padding: 0.5rem;
   max-width: 600px;
+  width: 100%;
+  height: 100%;
 }
 
 .fancy_link_container {
@@ -472,9 +502,10 @@ h2 {
   grid-template-columns: 50% 50%;
   margin: auto;
   gap: 20px;
+  place-items: center;
 }
 
-@media only screen and (max-width: 900px) {
+@media only screen and (max-width: 1100px) {
   .fancy_link_container {
     grid-template-columns: auto;
   }
@@ -490,6 +521,7 @@ h2 {
   align-self: center;
 
   min-width: 100px;
+  margin: auto 2rem;
 }
 
 .link__content {
@@ -590,6 +622,10 @@ h2 {
   opacity: 1;
 }
 
+.title_link {
+  text-decoration: none;
+}
+
 .tile__title {
   color: black;
   width: 100%;
@@ -621,10 +657,143 @@ h2 {
   min-width: 400px;
 }
 
+.details-logo > img {
+  width: 100px;
+}
+
+.details-logo {
+  display: flex;
+  justify-content: center;
+}
+
+.detail_title {
+  display: flex;
+  flex-direction: row;
+  align-items: baseline;
+  flex-wrap: wrap;
+  gap: 12px;
+}
+
+.detail_title h2 {
+  margin: 0;
+  text-align: center;
+}
+
+.social > a {
+  display: block;
+
+  width: 100px;
+  height: 100px;
+}
+
+.social > a > .link {
+  display: none;
+}
+
+.social > a > p {
+  padding-top: 65px;
+  text-align: center;
+}
+
+.social-container > ul {
+  list-style: none;
+  display: flex;
+  padding: 0;
+  /* gap: 0.5rem; */
+  margin: auto;
+  justify-content: space-around;
+}
+
+.detail-body {
+  margin: auto;
+  max-width: 1200px;
+  padding: 2rem 10%;
+
+  position: relative;
+}
+
+.social {
+  width: 52px;
+  height: 52px;
+}
+
+.social > img {
+  width: 52px;
+  height: 52px;
+}
+
+.social + .social {
+  margin-left: 20px;
+}
+
+.vereniging_themas {
+  list-style: none;
+  display: flex;
+  align-items: center;
+  margin: 0 3rem;
+  padding: 0;
+}
+/* .vereniging_thema {
+  width: 4rem;
+  height: 4rem;
+} */
+
+.vereniging_thema > a > svg:hover {
+  transform: scale(1.2);
+  transform-origin: center center;
+  transition: all 150ms ease;
+}
+
+.vereniging_thema > a > svg {
+  fill: #013e7a;
+  width: 3rem;
+  height: 3rem;
+}
+
+.footer {
+  max-width: 100%;
+  width: 100%;
+  background-color: var(--darkblue);
+  margin: 0 auto;
+  display: flex;
+  justify-content: space-between;
+
+  color: var(--white);
+}
+
+.showcase-image > img {
+  flex-grow: 3;
+  max-height: 20rem;
+  max-width: 80vw;
+  object-fit: scale-down;
+}
+
+.showcase-container {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: center;
+  gap: 1rem;
+  width: 100%;
+}
+
 @media only screen and (max-width: 600px) {
   .tile-grid {
     grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
   }
+
+  .header_photo {
+    display: none;
+  }
+
+  .beforeTheFold {
+    width: 100%;
+    padding: 0;
+    min-height: unset;
+  }
+
+  .scroll {
+    display: none;
+  }
 }
 
 @media only screen and (max-width: 1024px) {
@@ -640,3 +809,35 @@ h2 {
     grid-template-columns: auto;
   }
 }
+
+.detail-content {
+  max-width: 1100px;
+}
+
+.details-contact {
+  padding: 1rem;
+  float: right;
+  margin: auto;
+}
+
+@media only screen and (max-width: 700px) {
+  .details-contact {
+    float: none;
+    max-width: 300px;
+    padding-bottom: 2rem;
+  }
+}
+
+@media only screen and (max-width: 600px) {
+  .detail-body {
+    width: 100%;
+  }
+
+  .main_content {
+    padding: 0.5rem;
+  }
+
+  .footer {
+    margin-bottom: 5rem;
+  }
+}

content/stylesheets/quiz.css

@@ -98,3 +98,7 @@ h3::first-letter {
   font-size: 1rem !important;
   border-width: 4px !important;
 }
+
+.quizSpotlight {
+  margin: 0;
+}

content/verenigingen/durfdoen.md

@@ -1,7 +0,0 @@
----
-titel: Durf Doen
-id: durfdoen
-naam: Durf Doen
-verkorte_naam: Durf Doen
-konvent: gsr
----

content/verenigingen/fde.md

@@ -5,6 +5,7 @@ titel: Studentenraad Dierengeneeskunde
 id: fde
 naam: Studentenraad Dierengeneeskunde
 konvent: gsr
+logo: /assets/sfeerfotos/LogoDSR.png
 themas:
   - engagement
 website: http://www.vlaamsdiergeneeskundigekring.be/Studentenraad.php

content/verenigingen/fre.md

@@ -10,6 +10,7 @@ titel: Facultaire studentenraad rechtsgeleerdheid
 id: fre
 naam: Facultaire studentenraad rechtsgeleerdheid
 konvent: gsr
+logo: /assets/sfeerfotos/logosturec.png
 themas:
   - engagement
 ---

content/verenigingen/illusiona.md

@@ -1,6 +0,0 @@
----
-titel: Illusiona
-id: illusiona
-naam: Illusiona
-konvent: gsr
----

content/verenigingen/prometheus.md

@@ -4,6 +4,7 @@ id: prometheus
 naam: Prometheus
 verkorte_naam: Prometheus
 konvent: kultk
+logo: /assets/sfeerfotos/logoprometheus.jpg
 contact: prometheusgent@gmail.com
 website: https://prometheusgent.wordpress.com/
 social:

content/verenigingen/stt.md

@@ -4,6 +4,7 @@ id: stt
 naam: Start to talk
 verkorte_naam: stt
 konvent: gsr
+logo: /assets/sfeerfotos/logostt.jpeg
 contact: starttotalk@bemsa-gent.be
 website: https://bemsa-gent.be/scoph/start-to-talk/?fbclid=IwAR0nSY-mojzm1Ou7IRVCjdWXqdner0_H2f5QTr55DZVcAUfj6ArEL5OrIuQ
 social:

content/verenigingen/stubio.md

@@ -2,7 +2,7 @@
 naam: StuBio
 verkorte_naam: StuBio
 titel: Faculteitsraad Bio-ingenieurswetenschappen
-id: fbw
+id: stubio
 naam: Faculteitsraad Bio-ingenieurswetenschappen
 konvent: gsr
 website: stubio.ugent.be

content/verenigingen/stujardin.md

@@ -4,6 +4,7 @@ id: stujardin
 naam: StuJardin
 verkorte_naam: StuJardin
 konvent: gsr
+logo: /assets/sfeerfotos/stujardin.png
 contact: http://stujardin@gmail.com/
 website: http://student.ugent.be/stujardin/
 social:

content/verenigingen/vbk.md

@@ -7,9 +7,10 @@ konvent: fk
 website: https://www.vlaamsebiomedischekring.be/
 contact: vbkgent@gmail.com
 social:
-  - plaform: facebook
+  - platform: facebook
     link: https://www.facebook.com/vlaamsebiomedischekring/
 themas:
   - faculteit
 ---
+
 V.B.K. simply the best! Voor alle studenten Biomedische wetenschappen organiseren wij tal van beestelijke feestjes in de Point Final, tevens ons kringcafe waar tal van promo's doorgaan. Ook hebben wij ons zalige galabal samen met VLAK. Naast feestjes doen we ook toffe sportactiviteiten, cultuuractiviteiten enz. Met ons zal je de leukste studententijd tegemoet gaan, twijfel dus niet om lid te worden van onze familie, je zal er zeker geen spijt van hebben!

content/verenigingen/vvn.md

@@ -6,7 +6,6 @@ verkorte_naam: VVN
 themas:
   - wetenschap en techniek
 konvent: wvk
-logo: placeholder.png
 contact: vvn@student.ugent.be
 website: https://vvn.ugent.be/
 social:

layouts/default.erb

@@ -4,16 +4,7 @@
   <div class="main_content">
     <%= yield %>
   </div>
-<footer class="align">
-  <div>
-    <img src="" alt="">
-    <img src="" alt="">
-    <img src="" alt="">
-    <img src="" alt="">
-    <img src="" alt="">
-    <img src="" alt="">
-    <img src="" alt="">
-  </div>
+  <footer class="align footer">
     <p>©2020 Gentse studentenraad</p>
     <div lang="en">
       <p>Made with ♥ by <a href="https://zeus.gent">Zeus WPI</a></p>

layouts/detail.erb

@@ -1,26 +1,41 @@
-<h1> <%= item[:naam] %> </h1>
-<div class="details-container details-logo">
-    <img src="https://dsa.ugent.be/api/verenigingen/<%= abbreviation(item) %>/logo?size=huge" alt="<%= item[:naam] %>">
-</div>
-<div class="details-container details-contact">
-    <% if item[:deelname_link] %>
-        <a href="<%= item[:deelname_link] %>"><%= item[:deelname_link] %></a>
-    <% end %>
+<div class="detail-body">
+    <div class="details-contact">
+        <%if item[:deelname_link] || item[:contact] || item[:website]%>
+        <h3>Contact</h3>
+        <% if item[:deelname_link] %><a href="<%= item[:deelname_link] %>"><%= item[:deelname_link] %></a><% end %>
         <div class="contact-container">
-        <p><a href="<%= item[:contact] %>"><%= item[:contact] %></a></p>
-        <p><a href="<%= item[:website] %>"><%= item[:website] %></a></p>
-    </div>
-    <div class="social-container">
-        <ul>
+            <% if item[:contact] %><p>Email-adres: <a href="<%= item[:contact] %>"><%= item[:contact] %></a></p><%end%>
+            <% if item[:website] %><p>Website: <a href="<%= item[:website] %>"><%= item[:website] %></a></p><%end%>
+        </div><%end%>
         <% if item[:social] %>
+        <div class="social-container">
+        <h4>Sociale media</h4>
+            <ul>
                 <% for social in item[:social] %>
-                    <li class="social-<%= social[:platform] %>">
-                    <a href="<%= social[:link] %>"><%= social[:link] %></a>
-                    </li>
-                <% end %>
+                    <a class="social" href="<%= social[:link] %>">
+                        <img src="/assets/social/<%= social[:platform].downcase %>_small.png">
+                    </a>
                 <% end %>
             </ul>
         </div>
+        <% end %>
+    </div>
+    <div class="detail_title">
+        <a target="_blank" href="<%= item[:website] %>"><img src="https://dsa.ugent.be/api/verenigingen/<%= abbreviation(item) %>/logo?size=small" alt="<%= item[:naam] %>"></a>
+        <h2><%= item[:naam] %></h2>
+        <% if item[:themas] %>
+            <% for thema in item[:themas] %>
+                <div class="vereniging_thema">
+                    <a href="/themas/<%= thema %>.html">
+                        <%= @items["/assets/themas_icon/"+thema+".svg"].compiled_content %>
+                    </a>
+                </div>
+            <% end %>
+        <% end %>
+    </div>
+    <div class="detail-content">
+        <%= yield%>
+    </div>
 </div>
 <div class="details-container details-photo">
     <div class="showcase-container">
@@ -31,32 +46,12 @@
             </div>
         <% end %>
     <% end %>
-    <div class="thema-container">
-    <% if item[:themas] %>
-        <p><span class="thema-title">Thema's:</span>
-            <ul>
-                <% for thema in item[:themas] %>
-                    <li><%= thema %></li>
-                <% end %>
-            </ul>
-        </p>
-    <% end %>
     </div>
 </div>
-<% if item[:verenigingen] %>
-    <div class="details-container details-verenigingen">
-        <% for vereniging in item[:verenigingen] %>
-            <div class="vereninging-container">
-                <p><%= vereniging[:naam] %></p>
-                <img src="<%= vereniging[:photo] %>" alt="vereniging logo"></img>
-            </div>
-        <% end %>
-    </div>
-<% end %>
 <% if item.path.include? "konventen" %>
-    <% for vereniging in verenigingen_voor_konvent(item[:id]) %>
-        <div>
-            <%= vereniging[:naam] %>
+    <div class="fancy_link_container">
+    <% verenigingen_voor_konvent(item[:id]).sort_by{ |x| x[:naam] }.each do |vereniging|  %>
+        <%= render '/partials/pretty_link.*', :item => vereniging %>
+    <% end %>
     </div>
 <% end %>
-<% end %>

layouts/evenement.erb

@@ -1,4 +1,4 @@
-<h1> <%= item[:naam] %> </h1>
+<h2> <%= item[:naam] %> </h2>
 <p> georganiseerd door: <%= item[:organiser] %></p>
 <div class="details-wrapper">
     <div class="details-container details-text">

layouts/homepage.erb

@@ -1,27 +1,19 @@
+<style>
+  .main_content {
+    padding: 0;
+  }
+</style>
+<img src="/assets/placeholder.png" class="header_photo backgroundSquare"></div>
 <div class="beforeTheFold">
-  <div class="header_photo backgroundSquare"></div>
-
-
   <article class="align">
-    <h1 class="hidden">Durf Doen</h1>
-    <div class="intro">
-      <div class="header_blueSquare backgroundSquare"></div>
     <h2 class="studentZijn">
       <span class="underline">Student</span> zijn is<br>
       <span class="underline">meer</span> dan studeren alleen
     </h2>
-    </div>
-    <div class="quote">
-      <div>
-        <img src="/assets/durfdoenlogo.png" alt="">
-      </div>
-      <div>
-        <p>Durf Doen wil je helpen de vereniging te vinden waar jij je thuis zal voelen.</p>
+    <p class="quote">Durf Doen wil je helpen de vereniging te vinden waar jij je thuis zal voelen.</p>
     <div class="quizSpotlight">
       <a href="/quiz/">Doe de test</a>
     </div>
-      </div>
-    </div>
   </article>
 
   <div class="scroll">

lib/helpers/verenigingen.rb

@@ -70,10 +70,10 @@ module VerenigingenHelper
   end
 
   def image_url(item)
-    if item[:image].nil?
+    if item[:logo].nil?
       "https://dsa.ugent.be/api/verenigingen/#{ abbreviation item }/logo?size=medium"
     else
-      item[:image]
+      item[:logo]
     end
   end