Install:
npm install @next-level-integration/menu
Importing:
import { NliMenuModule } from '@next-level-integration/menu';
Add this to the styles:
.nli-primary {
color: mat-color($primary-color) !important;
}
.nli-accent {
color: mat-color($accent-color) !important;
}
.nli-warn {
color: mat-color($warn-color) !important;
}
.nli-primary-bg {
background-color: mat-color($primary-color) !important;
}
.nli-accent-bg {
background-color: mat-color($accent-color) !important;
}
.nli-warn-bg {
background-color: mat-color($warn-color) !important;
}
.nli-primary-border {
border-color: mat-color($primary-color) !important;
border-top-color: mat-color($primary-color) !important;
border-bottom-color: mat-color($primary-color) !important;
border-left-color: mat-color($primary-color) !important;
border-right-color: mat-color($primary-color) !important;
}
.nli-accent-border {
border-color: mat-color($accent-color) !important;
border-top-color: mat-color($accent-color) !important;
border-bottom-color: mat-color($accent-color) !important;
border-left-color: mat-color($accent-color) !important;
border-right-color: mat-color($accent-color) !important;
}
.nli-warn-border {
border-color: mat-color($warn-color) !important;
border-top-color: mat-color($warn-color) !important;
border-bottom-color: mat-color($warn-color) !important;
border-left-color: mat-color($warn-color) !important;
border-right-color: mat-color($warn-color) !important;
}
Usage
HTML
<nli-menu [firstLineText]="'John Doe'" [secoundLineText]="'Sample User'">
<nli-menu-item [text]="'Hello'" (click)="say('world')"></nli-menu-item>
<nli-menu-item [icon]="'logout'" [text]="'Logout'" (click)="say('You want to logout?')" iconPath="../assets/home/logout.svg"></nli-menu-item>
</nli-menu>
Changelog:
- 1.0.0 Initial version
- 1.0.1 add isEventOnly option menu and menu item that disables highlight and text change on button + css corrections
- 2.0.0 Moved from BrowserModule and BrowserAnimationsModule to CommonModule
- 2.1.0 Added isProcessButton boolean ( makes the button a mat-stroked one )