Make navbar dropdown

styles/sass/style.scss

@@ -42,7 +42,25 @@ body {
 
     display: flex;
 
-    & > * {
+    .dropdown {
+      position: relative;
+      display: flex;
+      padding: 0;
+
+      .dropdown-content {
+        flex-direction: column;
+        position: absolute;
+        top: 100%;
+        left: 0;
+        width: 100%;
+      }
+
+      &:not(:hover) .dropdown-content {
+        display: none !important;
+      }
+    }
+
+    & > *, .dropdown > a {
       padding: 0.45em;
 
       & > * {
@@ -50,17 +68,9 @@ body {
       }
     }
 
-    & > a {
+    a {
       color: var(--fg);
       font-weight: bold;
-
-      &:hover {
-        border: none;
-        --fg: #{$fg};
-        --bg: #{$bg};
-        background: var(--bg);
-        cursor: pointer;
-      }
     }
 
     & > .right {
@@ -74,6 +84,14 @@ body {
   }
 }
 
+.dropdown:hover > a, nav > a:hover {
+  border: none;
+  --fg: #{$fg};
+  --bg: #{$bg};
+  background: var(--bg);
+  cursor: pointer;
+}
+
 .svg-inline {
   height: 1em;
   vertical-align: -0.125em;