Changing default css in Angular Material for md-input
12,152
You can use this selector to change the input:
md-input-container:not(.md-input-invalid).md-input-focused .md-input {
border-color: red
}
Use this to change the label:
md-input-container:not(.md-input-invalid).md-input-focused label {
color: red
}
Include this after you include the css for angular material.
I got this by going to the docs page here: https://material.angularjs.org/latest/demo/input
Looking at their demo, and inspecting a focused input.
Comments
-
Mad-D almost 2 years
I have implemented form using angualr-material, I can't find any standard ways to change default color coding in material.
form
<div class="col-xs-12 testFormLabel"> <md-input-container class="testLabel"> <label>Reason</label> <input name="reasonBox" id="reasonBox" ng-model="obj. reasonBox" ng-required="true"> </md-input-container> </div>
css
.md-input-has-value. testLabel > input { color:#008cba; }
Problem
How can i change auto focus label name and underline to different color ( let say from dark blue to green )