3 changed files with 40 additions and 10 deletions
--- a/README.md
+++ b/README.md
@ -1,3 +1,3 @@
 # nightly.town

-The website shown at (nightly.town)[https://nightly.town]
+website
--- a/index.html
+++ b/index.html
@ -8,10 +8,14 @@
    <link rel="stylesheet" href="static/nightlycss.css">
 </head>
 <body>
-    <div id="container">
-        <div id="header">
-            <h1>Hello!</h1>
-        </div>
+    <div class="sidenav">
+        <a href="#">About</a>
+        <a href="#">Services</a>
+        <a href="#">Clients</a>
+        <a href="#">Contact</a>
+      </div>
+    <div id="content">
+        <h1>Welcome to my website!</h1>
    </div>
 </body>
 </html>
--- a/static/nightlycss.css
+++ b/static/nightlycss.css
@ -1,16 +1,42 @@
 :root {
    --bgcolour: #212121;
-    --sdbarcolour: #4c208f;
+    --sdbarcolour: #6600ff;
    --textcolour: #EFF0F1;
 }
 body {
    font-family: 'Helvetica', 'Arial', sans-serif;
    background-color: var(--bgcolour);
-    margin: 0;
+    margin:0;
    color: var(--textcolour);
 }

-.container {
-    display: flex;
-    flex-direction: column;
+.sidenav {
+    height: 100%;
+    width: 85px;
+    position: fixed;
+    z-index: 1;
+    top: 0;
+    left: 0;
+    background-color: var(--bgcolour);
+    overflow-x: hidden;
+    padding-top: 20px;
+    border-right: 2px solid var(--sdbarcolour);
+}
+
+.sidenav a {
+    padding: 6px 6px 6px 10px;
+    text-decoration: none;
+    font-size: 25px;
+    color: #818181;
+    display: block;
+}
+
+.sidenav a:hover {
+    color: #f1f1f1;
+}
+
+#content {
+    margin-top: 20px;
+    margin-left:138px;
+    padding: 1px 16px;
 }