From 4c4ca2dd98b1c1c924f3e7ee731aad8bc4571091 Mon Sep 17 00:00:00 2001
From: Hubert Van De Walle <hubv@protonmail.com>
Date: Sat, 22 Aug 2020 00:14:10 +0200
Subject: [PATCH] Navbar css

---
 .../main/kotlin/views/components/Navbar.kt    |  8 ++++----
 css/src/navbar.pcss                           | 20 +++++++++++++++++++
 2 files changed, 24 insertions(+), 4 deletions(-)

diff --git a/app/src/main/kotlin/views/components/Navbar.kt b/app/src/main/kotlin/views/components/Navbar.kt
index 0497926..864cf92 100644
--- a/app/src/main/kotlin/views/components/Navbar.kt
+++ b/app/src/main/kotlin/views/components/Navbar.kt
@@ -18,17 +18,17 @@ fun BODY.navbar(jwtPayload: JwtPayload?) {
                     "/settings" to "Settings",
                 )
                 links.forEach { (href, name) ->
-                    li("inline text-gray-100 text-md font-semibold") {
+                    li("txt") {
                         a(href = href) { +name }
                     }
                 }
-                li("inline") {
-                    form(classes = "inline", action = "/logout", method = FormMethod.post) {
+                li {
+                    form(action = "/logout", method = FormMethod.post) {
                         button(type = ButtonType.submit, classes = "btn btn-green") { +"Logout" }
                     }
                 }
             } else {
-                li("inline") {
+                li {
                     a(href = "/login", classes = "btn btn-green") { +"Sign In" }
                 }
             }
diff --git a/css/src/navbar.pcss b/css/src/navbar.pcss
index d975bb6..2c45325 100644
--- a/css/src/navbar.pcss
+++ b/css/src/navbar.pcss
@@ -4,10 +4,30 @@
 
     #home {
         @apply text-2xl text-gray-100 font-bold;
+
+        &:hover {
+            @apply text-blue-300;
+        }
     }
 
     #navigation {
         @apply my-2;
+
+        li {
+            @apply inline;
+
+            form {
+                @apply inline;
+            }
+        }
+
+        .txt {
+            @apply text-gray-100 font-semibold;
+
+            &:hover {
+                @apply underline text-blue-300;
+            }
+        }
     }
 }