Files
hustoj/web/bsadmin/assets/sass/button.scss
2024-10-10 12:56:56 +08:00

165 lines
2.9 KiB
SCSS

@import "variable"; // variable
.btn-default{
background: $default;
border-color: $default;
color: $white;
&:hover,&:focus,&.active{
background: darken($default,10%);
border-color: $default;
color: $white;
box-shadow: none;
}
}
.btn-primary {
background: $primary;
border-color: $primary;
color: $white;
&:hover,
&:focus,
&.active {
background: darken($primary, 10%);
border-color: $primary;
color: $white;
box-shadow: none;
}
}
.btn-success {
background: $success;
border-color: $success;
color: $white;
&:hover,
&:focus,
&.active {
background: darken($success, 10%);
border-color: $success;
color: $white;
box-shadow: none;
}
}
.btn-info {
background: $info;
border-color: $info;
color: $white;
&:hover,
&:focus,
&.active {
background: darken($info, 10%);
border-color: $info;
color: $white;
box-shadow: none;
}
}
.btn-warning {
background: $warning;
border-color: $warning;
color: $white;
&:hover,
&:focus,
&.active {
background: darken($warning, 10%);
border-color: $warning;
color: $white;
box-shadow: none;
}
}
.btn-danger {
background: $danger;
border-color: $danger;
color: $white;
&:hover,
&:focus,
&.active {
background: darken($danger, 10%);
border-color: $danger;
color: $white;
box-shadow: none;
}
}
.btn-pink {
background: $pink;
border-color: $pink;
color: $white;
&:hover,
&:focus,
&.active {
background: darken($pink, 10%);
border-color: $pink;
color: $white;
box-shadow: none;
}
}
.btn-dark {
background: $dark;
border-color: $dark;
color: $white;
&:hover,
&:focus,
&.active {
background: darken($dark, 10%);
border-color: $dark;
color: $white;
box-shadow: none;
}
}
.btn-addon {
position: relative;
padding-left: 40px;
i {
background: rgba(0, 0, 0, 0.1);
left: -1px;
margin-right: 20px;
padding: 10px;
position: absolute;
top: -1px;
}
}
.btn-addon.btn-lg {
padding-left: 60px;
i {
padding: 14px;
}
}
.btn-addon.btn-md {
padding-left: 45px;
i {
padding: 10px;
}
}
.btn-addon.btn-sm {
padding-left: 40px;
i {
padding: 9px;
}
}
.btn-addon.btn-xs {
padding-left: 25px;
i {
// font-size: 8px;
padding: 5px;
}
}
.btn-rounded {
border-radius: 100px;
}
.btn-outline {
background: transparent;
color: $text;
}
.btn-flat {
border-radius: 0px;
}