From 668aa546419ec3e8ddb3e3f74db59b954aa07fad Mon Sep 17 00:00:00 2001
From: Joachim Nielandt <joachim.nielandt@ugent.be>
Date: Tue, 2 Jan 2018 20:16:15 +0100
Subject: [PATCH] Fixing up the top menu.

---
 src/app/app.component.css  | 20 +++++++++++++++++++-
 src/app/app.component.html | 12 +++++++++---
 2 files changed, 28 insertions(+), 4 deletions(-)

diff --git a/src/app/app.component.css b/src/app/app.component.css
index 4f9dd8a..468ddf7 100644
--- a/src/app/app.component.css
+++ b/src/app/app.component.css
@@ -2,4 +2,22 @@
     text-align: center;
     margin-left: auto;
     margin-right: auto
-}
\ No newline at end of file
+}
+
+#topname span {
+    font-size: 23pt
+}
+
+#topname #dot {
+    line-height: 20pt;
+    font-size: 50pt;
+}
+
+#topname #last {
+    font-size: 20pt;
+}
+
+#topname {
+    border-bottom: 1pt solid black;
+    margin-bottom: 9pt;
+}
diff --git a/src/app/app.component.html b/src/app/app.component.html
index ddc46a6..5fbd58d 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -1,6 +1,12 @@
 <!--this is bootstrap super container-->
 <div class="container-fluid">
 
+  <div class="row">
+    <div class="col-md-12 centercontents" id="topname">
+        <span class="display-1" id="first">Joachim</span><span id="dot">.</span><span id="last" class="display-1">Nielandt</span>
+    </div>
+  </div>
+
   <!--the top menu... should be always visible, everywhere-->
   <div class="row">
     <div class="col-md-12 centercontents" id="topmenubuttons">
@@ -8,9 +14,9 @@
         <!-- <button type="button" class="btn btn-secondary">Left</button> -->
         <!-- <button type="button" class="btn btn-secondary">Middle</button> -->
         <!-- <button type="button" class="btn btn-secondary">Right</button> -->
-        <a routerLink="/home"><i class="fa fa-home fa-2x" aria-hidden="true"></i></a>
-        <a routerLink="/posts"><i class="fa fa-sticky-note fa-2x" aria-hidden="true"></i></a>
-        <a routerLink="/cv"><i class="fa fa-user fa-2x" aria-hidden="true"></i></a>
+        <a routerLink="/home"><i class="text-secondary fa fa-home fa-fw fa-2x" aria-hidden="true"></i></a>
+        <a routerLink="/posts"><i class="text-secondary fa fa-sticky-note fa-fw  fa-2x" aria-hidden="true"></i></a>
+        <a routerLink="/cv"><i class="text-secondary fa fa-id-badge fa-fw fa-2x" aria-hidden="true"></i></a>
       </div>
     </div>
   <!--row-->