Design some buttons in header.
This commit is contained in:
@@ -17,10 +17,10 @@
|
||||
</div>
|
||||
<div>
|
||||
<ng-container *ngIf="isAuthenticated; else anonymousRightMenu">
|
||||
<a [routerLink]="['/disconnect']">Disconnect</a>
|
||||
<a [routerLink]="['/disconnect']" matRipple>Disconnect</a>
|
||||
</ng-container>
|
||||
<ng-template #anonymousRightMenu>
|
||||
<a [routerLink]="['/login']">Login</a>
|
||||
<a [routerLink]="['/login']" matRipple>Login</a>
|
||||
</ng-template>
|
||||
</div>
|
||||
<app-side-menu #sideMenu></app-side-menu>
|
||||
@@ -149,7 +149,16 @@ $headerHeight: 3.5em;
|
||||
align-items: center;
|
||||
min-width: 5em;
|
||||
color: white;
|
||||
margin: 0 .5em;
|
||||
margin: 0.5em 0.5em;
|
||||
border-radius: 10em;
|
||||
text-decoration: none;
|
||||
padding: 0 .8em;
|
||||
background-color: #3f51b5;
|
||||
transition: background-color .2s ease-in-out;
|
||||
|
||||
&:hover {
|
||||
background-color: #5c6bc0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -5,11 +5,12 @@ import { RouterModule } from '@angular/router';
|
||||
import { AuthenticationService } from '../../core/service/authentication.service';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { SideMenuComponent } from '../side-menu/side-menu.component';
|
||||
import { MatRippleModule } from '@angular/material/core';
|
||||
|
||||
@Component({
|
||||
selector: 'app-header',
|
||||
standalone: true,
|
||||
imports: [CommonModule, MatButtonModule, MatIconModule, RouterModule, SideMenuComponent],
|
||||
imports: [CommonModule, MatButtonModule, MatIconModule, RouterModule, SideMenuComponent, MatRippleModule],
|
||||
templateUrl: './header.component.html',
|
||||
styleUrl: './header.component.scss',
|
||||
})
|
||||
|
||||
Reference in New Issue
Block a user