Category: Angular-Material
Angular Material – #4 – Tool Bar
import matToolbarModule <mat-toolbar class = “navbar”>… </mat-toolbar> // this is flexbox
Angular Material – #3 – Icon & Badge
import MatIconModule, import MatBadgeModule For Icon: https://material.io/resources/icons/?icon=alarm_on&style=baseline <mat-icon color = “primary | warn | accent”> icon code here </mat-icon> For Badge matBadge: show what badge is matBadgePosition: show where the badge locates, such as: below | above & before | after matBadgeSize: small | medium | large matBadgeOverlap: true(default) | false matBadgeColor matBadgeHidden
Angular Material – #2 – Button
import MatButtonModule Attribute for button appearance: mat-button: <button mat-button>…</button> mat-raised-button mat-fat-button mat-stroked-button mat-icon-button mat-fab mat-mini-fab Color Attribute for button color = “primary”: <button color = “primary” mat-button>…</button> color = “accent” color = “warn” disable ripple effect using disableRipple: <button color = “primary” mat-button disableRipple>…</button>
Angular Material – #1 – Typography
class = “mat-display-1” class = “mat-display-2” class = “mat-display-3” class = “mat-display-4” class = “mat-headling” // this is a heading for h1 class = “mat-title” // this is a heading for h2 class = “mat-subheading-2” // this is a heading for h3 class = “mat-subheading-1” // this is a heading for h4 class = “mat-body-1”