81 lines
2.1 KiB
Plaintext
81 lines
2.1 KiB
Plaintext
// out: false, sourceMap: false, main: ../style.less
|
|
@import "colors.less";
|
|
@button-height: 48px;
|
|
@button-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.4);
|
|
@button-success-color-from: #1756ad;
|
|
@button-success-color-to: #002680;
|
|
@button-machine-color-from : #657178;
|
|
@button-machine-color-to : #404040;
|
|
button:focus {
|
|
outline: none;
|
|
}
|
|
|
|
button.btn[disabled]{
|
|
border-radius: 2px;
|
|
border-radius: 2px;
|
|
background-color: #dddddd;
|
|
background-image: none;
|
|
box-shadow: none;
|
|
color: @color-warm-grey;
|
|
}
|
|
|
|
button.btn {
|
|
height: @button-height;
|
|
border-radius: 2px;
|
|
margin: 0 8px;
|
|
text-align: center;
|
|
font-size: 18px;
|
|
font-weight: bold;
|
|
box-shadow: @button-shadow;
|
|
padding: 0 20px;
|
|
border: none;
|
|
background-image: linear-gradient(to bottom, @color-white2, @color-silver);
|
|
color: @color-darkish-blue;
|
|
&:active {
|
|
background-image: linear-gradient(to bottom, @color-silver, @color-white2);
|
|
}
|
|
}
|
|
|
|
button.btn.btn-success {
|
|
background-image: linear-gradient(to bottom, @button-success-color-from, @button-success-color-to);
|
|
color: white;
|
|
&:active {
|
|
background-image: linear-gradient(to bottom, @button-success-color-to, @button-success-color-from);
|
|
box-shadow:inset @button-shadow;
|
|
}
|
|
|
|
&:hover {
|
|
background-image: linear-gradient(to bottom, @button-success-color-from, @button-success-color-from);
|
|
}
|
|
}
|
|
|
|
|
|
button.under {
|
|
width: 208px;
|
|
height: 45px;
|
|
object-fit: contain;
|
|
border-radius: 100px;
|
|
background-image: linear-gradient(to bottom, @button-machine-color-from, @button-machine-color-to);
|
|
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.4);
|
|
border: none;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
img {
|
|
max-width: 178px;
|
|
max-height: 45px;
|
|
}
|
|
|
|
&:active, &.pressed {
|
|
background-image: linear-gradient(to bottom, @button-machine-color-to, @button-machine-color-from);
|
|
box-shadow: inset 0 1px 2px 0 rgba(0, 0, 0, 0.4);
|
|
}
|
|
}
|
|
|
|
|
|
button.square {
|
|
// width: @button-height;
|
|
// height: @button-height;
|
|
border-radius: 2px !important; // background-color: #4b4b4b;
|
|
}
|