mpercivalxyz

commit cced2af1911fce4a38d35f4520e09a037257c895
parent 95d72070c96bf0cb7e3e6dd2a7d86ca1cc3f7e99
Author: mpizzzle <m@michaelpercival.xyz>
Date:   Sat, 24 Sep 2022 20:05:22 +0100

minor tinkering with navbar, css colours, removing footer for now

Diffstat:
M
layouts/_default/list.html
 | 
5
++++-
M
layouts/partials/footer.html
 | 
13
+++++++------
M
layouts/partials/navigation.html
 | 
29
++++++++++++++++++-----------
M
static/style.css
 | 
47
++++++++++++++++++++++++++++++++++++++++++-----

4 files changed, 71 insertions(+), 23 deletions(-)
diff --git a/layouts/_default/list.html b/layouts/_default/list.html
@@ -2,10 +2,13 @@
 <header><h1 id="tag_{{ .Title }}">{{ .Title | title }}</h1></header>
 <article>
 {{ .Content -}}
+<div class="main">
 <ul>
 {{- range.Pages }}
 	<li><time datetime="{{ .Date.Format "2006-01-02T15:04:05Z07:00" }}">{{ .Date.Format "2006 Jan 02" }}</time> &ndash; <a href="{{ .RelPermalink }}">{{ .Title }}</a></li>
 {{ end -}}
 </ul>
+</div>
 </article>
-{{- partial "footer.html" . }}
+</main>
+</body>
diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html
@@ -1,10 +1,11 @@
-{{ partial "nextprev.html" . -}}
-{{ partial "taglist.html" . -}}
 </article>
 </main>
-<footer>
-    <a href="{{ .Site.BaseURL }}">{{ .Site.BaseURL }}</a><br><br>
-    <a href="/index.xml"><img src="/rss.svg" style="max-height:1.5em" alt="RSS Feed" title="Subscribe via RSS for updates."></a>
-</footer>
+<!--<footer class="main">
+{{ partial "nextprev.html" . -}}
+{{ partial "taglist.html" . -}}
+<br>
+<br>
+<br>
+</footer>-->
 </body>
 </html>
diff --git a/layouts/partials/navigation.html b/layouts/partials/navigation.html
@@ -1,19 +1,26 @@
 <nav class="nav-container">
   <div class="nav-element">
-    <p><a href="https://git.michaelpercival.xyz"><img src="/git.png" class="img-icon-aligned" width="32" height="32" /></a> |
-       <a href="https://github.com/mpizzzle"><img src="/github.png" class="img-icon-aligned" width="32" height="32" /></a> |
-       <a href="/rss.xml"><img src="/rss.png" class="img-icon-aligned" width="32" height="32" /></a></p>
+    <ul>
+      <li><a href="https://git.michaelpercival.xyz"><img src="/git.png" class="img-icon-aligned" width="32" height="32" /></a></li>
+      <li><a href="https://github.com/mpizzzle"><img src="/github.png" class="img-icon-aligned" width="32" height="32" /></a></li>
+      <li><a href="/rss.xml"><img src="/rss.png" class="img-icon-aligned" width="32" height="32" /></a></li>
+    </ul>
   </div>
   <div class="nav-element">
-    <p><a href="/">home</a> |
-       <a href="/thoughts">thoughts</a> |
-       <a href="/software">software</a> |
-       <a href="/hardware">hardware</a> |
-       <a href="/library">library</a> |
-       <a href="/wallpapers">wallpapers</a></p>
+    <ul>
+      <li><a href="/">home</a></li>
+      <li><a href="/thoughts">thoughts</a></li>
+      <li><a href="/software">software</a></li>
+      <li><a href="/hardware">hardware</a></li>
+      <li><a href="/library">library</a></li>
+      <li><a href="/wallpapers">wallpapers</a></li>
+    </ul>
   </div>
   <div class="nav-element">
-    <p><a href="mailto:m@michaelpercival.xyz">m@michaelpercival.xyz</a> |
-       <a href="/mpxyz.pgp"><img class="img-icon-aligned" src="/gnupg.png" width="32" height="32" /></a></p>
+    <ul>
+      <li><a href="mailto:m@michaelpercival.xyz">m@michaelpercival.xyz</a></li>
+      <li><a href="/mpxyz.pgp"><img class="img-icon-aligned" src="/gnupg.png" width="32" height="32" /></a></li>
+      <li></li>
+    </ul>
   </div>
 </nav>
diff --git a/static/style.css b/static/style.css
@@ -3,12 +3,30 @@ body {
     color: #ccc;
     margin: 0em;
     font-family: 'BQN386';
+    padding-top: 5em;
 }
 
 code {
     font-family: 'BQN386';
 }
 
+a:link {
+  color: #BD93F9;
+}
+
+a:visited {
+  color: #BD93F9;
+}
+
+a:hover {
+  color: #CAA9FA;
+  background-color: #2C2E3A;
+}
+
+a:active {
+  color: #50FA7B;
+}
+
 @font-face {
     font-family: 'BQN386';
     src: url(/BQN386/BQN386.woff2) format('woff2'),
@@ -19,10 +37,9 @@ code {
 }
 
 .main {
-    background-color: #1d2021;
+    background-color: #282A36;
     line-height: 1.5em;
     max-width: 63em;
-    margin: auto;
     margin: 0em;
     margin-top: 2em;
     margin-bottom: 2em;
@@ -81,15 +98,35 @@ footer {
 
 .nav-container {
     display: flex;
-    background-color: #1d2021;
+    background-color: #282A36;
+    position: fixed;
+    top: 0;
+    width: 100%;
+    box-shadow: 0 2px 5px rgb(0 0 0 / 26%);
 }
 
 .nav-element {
     display: flex;
     flex: 1;
+}
+
+.nav-element ul {
     justify-content: center;
-    background-color: #1d2021;
-    margin: auto;
+    display: flex;
+    flex: 1;
+    margin: 0em;
+}
+
+.nav-element ul li {
+    height: 100%;
+    display: flex;
+    align-items: center;
+    float: left;
+}
+
+.nav-element ul li a {
+    padding: 1em;
+    text-decoration: none;
 }
 
 .contact-element {