mirror of
https://github.com/twbs/bootstrap.git
synced 2025-08-28 23:59:53 +02:00
Bring back the label, make it scale somewhat with the font-size of the parent using percentages and ems
This commit is contained in:
1
less/bootstrap.less
vendored
1
less/bootstrap.less
vendored
@@ -49,6 +49,7 @@
|
||||
@import "alerts.less";
|
||||
@import "thumbnails.less";
|
||||
@import "media.less";
|
||||
@import "labels.less";
|
||||
@import "badges.less";
|
||||
@import "progress-bars.less";
|
||||
@import "accordion.less";
|
||||
|
46
less/labels.less
Normal file
46
less/labels.less
Normal file
@@ -0,0 +1,46 @@
|
||||
//
|
||||
// Labels
|
||||
// --------------------------------------------------
|
||||
|
||||
|
||||
// Base classes
|
||||
.label {
|
||||
padding: .25em .6em;
|
||||
font-size: 75%;
|
||||
font-weight: 500;
|
||||
color: #fff;
|
||||
line-height: 1;
|
||||
vertical-align: middle;
|
||||
white-space: nowrap;
|
||||
text-align: center;
|
||||
background-color: @grayLight;
|
||||
border-radius: .25em;
|
||||
}
|
||||
|
||||
// Hover state, but only for links
|
||||
a.label {
|
||||
&:hover,
|
||||
&:focus {
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
// Colors
|
||||
// Only give background-color difference to links (and to simplify, we don't qualifty with `a` but [href] attribute)
|
||||
.label {
|
||||
// Danger (red)
|
||||
&-danger { background-color: @label-danger-background; }
|
||||
&-danger[href] { background-color: darken(@label-danger-background, 10%); }
|
||||
// Warnings (orange)
|
||||
&-warning { background-color: @label-warning-background; }
|
||||
&-warning[href] { background-color: darken(@label-warning-background, 10%); }
|
||||
// Success (green)
|
||||
&-success { background-color: @label-success-background; }
|
||||
&-success[href] { background-color: darken(@label-success-background, 10%); }
|
||||
// Info (turquoise)
|
||||
&-info { background-color: @label-info-background; }
|
||||
&-info[href] { background-color: darken(@label-info-background, 10%); }
|
||||
}
|
||||
|
@@ -271,6 +271,14 @@
|
||||
@popover-arrow-outer-color: rgba(0,0,0,.25);
|
||||
|
||||
|
||||
// Labels
|
||||
// -------------------------
|
||||
@label-success-background: @brand-success;
|
||||
@label-info-background: @brand-info;
|
||||
@label-warning-background: @brand-warning;
|
||||
@label-danger-background: @brand-danger;
|
||||
|
||||
|
||||
// Modals
|
||||
// -------------------------
|
||||
|
||||
|
Reference in New Issue
Block a user