This commit is contained in:
Max Lynch
2015-07-20 17:44:48 -05:00
parent 1f0015ce12
commit 00b14daee4
2 changed files with 22 additions and 46 deletions

View File

@ -85,6 +85,16 @@ $button-material-border-radius: 3px !default;
background: transparent; background: transparent;
} }
} }
&[clear] {
box-shadow: none;
&:hover, &.hover {
background-color: rgba(158, 158, 158, 0.2);
}
&:active, &.active {
background-color: rgba(158, 158, 158, 0.4);
}
}
} }
} }
} }

View File

@ -1,49 +1,15 @@
<div> <div>
<a button clear href="#">a[button][clear]</a> <button clear primary>Primary</button>
<button clear>button[clear]</button> <button clear secondary>Secondary</button>
<button clear class="hover">hover</button> <button clear danger>Danger</button>
<button clear class="activated">activated</button> <button clear light>Light</button>
<button clear stable>Stable</button>
<button clear dark>Dark</button>
</div> </div>
<div> <style>
<a button clear primary href="#">a.primary</a> button, [button] {
<button clear primary>button.primary</button> display: block !important;
<button clear primary class="hover">hover</button> margin: 10px auto 10px auto !important;
<button clear primary class="activated">activated</button> }
</div> </style>
<div>
<a button clear secondary href="#">a.secondary</a>
<button clear secondary>button.secondary</button>
<button clear secondary class="hover">hover</button>
<button clear secondary class="activated">activated</button>
</div>
<div>
<a button clear danger href="#">a.danger</a>
<button clear danger>button.danger</button>
<button clear danger class="hover">hover</button>
<button clear danger class="activated">activated</button>
</div>
<div>
<a button clear light href="#">a.light</a>
<button clear light>button.light</button>
<button clear light class="hover">hover</button>
<button clear light class="activated">activated</button>
</div>
<div>
<a button clear stable href="#">a.stable</a>
<button clear stable>button.stable</button>
<button clear stable class="hover">hover</button>
<button clear stable class="activated">activated</button>
</div>
<div>
<a button clear dark href="#">a.dark</a>
<button clear dark>button.dark</button>
<button clear dark class="hover">hover</button>
<button clear dark class="activated">activated</button>
</div>