search

expandjs / mat-elements

A collection of Material Design web components from the expand.js team
https://expandjs.com/components
BSD 3-Clause "New" or "Revised" License
15 stars 2 forks source link

Custom Highlight Colours #2

Closed interface-master closed 8 years ago

interface-master commented 8 years ago

I am unable to change the highlight colour of mat-text-field - the text and underline that come up are always blue - no matter how I try to change it through CSS or attribute tags. Is there something I'm missing?

Pupix commented 8 years ago

Hello!

Currently the only way to change the highlight color is by using ::shadow selectors. An update will come in the following days implementing CSS variables which will let you overwrite the default colors without the need to use shadow piercing selectors.

Cheers.

interface-master commented 8 years ago

Cool. Thanks for the prompt reply. Is there documentation on how to do that, or do I just need to poke around until it works?

On Nov 23, 2015, at 11:12 AM, Robert Manolea notifications@github.com wrote:

Hello!

Currently the only way to change the highlight color is by using ::shadow selectors. An update will come in the following days implementing CSS variables which will let you overwrite the default colors without the need to use shadow piercing selectors.

Cheers.

— Reply to this email directly or view it on GitHub.

Pupix commented 8 years ago

If you don't want to poke around you can check out this example where you can find a mat-text-field with a white highlight color by clicking on the search icon. In the source code the mat-text-field is on line 187 and its style is on line 65.

interface-master commented 8 years ago

You're amazing. Thank you!! :-)

On Nov 23, 2015, at 11:24 AM, Robert Manolea notifications@github.com wrote:

If you don't want to poke around you can check out this example where you can find a mat-text-field with a white highlight color by clicking on the search icon. In the source code) the mat-text-field is on line 187 and its style is on line 65.

— Reply to this email directly or view it on GitHub.

Pupix commented 8 years ago

With the latest release we've added the CSS variable --mat-focused-color on all inputs. As the name suggests, when an input is focused the color from the variable will be applied, if the variable is not defined a default color will be applied.

interface-master commented 8 years ago

Perfect. Thanks again!

On Dec 17, 2015, at 5:37 AM, Robert Manolea notifications@github.com wrote:

With the latest release we've added the CSS variable --mat-focused-color on all inputs. As the name suggests, when an input is focused the color from the variable will be applied, if the variable is not defined a default color will be applied.

— Reply to this email directly or view it on GitHub.