worker-pastebin/src/web/styles/buttons.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;
}