Update navbar on landing page

2 files changed, 20 insertions, 4 deletions

diff --git a/www/index.css b/www/index.css
index 2fe966c..73a4ae4 100644
--- a/www/index.css
+++ b/www/index.css
@@ -28,12 +28,21 @@ html,body { margin: 0; font-family: sans-serif; }
         line-height: 2em;
         margin: 0;
         padding: 8px 10%;
+        display: flex;
+        flex-direction: row;
+        justify-content: space-between;
 }
-#header > nav { display: inline-block; float: right; }
+@media only screen and (max-width: 800px) {
+  #header {
+    flex-direction: column;
+    align-items: center;
+  }
+}
+#header > nav { flex: initial; }
 #header > nav > a:link { color: #81b7ff }
 #header > nav > a:visited { color: #cd78f4; }
 #header > nav > a:focus, #header > nav > a:active, #header > nav > a:hover { color: #6005dd; }
-#header > .title { display: inline-block; font-family: monospace; font-size: 1.5em; text-decoration: none; }
+#header > .title { flex: auto; font-family: monospace; font-size: 1.5em; }
 #header > a.title:link, 
   #header > a.title:visited, 
   #header > a.title:hover,
diff --git a/www/index.html b/www/index.html
index c38ee67..c19836d 100644
--- a/www/index.html
+++ b/www/index.html
@@ -16,8 +16,15 @@
     <a class='title'
          href='/'>senders.io</a>
     <nav>
-      <a href="/resume">Resume</a> <a href="/blog">Blog</a> <a href=
-      "https://github.com/s3nd3r5">Github</a>
+      <a href="/blog">blog</a> <a rel="external noopener noreferrer"
+           target="_blank"
+           href="https://github.com/s3nd3r5">github</a> <a rel=
+           "external noopener noreferrer"
+           target="_blank"
+           href="https://git.senders.io">cgit</a> <a rel=
+           "me external noopener noreferrer"
+           target="_blank"
+           href="https://mastodon.online/@senders">mastodon</a>
     </nav>
   </div>
   <div id='body'>