Improving sidebar

This commit is contained in:
2023-02-11 19:03:48 +01:00
parent ebc3835ad4
commit 2b6611c9a0
2 changed files with 12 additions and 9 deletions

View File

@@ -1,10 +1,10 @@
<div class="align-items-center align-items-sm-start px-3 pt-2 text-white min-vh-100 text-nowrap"> <div class="pt-2 text-white min-vh-100 text-nowrap">
<a href="/" class="d-flex align-items-center pb-3 mb-md-0 me-md-auto text-white text-decoration-none"> <a routerLink="/" class="d-flex align-items-center pb-3 mb-md-0 me-md-auto text-white text-decoration-none">
<span class="fs-5 d-none d-sm-inline">Cooper, Hillman &<br/>Toshi LLP</span> <span class="fs-5 d-none d-sm-inline">Cooper, Hillman &<br/>Toshi LLP</span>
</a> </a>
<ul class="nav nav-pills flex-column align-items-sm-start mb-sm-auto mb-0 align-items-center" id="menu"> <ul class="nav nav-pills flex-column align-items-sm-start mb-sm-auto mb-0 w-100" id="menu">
<li *ngFor="let item of Menu" class="nav-item"> <li *ngFor="let item of Menu" class="nav-item w-100">
<a href="{{item.link}}" class="nav-link align-middle px-0"> <a class="nav-link px-3 w-100" routerLink="{{item.link}}" [class.active]="is_current_page(item)">
<i-bs [name]="item.icon"></i-bs><span class="ms-1 d-none d-sm-inline" [innerHTML]="item.title"></span> <i-bs [name]="item.icon"></i-bs><span class="ms-1 d-none d-sm-inline" [innerHTML]="item.title"></span>
</a> </a>
</li> </li>

View File

@@ -1,9 +1,7 @@
import { Component } from "@angular/core"; import { Component } from "@angular/core";
import { Router } from '@angular/router';
import { IconNamesEnum } from "ngx-bootstrap-icons"; import { IconNamesEnum } from "ngx-bootstrap-icons";
@Component({ @Component({
selector: "sidenav", selector: "sidenav",
templateUrl: "./sidenav.component.html", templateUrl: "./sidenav.component.html",
@@ -37,5 +35,10 @@ export class SidenavComponent {
icon: IconNamesEnum.PencilSquare icon: IconNamesEnum.PencilSquare
}, },
] ]
}
constructor(private router: Router) {}
is_current_page(menu_item: any) {
return this.router.url.indexOf(menu_item.link) > -1;
}
}