@c8y/style
Version:
Styles for Cumulocity IoT applications
73 lines (65 loc) • 1.72 kB
text/less
.badge {
display: inline-flex;
min-width: calc(var(--c8y-unit-base) * 2.25);
min-height: calc(var(--c8y-unit-base) * 2.25);
justify-content: center;
align-items: center;
border-radius: @badge-border-radius;
background-color: @badge-background-default;
color: @badge-color-default;
text-align: center;
white-space: nowrap;
font-weight: @badge-font-weight;
font-size: @badge-font-size;
line-height: @badge-line-height;
box-shadow: inset 0 0 0 1px @gray-50;
padding: 0 0.4em;
&.badge-success {
background-color: @badge-background-success;
color: @badge-color-success;
box-shadow: inset 0 0 0 1px @badge-color-success;
}
&.badge-danger {
background-color: @badge-background-danger;
color: @badge-color-danger;
box-shadow: inset 0 0 0 1px @badge-color-danger;
}
&.badge-warning {
background-color: @badge-background-warning;
color: @badge-color-warning;
box-shadow: inset 0 0 0 1px @badge-color-warning;
}
&.badge-system {
background-color: @badge-background-system;
color: @badge-color-system;
}
&.badge-info {
background-color: @badge-background-info;
box-shadow: inset 0 0 0 1px @badge-color-info;
color: @badge-color-info;
}
// Empty badges collapse automatically (not available in IE8)
&:empty {
display: none;
}
a & {
&:hover,
&:focus {
text-decoration: none;
cursor: pointer;
}
}
.list-group-item.active > &,
.nav-pills > .active > a > & {
box-shadow: 0 0 0 2px @badge-color-focus;
}
.list-group-item > & {
float: right;
}
.list-group-item > & + & {
margin-right: 5px;
}
.nav-pills > li > a > & {
margin-left: 3px;
}
}