done current nav (#55)

PacifistaMC · May 8, 2024 · ea2f60d · ea2f60d
1 parent 89b3e8e
commit ea2f60d
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 4 deletions.
diff --git a/src/app/components/navbar/navbar.component.html b/src/app/components/navbar/navbar.component.html
@@ -9,16 +9,16 @@
         <div class="collapse navbar-collapse" id="navbarNav">
           <ul class="navbar-nav align-items-center">
             <li class="nav-item">
-              <a class="nav-link" href="/shop">Boutique</a>
+              <a class="nav-link {{ currentUrl.startsWith('/shop') ? 'current' : '' }}" href="/shop">Boutique</a>
             </li>
             <li class="nav-item">
-              <a class="nav-link" href="/news">News</a>
+              <a class="nav-link {{ currentUrl.startsWith('/news') ? 'current' : '' }}" href="/news">News</a>
             </li>
             <li class="nav-item">
-              <a class="nav-link" href="/wiki">Wiki</a>
+              <a class="nav-link {{ currentUrl.startsWith('/wiki') ? 'current' : '' }}" href="/wiki">Wiki</a>
             </li>
             <li class="nav-item">
-              <a class="nav-link" href="/vote">Vote</a>
+              <a class="nav-link {{ currentUrl.startsWith('/vote') ? 'current' : '' }}" href="/vote">Vote</a>
             </li>
 
             <a class="nav-link" href="/user" rel="nofollow">

diff --git a/src/app/components/navbar/navbar.component.scss b/src/app/components/navbar/navbar.component.scss
@@ -21,3 +21,7 @@ nav a:hover {
   font-weight: normal;
   color: $secondary_color;
 }
+
+nav .current {
+  color: $main_color;
+}
diff --git a/src/app/components/navbar/navbar.component.ts b/src/app/components/navbar/navbar.component.ts
@@ -1,9 +1,17 @@
 import {Component} from '@angular/core';
+import {PlatformLocation} from "@angular/common";
 
 @Component({
   selector: 'app-navbar',
   templateUrl: './navbar.component.html',
   styleUrls: ['./navbar.component.scss']
 })
 export class NavbarComponent {
+
+  currentUrl: string;
+
+  constructor(platformLocation: PlatformLocation) {
+    this.currentUrl = platformLocation.pathname;
+  }
+
 }