src/features/nav/components/Navbar.vue

@@ -1,7 +1,33 @@
 <template>
     <nav class="global-nav">
         <span id="logo">Seekra</span>
-        <ul>
+        <ul class="right-links">
         </ul>
     </nav>
 </template>
+
+<style scoped>
+.global-nav {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 10px 40px;
+}
+
+.global-nav .right-links {
+    display: flex;
+    gap: 30px;
+    list-style: none;
+    margin: 0;
+    padding: 0;
+}
+
+.global-nav .right-links a {
+    text-decoration: none;
+    color: #000;
+}
+
+.global-nav .right-links a:hover{
+    text-decoration: underline;
+}
+</style>

src/styles/nav/navbar/navbar.css

@@ -1,40 +0,0 @@
-.global-nav {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    padding: 10px 40px;
-}
-
-.global-nav ul {
-    display: flex;
-    gap: 20px;
-    list-style: none;
-    margin: 0;
-    padding: 0;
-}
-
-.global-nav ul a{
-    text-decoration: none;
-    color: black;
-}
-
-.global-nav ul a:hover{
-     text-decoration: underline;
-}
-
-.global-nav ul {
-    display: flex;
-    list-style: none;
-    margin: 0;
-    padding: 0;
-    gap: 30px;
-}
-
-.nav-item a {
-    text-decoration: none;
-    color: black;
-}
-
-.nav-item a:hover {
-    text-decoration: underline;
-}