starting point to convert to pandoc template

footer.html

@@ -0,0 +1,3 @@
+<div class="footer">
+  <p>ahmza</p>
+</div>

header.html

@@ -0,0 +1,3 @@
+<div class="header">
+  <h1>I want to be a dad</h1>
+</div>

index.html

@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<html xmlns="http://www.w3.org/1999/xhtml">
+
+<head>
+  <meta charset="utf-8" />
+  <meta name="generator" content="pandoc" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
+  <title>I want to be a dad!</title>
+  <link rel="stylesheet" href="styles.css" />
+</head>
+
+<body>
+  <div class="grid-container">
+
+    <div class="content">
+      <p>Hello,</p>
+      <p>If you are reading this then I guess you would like to know why.</p>
+      <p>Well thats reserved information. try again next time.</p>
+    </div>
+
+  </div>
+</body>
+
+</html>

nav.html

@@ -0,0 +1,6 @@
+<div class="menu">
+  <ul>
+    <li><a href="https://ahmza.dad">ahmza.dad</a></li>
+    <li><a href="https://blog.ahmza.com">blog.ahmza.com</a></li>
+  </ul>
+</div>

template.html

@@ -0,0 +1,39 @@
+<!DOCTYPE html>
+<html xmlns="http://www.w3.org/1999/xhtml">
+
+<head>
+  <meta charset="utf-8" />
+  <meta name="generator" content="pandoc" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
+  <title>I want to be a dad!</title>
+  <link rel="stylesheet" href="styles.css" />
+</head>
+
+<body>
+  <div class="grid-container">
+
+    <div class="header">
+      <h1>I want to be a dad!</h1>
+    </div>
+
+    <div class="menu">
+      <ul>
+        <li><a href="https://ahmza.dad">ahmza.dad</a></li>
+        <li><a href="https://blog.ahmza.com">blog.ahmza.com</a></li>
+      </ul>
+    </div>
+
+    <div class="content">
+      <p>Hello,</p>
+      <p>If you are reading this then I guess you would like to know why.</p>
+      <p>Well thats reserved information. try again next time.</p>
+    </div>
+
+    <div class="footer">
+      <p>ahmza</p>
+    </div>
+
+  </div>
+</body>
+
+</html>