ed4becky
ed4becky

Reputation: 1620

How to adjust colors in angular material default themes

My users are complaining that the change in color for md-buttons on focus is too subtle.

What is the right way to make an adjustment to this for the default color palettes?

Append: I am looking on how to adjust the button styling when the button has focus, not looking for how to create my own theme.

Also, I am using Angular-Material 1, NOT 2

Upvotes: 4

Views: 1907

Answers (1)

ed4becky
ed4becky

Reputation: 1620

OK, for anyone else looking for this, I found the answer in angular-material.modules.closure.button and angular-material.modules.js.button

.md-button.md-THEME_NAME-theme.md-primary.md-fab:not([disabled]):hover {
  background-color: '{{primary-600}}'; }
.md-button.md-THEME_NAME-theme.md-primary.md-raised:not([disabled]).md-focused, .md-button.md-THEME_NAME-theme.md-primary.md-fab:not([disabled]).md-focused {
  background-color: '{{primary-600}}'; }

This tells me what I needed, which is that focused buttons get primary-600.

NOW I can customized the theme palletes as recommended in the first comment

Upvotes: 3

Related Questions