Restructured parts of the website

public/static/style/base.css

@@ -7,11 +7,24 @@
 		min-width: calc(100% - 2px - 4em);
 	}
 
-	body > nav {
+	body > section.header-navigation, body > footer {
 		width: 100%;
 		flex-grow: 1 !important;
 	}
+
+	.hide-small {
+		display: none;
+	}
+
+	.hide-big {
+		display: block !important;
+	}
 }
+
+.hide-big {
+	display: none;
+}
+
 :root {
 	font-family: "sans-serif";
 	--colour-bg: #f0f0f0;
@@ -40,17 +53,23 @@ body {
 	color: var(--colour-fg);
 }
 
-body > nav {
+body > section.header-navigation {
-	flex: 0 0 160px;
+	flex: 0 0 200px;
 	padding: 2em;
 }
 
-body > nav > header {
+body > footer {
+	flex: 0 0 200px;
+	padding: 2em;
+	border: none;
+}
+
+body > section.header-navigation > header {
 	text-align: center;
 }
 
 
-body > nav > header > img {
+body > section.header-navigation > header > img {
 	width: 100%;
 	max-width: 160px;
 }

source/constants.d

@@ -0,0 +1,4 @@
+class Constants {
+	public static immutable string SITE_NAME = "Chris Netsoj.nl";
+	public static immutable string COPYRIGHT = "© Chris Josten, 2020";
+}

views/pages/article-list.dt

@@ -4,7 +4,6 @@ block header
 	title Posts - Netsoj.nl
 
 block sidebar
-	include /parts/menu.dt
 
 block content
 	header

views/pages/article.dt

@@ -1,9 +1,11 @@
 extends /parts/page
 block header
-	title #{content.title} - Netsoj.nl
+	title #{content.title} - Chris Netsoj.nl
+	meta(name="og:title", content="#{content.title}")
+	meta(name="og:type", content="article")
+	meta(name="og:article", content="article")
 
 block sidebar
-	include /parts/menu.dt
 
 block content
 	article

views/pages/error.dt

@@ -4,7 +4,6 @@ block header
 	title #{error.message} - Netsoj.nl
 
 block sidebar
-	include /parts/menu.dt
 
 block content
 	header

views/pages/page.dt

@@ -1,10 +1,9 @@
 extends /parts/page.dt
 
 block header
-	title #{content.title} - Netsoj.nl
+	title #{content.title} - Chris Netsoj.nl
 
 block sidebar
-	include /parts/menu.dt
 
 block content
 	header

views/pages/project-list.dt

@@ -1,10 +1,9 @@
 extends /parts/page.dt
 
 block header
-	title Projects - Netsoj.nl
+	title Projects - Chris Netsoj.nl
 
 block sidebar
-	include /parts/menu.dt
 
 block content
 	header

views/pages/project.dt

@@ -3,7 +3,6 @@ block header
 	title #{content.title} - Netsoj.nl
 
 block sidebar
-	include /parts/menu.dt
 
 block content
 	section

views/parts/footer.dt

@@ -0,0 +1,5 @@
+p 
+	small 
+		| © Chris Josten, 2020. If not specified otherwise, all content on this 
+		| website is <a rel="license" href="https://creativecommons.org/licenses/by/4.0/">
+		| licensed under the CC-BY 4.0</a>.

views/parts/menu.dt

@@ -1,14 +1 @@
-- void menuItem(string text, string link)
-	li
-		a(href="#{link}") #{text}
 
-header
-	img.logo(src="/static/img/logo.png", alt="The logo of the website: the letter C drawn in an inprofessional manner with wobbley eyes on top")
-	p Chris's webstekkie
-ul
-	- menuItem("home", "/");
-	- menuItem("posts", "/posts/");
-	- menuItem("projects", "/projects/");
-
-footer
-	p ©Chris Josten, 2020

views/parts/page.dt

@@ -1,5 +1,6 @@
 doctype html
-html
+html(prefix="og: http://ogp.me/ns#")
+	- import constants;
 	head
 		meta(name="viewport", content="width=device-width; initial-scale=1")
 		link(rel="stylesheet", href="/static/style/base.css")
@@ -7,10 +8,30 @@ html
 		link(rel="alternate stylesheet", href="/static/style/old.css", title="1999")
 		link(rel="shortcut icon", href="/static/img/logo.png")
 		meta(name="theme-color", content="#7f0602")
+		meta(name="og:site_name", content="#{Constants.SITE_NAME}")
 
 		block header
 	body
-		nav
+		- void menuItem(string text, string link)
+			li
+				a(href="#{link}") #{text}
+
+		section.header-navigation
+			header
+				img.logo(src="/static/img/logo.png", alt="The logo of the website: the letter C drawn in an unprofessional manner with wobbly eyes on put on top")
+				p Chris's webstekkie
+			nav
+				ul
+					- menuItem("home", "/");
+					- menuItem("posts", "/posts/");
+					- menuItem("projects", "/projects/");
 			block sidebar
+			footer.hide-small
+				block footer
+				include /parts/footer.dt
 		main
 			block content
+		
+		footer.hide-big
+			block footer
+			include /parts/footer.dt