Steal a sidebar thingy from W3 and off to gaming

2022-05-24 15:15:49 +02:00 · 2022-05-24 15:15:49 +02:00 · 55ccb41bd4
parent e6b2a666dd
commit 55ccb41bd4
2 changed files with 37 additions and 1 deletions
--- a/index.html
+++ b/index.html
@ -8,6 +8,17 @@
    <link rel="stylesheet" href="static/nightlycss.css">
 </head>
 <body>
+    <div id="sidebar">
+        <ul>
+            <li><a class="active" href="#home">Home</a></li>
+            <li><a href="#news">News</a></li>
+            <li><a href="#contact">Contact</a></li>
+            <li><a href="#about">About</a></li>
+        </ul>
+    </div>
+    <div id="content">
        <h1>Hello world!</h1>
+
+    </div>
 </body>
 </html>
--- a/static/nightlycss.css
+++ b/static/nightlycss.css
@ -1,6 +1,31 @@
 :root {
    --bgcolour: #290B57;
+    --sdbarcolour: #481496;
 }
 body {
    background-color: var(--bgcolour);
+    margin:0;
+}
+
+#sidebar ul {
+    margin: 0;
+    padding: 0;
+    width:85px;
+    background-color: var(--sdbarcolour);
+    overflow: auto;
+    display: block;
+    height:100%;
+    position: fixed;
+}
+
+#sidebar li a {
+    display: block;
+    color: #000;
+    padding: 8px 16px;
+    text-decoration: none;
+}
+
+#content {
+    margin-left:138px;
+    padding: 1px 16px;
 }