Legal.

assets/icons/arrow.svg

@@ -0,0 +1,3 @@
+<svg width="7" height="12" viewBox="0 0 7 12" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M6 11L1 6L6 1" stroke="#808080" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

assets/style.css

@@ -54,6 +54,14 @@ h1 {
     padding: 0;
 }
 
+h2 {
+    font-weight: bold;
+    font-size: 32px;
+    line-height: 42px;
+    margin: 0 0 16px 0;
+    padding: 0;
+}
+
 h2.name {
     font-size: 18px;
     line-height: 28px;
@@ -69,7 +77,7 @@ p {
     padding: 0;
 }
 
-button {
+button, .button {
     width: 192px;
     height: 54px;
     color: #fff;
@@ -85,11 +93,24 @@ button {
     margin: 64px 0;
     padding: 0;
     cursor: pointer;
+    transition: opacity 0.1s linear;
+}
+
+button:hover, .button:hover {
+    color: #fff;
+    opacity: 0.9;
+    transition: opacity 0.1s linear;
 }
 
 a {
     text-decoration: none;
     color: var(--dark-gray);
+    transition: color 0.1s linear;
+}
+
+a:hover {
+    color: var(--light-gray);
+    transition: color 0.1s linear;
 }
 
 small {
@@ -107,6 +128,7 @@ small {
     border-width: 1px 0 0 0;
     border-style: solid;
     border-color: var(--light-gray);
+    margin: 64px 0 0 0;
     padding: 32px 0 0 0;
 }
 
@@ -120,3 +142,30 @@ small {
     grid-auto-flow: column;
     margin: 0 0 32px 0;
 }
+
+.footer-icons img {
+    transition: opacity 0.1s linear;
+}
+
+.footer-icons img:hover {
+    opacity: 0.9;
+    transition: opacity 0.1s linear;
+}
+
+.back-to-homepage {
+    display: inline-flex;
+    gap: 8px;
+    font-size: 14px;
+    line-height: 18px;
+    color: var(--light-gray);
+    margin: 0 0 16px 0;
+}
+
+.back-to-homepage:hover {
+    color: var(--dark-gray);
+}
+
+.back-to-homepage img {
+    width: 8px;
+    height: 16px;
+}

content/index.html

@@ -5,7 +5,7 @@
     <h1>Full-Stack<br />Software Developer</h1>
     <p>Hi, my name is Marvin. I'm a full-stack software engineer from Germany, open-source and Linux enthusiast, and co-founder of Emvi, where we build and maintain software projects for clients, and work on existing software.</p>
     <p>I’m building Pirsch Analytics — a privacy-friendly, cookie-less web analytics solution made for personal websites, freelancers, and agencies.</p>
-    <button>Get in touch</button>
+    <a class="button" href="mailto:marvin@marvinblum.de">Get in touch</a>
 </div>
 
 {{partial "footer" .}}

content/legal/index.html

@@ -0,0 +1,18 @@
+{{partial "head" .}}
+
+<div class="content">
+    {{partial "back-to-homepage" .}}
+    <h1>Legal</h1>
+    <h2>According to §5 TMG</h2>
+    <p>
+        Marvin Blum<br />
+        Gerhard-Hauptmannstraße 3<br />
+        33378 Rheda-Wiedenbrück, Germany<br />
+        marvin@marvinblum.de
+    </p>
+    <h2>Cookie Policy</h2>
+    <p>This page does not use cookies.</p>
+</div>
+
+{{partial "footer" .}}
+{{partial "end" .}}

partials/back-to-homepage.html

@@ -0,0 +1,4 @@
+<a href="/" class="back-to-homepage">
+    <img src="assets/icons/arrow.svg" alt="&lt;" />
+    Back to Homepage
+</a>

partials/footer.html

@@ -14,7 +14,7 @@
         </a>
     </div>
     <p>
-        <small>© 2021 Marvin Blum. This page does not use cookies. Website Analytics by Pirsch.</small>
+        <small>© 2021 Marvin Blum. This page does not use cookies. Website Analytics by <a href="https://pirsch.io/" target="_blank">Pirsch</a>.</small>
     </p>
     <p>
         <small>