Angular Material Form Example Swalne


Example 1: angular material input

Html 
Favorite food Leave a comment
TS import {Component} from '@angular/core'; /** * @title Basic Inputs */ @Component({ selector: 'input-overview-example', styleUrls: ['input-overview-example.css'], templateUrl: 'input-overview-example.html', }) export class InputOverviewExample {} CSS .example-form { min-width: 150px; max-width: 500px; width: 100%; } .example-full-width { width: 100%; }

Example 2: stylin mat input

//Standard   .mat-form-field {     .mat-input-element {       color: slategray;     }     .mat-form-field-label {       color: slategray;     }     .mat-form-field-underline {       background-color: slategray;     }     .mat-form-field-ripple {       background-color: slategray;     }     .mat-form-field-required-marker {       color: slategray;     }   }    //Focus   .mat-form-field.mat-focused {     .mat-form-field-label {       color: #ff884d;     }     .mat-form-field-ripple {       background-color: #ff884d;     }     .mat-form-field-required-marker {       color: #ff884d;     }     .mat-input-element {       color: #ff884d;     }   }    //Error   .mat-form-field.mat-form-field-invalid {     .mat-input-element {       color: #ff33cc;     }     .mat-form-field-label {       color: #ff33cc;       .mat-form-field-required-marker {         color: #ff33cc;       }     }     .mat-form-field-ripple {       background-color: #ff33cc;     }   }

Comments

Popular posts from this blog

Converting A String To Int In Groovy

"Cannot Create Cache Directory /home//.composer/cache/repo/https---packagist.org/, Or Directory Is Not Writable. Proceeding Without Cache"

Android How Can I Convert A String To A Editable