Merge pull request #66 from morrowind-modding/rework-navbar

Update: Make navbar look cleaner

Author: MasssiveJuice08

Diff for: quartz/components/LinksHeader.tsx

@@ -8,7 +8,7 @@ interface Options {
 export default (() => {
   function LinksHeader() {
     return (
-      <div>
+      <div id="links-header-container">
         <div id="links-header">        
             <a href="/guides/">
               <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-book-open-check"><path d="M8 3H2v15h7c1.7 0 3 1.3 3 3V7c0-2.2-1.8-4-4-4Z"/><path d="m16 12 2 2 4-4"/><path d="M22 6V3h-6c-2.2 0-4 1.8-4 4v14c0-1.7 1.3-3 3-3h7v-2.3"/></svg>
@@ -31,6 +31,7 @@ export default (() => {
               <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-shield-alert"><path d="M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z"/><path d="M12 8v4"/><path d="M12 16h.01"/></svg>
             Contributing</a>
         </div>
+        <hr></hr>
       </div>
     )
   }

Diff for: quartz/components/styles/linksHeader.scss

@@ -13,18 +13,17 @@ header {
     height: 1em;
     margin: 0 0.3em 0 0;
     vertical-align: middle;
-    color: var(--dark);
   }
 
   a {
     display: inline-block;
-    color: var(--dark);
     padding: 10px 15px;
-    background-color: #8f9fa926;
   }  
-  
-  a:hover{
-      background-color: #8f9fa93d;
+}
+
+#links-header-container {
+  hr {
+    margin: 1rem;
   }
 }