Add election modal

4 files changed, 49 insertions, 4 deletions

diff --git a/gulpfile.js b/gulpfile.js
index fa322d0..927b6c6 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -84,7 +84,9 @@ function html() {
 
 function js() {
 	var src = [
+		'./node_modules/bootstrap-sass/assets/javascripts/bootstrap/carousel.js',
 		'./node_modules/bootstrap-sass/assets/javascripts/bootstrap/collapse.js',
+		'./node_modules/bootstrap-sass/assets/javascripts/bootstrap/modal.js',
 		'./node_modules/bootstrap-sass/assets/javascripts/bootstrap/transition.js',
 		'./node_modules/jquery/dist/jquery.slim.min.js',
 	];
diff --git a/resources/pug/finals/index.pug b/resources/pug/finals/index.pug
index f5aa529..cf45383 100644
--- a/resources/pug/finals/index.pug
+++ b/resources/pug/finals/index.pug
@@ -6,7 +6,7 @@ block extra_head
 block titleContainer
 
 block content
-	header
+	header(style="position:relative;")
 		div(style="display:table-row;")
 			img#profile(alt="Camil Staps", style="vertical-align:bottom;", src="/assets/img/profile.jpg", width="170")
 			div#basicinfo(style="display:table-cell;vertical-align:bottom;")
@@ -40,9 +40,50 @@ block content
 					|  
 					a(href="https://nl.linkedin.com/in/camilstaps")
 						i.fab.fa-lg.fa-linkedin(title="LinkedIn")
+				h1(style="top:0;right:0;position:absolute;")
+					a(href="#tk2023", title="Election of the Dutch House of representatives", data-toggle="modal")
+						i.fas.fa-person-booth
 
 	hr
 
+	div.modal.fade#tk2023(tabindex="-1", role="dialog", aria-lbaelledby="tk2023-title")
+		div.modal-dialog.modal-lg(role="document")
+			div.modal-content
+				div.modal-header
+					h4.modal-title#tk2023-title Election of the Dutch House of representatives 2023
+				div.modal-body
+					p Informeer je en ga stemmen.
+					p
+						| Dit is de verwachte invloed van de plannen van de verschillende partijen op 
+						a(href="#tk2023-carousel", data-slide-to="0") lasten voor gezinnen
+						|, 
+						a(href="#tk2023-carousel", data-slide-to="1") lasten voor bedrijven
+						|, 
+						a(href="#tk2023-carousel", data-slide-to="2") koopkracht
+						|, 
+						a(href="#tk2023-carousel", data-slide-to="3") armoede
+						|  en 
+						a(href="#tk2023-carousel", data-slide-to="4") werkloosheid
+						|.
+
+					div.carousel.slide#tk2023-carousel(data-ride="carousel", data-interval="false")
+						div.carousel-inner(role="listbox")
+							div.item.active
+								img(src="https://files.camilstaps.nl/cpb/lasten-voor-gezinnen.png")
+							div.item
+								img(src="https://files.camilstaps.nl/cpb/lasten-voor-bedrijven.png")
+							div.item
+								img(src="https://files.camilstaps.nl/cpb/koopkracht.png")
+							div.item
+								img(src="https://files.camilstaps.nl/cpb/armoede.png")
+							div.item
+								img(src="https://files.camilstaps.nl/cpb/werkloosheid.png")
+				div.modal-footer(style="text-align:left;")
+					p
+						| Het #[strong basispad] is de verwachte ontwikkeling bij ongewijzigd beleid. Bron: 
+						a(href="https://www.cpb.nl/keuzes-in-kaart-2025-2028") CPB
+						|.
+
 	section
 		p.larger#lead
 			| I am a PhD candidate in linguistics.
diff --git a/resources/pug/include/layout-sidebar.pug b/resources/pug/include/layout-sidebar.pug
index 4244531..bf8ce55 100644
--- a/resources/pug/include/layout-sidebar.pug
+++ b/resources/pug/include/layout-sidebar.pug
@@ -1,9 +1,8 @@
 extends layout.pug
 
-block prepend js
-	script(src='/assets/js/jquery.slim.min.js')
-	script(src='/assets/js/transition.min.js')
+block append js
 	script(src='/assets/js/collapse.min.js')
+	script(src='/assets/js/transition.min.js')
 
 block content
 	div.row
diff --git a/resources/pug/include/layout.pug b/resources/pug/include/layout.pug
index 1cbf0f4..71a1146 100644
--- a/resources/pug/include/layout.pug
+++ b/resources/pug/include/layout.pug
@@ -34,3 +34,6 @@ html(lang="en")
 		include foot.pug
 
 		block js
+			script(src='/assets/js/jquery.slim.min.js')
+			script(src='/assets/js/carousel.min.js')
+			script(src='/assets/js/modal.min.js')