Merge pull request #469 from google/issue-466
Fix primary/accent colored flat buttons (fixes #466)master
commit
e7018fa803
|
@ -50,6 +50,11 @@ categories:
|
||||||
file: flat-ripple.html
|
file: flat-ripple.html
|
||||||
- caption: Disabled
|
- caption: Disabled
|
||||||
file: flat-disabled.html
|
file: flat-disabled.html
|
||||||
|
- snippet_group:
|
||||||
|
- caption: Primary colored flat
|
||||||
|
file: flat-primary.html
|
||||||
|
- caption: Accent colored flat
|
||||||
|
file: flat-accent.html
|
||||||
- name: cards
|
- name: cards
|
||||||
title: Cards
|
title: Cards
|
||||||
description: Self-contained pieces of paper with data.
|
description: Self-contained pieces of paper with data.
|
||||||
|
|
|
@ -256,17 +256,23 @@
|
||||||
// Colorized buttons
|
// Colorized buttons
|
||||||
|
|
||||||
.mdl-button--primary.mdl-button--primary {
|
.mdl-button--primary.mdl-button--primary {
|
||||||
background-color: $button-primary-color-alt;
|
color: $button-primary-color-alt;
|
||||||
color: $button-secondary-color-alt;
|
|
||||||
& .mdl-ripple {
|
& .mdl-ripple {
|
||||||
background: $button-secondary-color-alt;
|
background: $button-secondary-color-alt;
|
||||||
}
|
}
|
||||||
|
&.mdl-button--raised {
|
||||||
|
color: $button-secondary-color-alt;
|
||||||
|
background-color: $button-primary-color-alt;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.mdl-button--accent.mdl-button--accent {
|
.mdl-button--accent.mdl-button--accent {
|
||||||
background-color: $button-fab-color-alt;
|
color: $button-fab-color-alt;
|
||||||
color: $button-fab-text-color-alt;
|
|
||||||
& .mdl-ripple {
|
& .mdl-ripple {
|
||||||
background: $button-fab-text-color-alt;
|
background: $button-fab-text-color-alt;
|
||||||
}
|
}
|
||||||
|
&.mdl-button--raised {
|
||||||
|
color: $button-fab-text-color-alt;
|
||||||
|
background-color: $button-fab-color-alt;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -0,0 +1,4 @@
|
||||||
|
<!-- Accent-colored flat button -->
|
||||||
|
<button class="mdl-button mdl-js-button mdl-button--accent">
|
||||||
|
Button
|
||||||
|
</button>
|
|
@ -0,0 +1,4 @@
|
||||||
|
<!-- Primary-colored flat button -->
|
||||||
|
<button class="mdl-button mdl-js-button mdl-button--primary">
|
||||||
|
Button
|
||||||
|
</button>
|
Loading…
Reference in New Issue