1 files changed, 58 insertions, 0 deletions
diff --git a/resources/html/base.html b/resources/html/base.html
new file mode 100644
index 0000000..0b76341
--- /dev/null
+++ b/resources/html/base.html
@@ -0,0 +1,58 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="UTF-8"/>
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>Welcome to nicktodo</title>
+
+    <!-- styles -->
+    {% style """/assets/bulma/css/bulma.min.css" %}
+    {% style """/assets/material-icons/css/material-icons.min.css" %}
+
+    {% style """/css/screen.css" %}
+  </head>
+  <body>
+      <!-- navbar -->
+      <nav class="navbar is-info">
+          <div class="container">
+              <div class="navbar-brand">
+                  <a class="navbar-item" href="/" style="font-weight:bold;">nicktodo</a>
+                  <span class="navbar-burger burger" data-target="nav-menu">
+                      <span></span>
+                      <span></span>
+                      <span></span>
+                  </span>
+              </div>
+              <div id="nav-menu" class="navbar-menu">
+                  <div class="navbar-start">
+                      <a href="/" class="navbar-item{% ifequal page "home.html" %} is-active{%endifequal%}">Home</a>
+                      <a href="/about" class="navbar-item{% ifequal page "about.html" %} is-active{%endifequal%}">About</a>
+                  </div>
+              </div>
+          </div>
+      </nav>
+
+      <section class="section">
+          <div class="container">
+              {% block content %}
+              {% endblock %}
+          </div>
+      </section>
+
+    <!-- scripts -->
+    <script type="text/javascript">
+      (function() {
+        var burger = document.querySelector('.burger');
+        var nav = document.querySelector('#'+burger.dataset.target);
+        burger.addEventListener('click', function(){
+          burger.classList.toggle('is-active');
+          nav.classList.toggle('is-active');
+        });
+      })();
+    </script>
+
+    
+    {% block page-scripts %}
+    {% endblock %}
+  </body>
+</html>