Mercurial > wikked

annotate static/bootstrap/less/labels-badges.less @ 74:3c8e07af93c7

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Added FontAwesome icons.
author Ludovic Chabant <ludovic@chabant.com>
date Wed, 27 Feb 2013 22:02:02 -0800
parents 130eccd396d8
children a5a3d454eac9
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
61
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
1 //
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
2 // Labels and badges
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
3 // --------------------------------------------------
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
4
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
5
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
6 // Base classes
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
7 .label,
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
8 .badge {
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
9 display: inline-block;
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
10 padding: 2px 4px;
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
11 font-size: @baseFontSize * .846;
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
12 font-weight: bold;
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
13 line-height: 14px; // ensure proper line-height if floated
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
14 color: @white;
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
15 vertical-align: baseline;
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
16 white-space: nowrap;
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
17 text-shadow: 0 -1px 0 rgba(0,0,0,.25);
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
18 background-color: @grayLight;
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
19 }
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
20 // Set unique padding and border-radii
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
21 .label {
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
22 .border-radius(3px);
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
23 }
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
24 .badge {
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
25 padding-left: 9px;
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
26 padding-right: 9px;
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
27 .border-radius(9px);
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
28 }
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
29
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
30 // Empty labels/badges collapse
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
31 .label,
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
32 .badge {
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
33 &:empty {
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
34 display: none;
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
35 }
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
36 }
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
37
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
38 // Hover state, but only for links
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
39 a {
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
40 &.label:hover,
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
41 &.badge:hover {
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
42 color: @white;
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
43 text-decoration: none;
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
44 cursor: pointer;
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
45 }
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
46 }
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
47
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
48 // Colors
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
49 // Only give background-color difference to links (and to simplify, we don't qualifty with `a` but [href] attribute)
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
50 .label,
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
51 .badge {
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
52 // Important (red)
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
53 &-important { background-color: @errorText; }
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
54 &-important[href] { background-color: darken(@errorText, 10%); }
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
55 // Warnings (orange)
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
56 &-warning { background-color: @orange; }
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
57 &-warning[href] { background-color: darken(@orange, 10%); }
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
58 // Success (green)
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
59 &-success { background-color: @successText; }
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
60 &-success[href] { background-color: darken(@successText, 10%); }
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
61 // Info (turquoise)
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
62 &-info { background-color: @infoText; }
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
63 &-info[href] { background-color: darken(@infoText, 10%); }
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
64 // Inverse (black)
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
65 &-inverse { background-color: @grayDark; }
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
66 &-inverse[href] { background-color: darken(@grayDark, 10%); }
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
67 }
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
68
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
69 // Quick fix for labels/badges in buttons
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
70 .btn {
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
71 .label,
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
72 .badge {
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
73 position: relative;
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
74 top: -1px;
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
75 }
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
76 }
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
77 .btn-mini {
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
78 .label,
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
79 .badge {
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
80 top: 0;
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
81 }
130eccd396d8 Now using Boostrap with LESS.
Ludovic Chabant <ludovic@chabant.com>
parents:
diff changeset
82 }