84 lines
1.7 KiB
SCSS
84 lines
1.7 KiB
SCSS
|
/* badges */
|
||
|
.badge {
|
||
|
padding: 4px 8px;
|
||
|
text-transform: uppercase;
|
||
|
font-size: $font-size-mini;
|
||
|
line-height: 12px;
|
||
|
background-color: $transparent-bg;
|
||
|
border: $border;
|
||
|
text-decoration: none;
|
||
|
color: $white-color;
|
||
|
margin-bottom: 5px;
|
||
|
|
||
|
&:hover,
|
||
|
&:focus {
|
||
|
text-decoration: none;
|
||
|
}
|
||
|
}
|
||
|
.badge-icon {
|
||
|
padding: 0.4em 0.55em;
|
||
|
i {
|
||
|
font-size: 0.8em;
|
||
|
}
|
||
|
}
|
||
|
.badge-default {
|
||
|
@include badge-color($default-color);
|
||
|
}
|
||
|
.badge-primary {
|
||
|
@include badge-color($primary-color);
|
||
|
}
|
||
|
.badge-info {
|
||
|
@include badge-color($info-color);
|
||
|
}
|
||
|
.badge-success {
|
||
|
@include badge-color($success-color);
|
||
|
}
|
||
|
.badge-warning {
|
||
|
@include badge-color($warning-color);
|
||
|
}
|
||
|
.badge-danger {
|
||
|
@include badge-color($danger-color);
|
||
|
}
|
||
|
.badge-neutral {
|
||
|
@include badge-color($white-color);
|
||
|
color: inherit;
|
||
|
}
|
||
|
.badge-dark {
|
||
|
@include badge-color($black-color);
|
||
|
color: inherit;
|
||
|
}
|
||
|
.badge-primary[href]:focus,
|
||
|
.badge-primary[href]:hover {
|
||
|
@include badge-hover-href($white-color, darken($primary-color, 3%));
|
||
|
}
|
||
|
|
||
|
.badge-warning[href]:focus,
|
||
|
.badge-warning[href]:hover {
|
||
|
@include badge-hover-href($white-color, darken($warning-color, 3%));
|
||
|
}
|
||
|
|
||
|
.badge-info[href]:focus,
|
||
|
.badge-info[href]:hover {
|
||
|
@include badge-hover-href($white-color, darken($info-color, 3%));
|
||
|
}
|
||
|
|
||
|
.badge-danger[href]:focus,
|
||
|
.badge-danger[href]:hover {
|
||
|
@include badge-hover-href($white-color, darken($danger-color, 3%));
|
||
|
}
|
||
|
|
||
|
.badge-success[href]:focus,
|
||
|
.badge-success[href]:hover {
|
||
|
@include badge-hover-href($white-color, darken($success-color, 3%));
|
||
|
}
|
||
|
|
||
|
.badge-default[href]:focus,
|
||
|
.badge-default[href]:hover {
|
||
|
@include badge-hover-href($white-color, darken($default-color, 3%));
|
||
|
}
|
||
|
|
||
|
.badge-dark[href]:focus,
|
||
|
.badge-dark[href]:hover {
|
||
|
@include badge-hover-href($white-color, darken($dark-color, 3%));
|
||
|
}
|