@mixin btn-outline($color, $color-color){
&:hover,
&:focus{
color: $color-color !important;
background-color: $color;
}
}
.btn{
font-weight: 500;
outline: 0!important;
&:not([disabled]):hover,
&:not([disabled]):focus,
&:not([disabled]).active{
box-shadow: inset 0 -10rem 0px rgba(158, 158, 158, 0.2);
}
> i{
&.pull-left,
&.pull-right{
line-height: 1.5;
}
}
&.rounded{
padding-left: 1.2em;
padding-right: 1.2em;
}
}
.btn-lg{
}
.btn-md{
padding: .4695rem .75rem;
font-size: 0.9rem;
}
.btn-sm{
}
.btn-xs{
padding: .2195rem .5rem;
font-size: 0.8rem;
}
.btn-outline{
border-width: 1px;
background-color: transparent;
box-shadow: none !important;
}
.btn{
&.b-primary,
&.primary{
@include btn-outline($primary, $primary-color);
}
&.b-accent,
&.accent{
@include btn-outline($accent, $accent-color);
}
&.b-warn,
&.warn{
@include btn-outline($warn, $warn-color);
}
&.b-success,
&.success{
@include btn-outline($success, $success-color);
}
&.b-info,
&.info{
@include btn-outline($info, $info-color);
}
&.b-warning,
&.warning{
@include btn-outline($warning, $warning-color);
}
&.b-danger,
&.danger{
@include btn-outline($danger, $danger-color);
}
&.b-dark,
&.dark{
@include btn-outline($dark, $dark-color);
}
&.b-black,
&.black{
@include btn-outline($black, $black-color);
}
&.b-white{
@include btn-outline($white, $dark-black);
}
&.b-light{
@include btn-outline($light, $light-color);
}
}
.btn-icon{
text-align: center;
padding: 0 !important;
width: 2.375rem;
height: 2.375rem;
line-height: 2.375rem;
position: relative;
overflow: hidden;
i{
position: absolute;
top: 0;
width: 100%;
height: 100%;
display:block;
line-height: inherit;
border-radius: inherit;
@include transition(all 0.3s);
}
&.btn-xs{
width: 1.5rem;
height: 1.5rem;
line-height: 1.5rem;
}
&.btn-sm{
width: 1.775rem;
height: 1.775rem;
line-height: 1.775rem;
}
&.btn-lg{
width: 3.167rem;
height: 3.167rem;
line-height: 3.167rem;
}
&.btn-social{
i:last-child{
top: 100%;
}
}
&.btn-social:hover,
&.btn-social:focus,
&.btn-social.active{
i:first-child{
top: -100%;
}
i:last-child{
top: 0;
color: #fff;
}
}
&.btn-social-colored{
i:first-child{
color: #fff;
}
}
}
.btn.white,
.btn.btn-default,
.btn.btn-secondary{
border-color: $border-color;
}
.btn-default{
background-color: #fff;
color: $dark-black;
}
.btn-groups .btn{
margin-bottom: .25rem;
}
.btn-fw{
min-width: 7rem;
}