3.0.2 -> 3.0.3
[bootswatch] / bower_components / bootstrap / less / type.less
1 //
2 // Typography
3 // --------------------------------------------------
4
5
6 // Headings
7 // -------------------------
8
9 h1, h2, h3, h4, h5, h6,
10 .h1, .h2, .h3, .h4, .h5, .h6 {
11   font-family: @headings-font-family;
12   font-weight: @headings-font-weight;
13   line-height: @headings-line-height;
14   color: @headings-color;
15
16   small,
17   .small {
18     font-weight: normal;
19     line-height: 1;
20     color: @headings-small-color;
21   }
22 }
23
24 h1,
25 h2,
26 h3 {
27   margin-top: @line-height-computed;
28   margin-bottom: (@line-height-computed / 2);
29
30   small,
31   .small {
32     font-size: 65%;
33   }
34 }
35 h4,
36 h5,
37 h6 {
38   margin-top: (@line-height-computed / 2);
39   margin-bottom: (@line-height-computed / 2);
40
41   small,
42   .small {
43     font-size: 75%;
44   }
45 }
46
47 h1, .h1 { font-size: @font-size-h1; }
48 h2, .h2 { font-size: @font-size-h2; }
49 h3, .h3 { font-size: @font-size-h3; }
50 h4, .h4 { font-size: @font-size-h4; }
51 h5, .h5 { font-size: @font-size-h5; }
52 h6, .h6 { font-size: @font-size-h6; }
53
54
55 // Body text
56 // -------------------------
57
58 p {
59   margin: 0 0 (@line-height-computed / 2);
60 }
61
62 .lead {
63   margin-bottom: @line-height-computed;
64   font-size: floor(@font-size-base * 1.15);
65   font-weight: 200;
66   line-height: 1.4;
67
68   @media (min-width: @screen-sm-min) {
69     font-size: (@font-size-base * 1.5);
70   }
71 }
72
73
74 // Emphasis & misc
75 // -------------------------
76
77 // Ex: 14px base font * 85% = about 12px
78 small,
79 .small  { font-size: 85%; }
80
81 // Undo browser default styling
82 cite    { font-style: normal; }
83
84 // Contextual emphasis
85 .text-muted {
86   color: @text-muted;
87 }
88 .text-primary {
89   color: @brand-primary;
90   &:hover {
91     color: darken(@brand-primary, 10%);
92   }
93 }
94 .text-warning {
95   color: @state-warning-text;
96   &:hover {
97     color: darken(@state-warning-text, 10%);
98   }
99 }
100 .text-danger {
101   color: @state-danger-text;
102   &:hover {
103     color: darken(@state-danger-text, 10%);
104   }
105 }
106 .text-success {
107   color: @state-success-text;
108   &:hover {
109     color: darken(@state-success-text, 10%);
110   }
111 }
112 .text-info {
113   color: @state-info-text;
114   &:hover {
115     color: darken(@state-info-text, 10%);
116   }
117 }
118
119 // Alignment
120 .text-left           { text-align: left; }
121 .text-right          { text-align: right; }
122 .text-center         { text-align: center; }
123
124
125 // Page header
126 // -------------------------
127
128 .page-header {
129   padding-bottom: ((@line-height-computed / 2) - 1);
130   margin: (@line-height-computed * 2) 0 @line-height-computed;
131   border-bottom: 1px solid @page-header-border-color;
132 }
133
134
135 // Lists
136 // --------------------------------------------------
137
138 // Unordered and Ordered lists
139 ul,
140 ol {
141   margin-top: 0;
142   margin-bottom: (@line-height-computed / 2);
143   ul,
144   ol {
145     margin-bottom: 0;
146   }
147 }
148
149 // List options
150
151 // Unstyled keeps list items block level, just removes default browser padding and list-style
152 .list-unstyled {
153   padding-left: 0;
154   list-style: none;
155 }
156
157 // Inline turns list items into inline-block
158 .list-inline {
159   .list-unstyled();
160
161   > li {
162     display: inline-block;
163     padding-left: 5px;
164     padding-right: 5px;
165
166     &:first-child {
167       padding-left: 0;
168     }
169   }
170 }
171
172 // Description Lists
173 dl {
174   margin-top: 0; // Remove browser default
175   margin-bottom: @line-height-computed;
176 }
177 dt,
178 dd {
179   line-height: @line-height-base;
180 }
181 dt {
182   font-weight: bold;
183 }
184 dd {
185   margin-left: 0; // Undo browser default
186 }
187
188 // Horizontal description lists
189 //
190 // Defaults to being stacked without any of the below styles applied, until the
191 // grid breakpoint is reached (default of ~768px).
192
193 @media (min-width: @grid-float-breakpoint) {
194   .dl-horizontal {
195     dt {
196       float: left;
197       width: (@component-offset-horizontal - 20);
198       clear: left;
199       text-align: right;
200       .text-overflow();
201     }
202     dd {
203       margin-left: @component-offset-horizontal;
204       .clearfix(); // Clear the floated `dt` if an empty `dd` is present
205     }
206   }
207 }
208
209 // MISC
210 // ----
211
212 // Abbreviations and acronyms
213 abbr[title],
214 // Add data-* attribute to help out our tooltip plugin, per https://github.com/twbs/bootstrap/issues/5257
215 abbr[data-original-title] {
216   cursor: help;
217   border-bottom: 1px dotted @abbr-border-color;
218 }
219 .initialism {
220   font-size: 90%;
221   text-transform: uppercase;
222 }
223
224 // Blockquotes
225 blockquote {
226   padding: (@line-height-computed / 2) @line-height-computed;
227   margin: 0 0 @line-height-computed;
228   border-left: 5px solid @blockquote-border-color;
229   p {
230     font-size: (@font-size-base * 1.25);
231     font-weight: 300;
232     line-height: 1.25;
233   }
234   p:last-child {
235     margin-bottom: 0;
236   }
237   small,
238   .small {
239     display: block;
240     line-height: @line-height-base;
241     color: @blockquote-small-color;
242     &:before {
243       content: '\2014 \00A0'; // EM DASH, NBSP
244     }
245   }
246
247   // Float right with text-align: right
248   &.pull-right {
249     padding-right: 15px;
250     padding-left: 0;
251     border-right: 5px solid @blockquote-border-color;
252     border-left: 0;
253     p,
254     small,
255     .small {
256       text-align: right;
257     }
258     small,
259     .small {
260       &:before {
261         content: '';
262       }
263       &:after {
264         content: '\00A0 \2014'; // NBSP, EM DASH
265       }
266     }
267   }
268 }
269
270 // Quotes
271 blockquote:before,
272 blockquote:after {
273   content: "";
274 }
275
276 // Addresses
277 address {
278   margin-bottom: @line-height-computed;
279   font-style: normal;
280   line-height: @line-height-base;
281 }