Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feature Request: Add secondary themed button #2200

Closed
jfily opened this issue Feb 6, 2018 · 1 comment
Closed

Feature Request: Add secondary themed button #2200

jfily opened this issue Feb 6, 2018 · 1 comment

Comments

@jfily
Copy link

jfily commented Feb 6, 2018

Could you, please, add secondary themed buttons like in https://material-components-web.appspot.com/button.html ?

image

Thank you

@kfranqueiro
Copy link
Contributor

Buttons are intentionally styled with the primary color by default. We expose Sass mixins to allow easily customizing styles for specific buttons, and the primary and secondary colors are stored in variables initially defined in the mdc-theme package.

Here's the demo SCSS responsible for styling buttons with the secondary-text-button class (with styles for flat, raised/unelevated, and stroked variants):

.mdc-button.secondary-text-button {
@include mdc-button-ink-color($mdc-theme-secondary);
@include mdc-states(secondary);
}
.mdc-button.secondary-filled-button {
@include mdc-button-filled-accessible($mdc-theme-secondary);
}
.mdc-button.secondary-stroked-button {
@include mdc-button-ink-color($mdc-theme-secondary);
@include mdc-button-stroke-color($mdc-theme-secondary);
}

If you need to see what these equate to in CSS, the button mixins are defined in https://github.com/material-components/material-components-web/blob/master/packages/mdc-button/_mixins.scss

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants