Changing css default value in Angular Material for md I / O

Question

I implemented a form using angualr material, I can’t find standard ways to change the standard color coding in the 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 the name of the AF focus mark and underline for a different color (say, from blue to green)

Answer 1

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 enabling css for angular stuff.

I got this by going to the docs page here: https://material.angularjs.org/latest/demo/input

.

Answer 2

<md-input-container [dividerColor]="primary|accent|warn"> , .

...

( ) , dividerColor md-input-container. primary . , .