102 lines
2.2 KiB
SCSS
102 lines
2.2 KiB
SCSS
@import "variables";
|
|
|
|
.btn-custom-primary {
|
|
background-color: $btn-primary-color;
|
|
border-color: $btn-primary-color;
|
|
color: $btn-primary-font-color;
|
|
font-size: 14px;
|
|
|
|
&:hover,
|
|
&:focus,
|
|
&:active,
|
|
&:active {
|
|
background-color: $btn-primary-color-hover;
|
|
border-color: $btn-primary-color-hover;
|
|
box-shadow: none;
|
|
}
|
|
|
|
// &:focus {
|
|
// background-color: $btn-primary-color-hover;
|
|
// border-color: $btn-primary-color-hover;
|
|
// outline: none;
|
|
// }
|
|
// &:active {
|
|
// background-color: $btn-primary-color-hover;
|
|
// border-color: $btn-primary-color-hover;
|
|
// outline: none;
|
|
// }
|
|
// &:active:focus {
|
|
// background-color: $btn-primary-color-hover;
|
|
// border-color: $btn-primary-color-hover;
|
|
// outline: none;
|
|
// }
|
|
// &:visited {
|
|
// outline: none;
|
|
// }
|
|
}
|
|
|
|
.btn-custom-secondary {
|
|
border: none;
|
|
outline: none;
|
|
cursor: pointer;
|
|
background-color: $button-background-color;
|
|
color: $button-color;
|
|
transition: all .2s;
|
|
|
|
&:hover {
|
|
background-color: $button-background-color-hover;
|
|
color: $button-color-hover;
|
|
}
|
|
}
|
|
|
|
.sengi-btn {
|
|
transition: all .2s;
|
|
text-decoration: none;
|
|
display: block; // width: calc(100% - 20px);
|
|
width: calc(100% - 15px); // height: 30px;
|
|
padding: 5px 10px; // border: solid 1px black;
|
|
margin-left: 5px;
|
|
|
|
&--icon {
|
|
float: right;
|
|
}
|
|
|
|
&--disabled {
|
|
cursor: default;
|
|
background-color: var(--color-primary-darker-4);
|
|
|
|
&:hover {
|
|
background-color: var(--color-primary-darker-4);
|
|
}
|
|
}
|
|
|
|
&--margin-bottom {
|
|
&:not(:last-child) {
|
|
margin-bottom: 5px;
|
|
}
|
|
}
|
|
|
|
&__blue {
|
|
background-color: var(--color-primary);
|
|
color: #fff;
|
|
|
|
&:hover {
|
|
background-color: var(--color-primary-lighter-15);
|
|
}
|
|
}
|
|
|
|
&__red {
|
|
$red-button-color: rgb(65, 3, 3);
|
|
background-color: $red-button-color !important;
|
|
color: #fff;
|
|
|
|
&:hover {
|
|
background-color: lighten($red-button-color, 15) !important;
|
|
}
|
|
}
|
|
|
|
&__medium {
|
|
float: left;
|
|
width: calc((100% - 15px)/2 - 5px);
|
|
}
|
|
} |