40 lines
885 B
SCSS
40 lines
885 B
SCSS
@mixin base-button {
|
|
border: none;
|
|
outline: none;
|
|
color: white;
|
|
padding: 10px 24px;
|
|
margin-left: $button-margin-left;
|
|
margin-right: $button-margin-right;
|
|
// Needed because on mobile buttons can get vertical
|
|
margin-top: $button-margin-vertical;
|
|
margin-bottom: $button-margin-vertical;
|
|
text-align: center;
|
|
text-decoration: none;
|
|
display: inline-block;
|
|
font-size: 16px;
|
|
border-radius: $button-radius;
|
|
transition: $material-transition;
|
|
box-shadow: $shadow-small;
|
|
|
|
&:hover {
|
|
box-shadow: $shadow-medium;
|
|
}
|
|
|
|
&:active, &:hover, &::-moz-focus-inner {
|
|
outline: none;
|
|
border: none;
|
|
}
|
|
|
|
&:disabled, &:disabled:hover {
|
|
background-color: #757575;
|
|
}
|
|
}
|
|
|
|
.button-blue {
|
|
@include base-button;
|
|
background-color: #2196f3;
|
|
}
|
|
|
|
.button-blue:hover {
|
|
background-color: #64b5f6;
|
|
} |