1 files changed, 38 insertions, 0 deletions
diff --git a/src/lib/components/Navigation.svelte b/src/lib/components/Navigation.svelte
new file mode 100644
index 0000000..6ffeeb5
--- /dev/null
+++ b/src/lib/components/Navigation.svelte
@@ -0,0 +1,38 @@
+<script lang="ts">
+</script>
+
+<div class="NavBar">
+  <a href="./about"> About</a>
+  <a href="./create"> New Note</a>
+  <a href="./visualize"> Visualize</a>
+  <a href="./login" class="login"> Login</a>
+</div>
+
+<style>
+  .login {
+    float: right;
+  }
+  .NavBar {
+    overflow: hidden;
+    background-color: #333;
+  }
+
+  .NavBar a {
+    float: left;
+    display: block;
+    color: #f2f2f2;
+    text-align: center;
+    padding: 14px 16px;
+    text-decoration: none;
+  }
+
+  .NavBar a:hover {
+    background-color: #ddd;
+    color: black;
+  }
+
+  .NavBar a.active {
+    background-color: #4caf50;
+    color: white;
+  }
+</style>