variables.less 25.9 KB
Newer Older
Thomas Park's avatar
Thomas Park committed
1
// Yeti 3.3.0
Thomas Park's avatar
Thomas Park committed
2
3
4
5
// Variables
// --------------------------------------------------


Thomas Park's avatar
Thomas Park committed
6
7
8
//== Colors
//
//## Gray and brand colors for use across Bootstrap.
Thomas Park's avatar
Thomas Park committed
9

Thomas Park's avatar
Thomas Park committed
10
@gray-base:              #000;
11
12
@gray-darker:            lighten(@gray-base, 13.5%); // #222
@gray-dark:              lighten(@gray-base, 20%);   // #333
Thomas Park's avatar
Thomas Park committed
13
@gray:                   #6f6f6f; // #555
14
15
@gray-light:             lighten(@gray-base, 60%);   // #999
@gray-lighter:           lighten(@gray-base, 93.5%); // #eee
Thomas Park's avatar
Thomas Park committed
16
17
18

@brand-primary:         #008cba;
@brand-success:         #43ac6a;
Thomas Park's avatar
Thomas Park committed
19
@brand-info:            #5bc0de;
Thomas Park's avatar
Thomas Park committed
20
21
22
23
@brand-warning:         #E99002;
@brand-danger:          #F04124;


Thomas Park's avatar
Thomas Park committed
24
25
//== Scaffolding
//
Thomas Park's avatar
Thomas Park committed
26
//## Settings for some of the most global styles.
Thomas Park's avatar
Thomas Park committed
27
28

//** Background color for `<body>`.
Thomas Park's avatar
Thomas Park committed
29
@body-bg:               #fff;
Thomas Park's avatar
Thomas Park committed
30
//** Global text color on `<body>`.
Thomas Park's avatar
Thomas Park committed
31
32
@text-color:            @gray-darker;

Thomas Park's avatar
Thomas Park committed
33
//** Global textual link color.
Thomas Park's avatar
Thomas Park committed
34
@link-color:            @brand-primary;
Thomas Park's avatar
Thomas Park committed
35
//** Link hover color set via `darken()` function.
Thomas Park's avatar
Thomas Park committed
36
@link-hover-color:      darken(@link-color, 15%);
Thomas Park's avatar
Thomas Park committed
37
38
//** Link hover decoration.
@link-hover-decoration: underline;
Thomas Park's avatar
Thomas Park committed
39

Thomas Park's avatar
Thomas Park committed
40
41
42
43

//== Typography
//
//## Font, line-height, and color for body text, headings, and more.
Thomas Park's avatar
Thomas Park committed
44
45
46

@font-family-sans-serif:  "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
@font-family-serif:       Georgia, "Times New Roman", Times, serif;
Thomas Park's avatar
Thomas Park committed
47
//** Default monospace fonts for `<code>`, `<kbd>`, and `<pre>`.
48
@font-family-monospace:   Menlo, Monaco, Consolas, "Courier New", monospace;
Thomas Park's avatar
Thomas Park committed
49
50
51
@font-family-base:        @font-family-sans-serif;

@font-size-base:          15px;
Thomas Park's avatar
Thomas Park committed
52
53
@font-size-large:         ceil((@font-size-base * 1.25)); // ~18px
@font-size-small:         12px; // ~12px
Thomas Park's avatar
Thomas Park committed
54

Thomas Park's avatar
Thomas Park committed
55
56
57
58
@font-size-h1:            floor((@font-size-base * 2.6)); // ~36px
@font-size-h2:            floor((@font-size-base * 2.15)); // ~30px
@font-size-h3:            ceil((@font-size-base * 1.7)); // ~24px
@font-size-h4:            ceil((@font-size-base * 1.25)); // ~18px
Thomas Park's avatar
Thomas Park committed
59
@font-size-h5:            @font-size-base;
Thomas Park's avatar
Thomas Park committed
60
@font-size-h6:            ceil((@font-size-base * 0.85)); // ~12px
Thomas Park's avatar
Thomas Park committed
61

Thomas Park's avatar
Thomas Park committed
62
//** Unit-less `line-height` for use in components like buttons.
63
@line-height-base:        1.4;
Thomas Park's avatar
Thomas Park committed
64
65
//** Computed "line-height" (`font-size` * `line-height`) for use with `margin`, `padding`, etc.
@line-height-computed:    floor((@font-size-base * @line-height-base)); // ~20px
Thomas Park's avatar
Thomas Park committed
66

Thomas Park's avatar
Thomas Park committed
67
//** By default, this inherits from the `<body>`.
Thomas Park's avatar
Thomas Park committed
68
69
70
71
72
73
@headings-font-family:    @font-family-base;
@headings-font-weight:    300;
@headings-line-height:    1.1;
@headings-color:          inherit;


Thomas Park's avatar
Thomas Park committed
74
//== Iconography
Thomas Park's avatar
Thomas Park committed
75
//
Thomas Park's avatar
Thomas Park committed
76
//## Specify custom location and filename of the included Glyphicons icon font. Useful for those including Bootstrap via Bower.
Thomas Park's avatar
Thomas Park committed
77

Thomas Park's avatar
Thomas Park committed
78
//** Load fonts from this directory.
Thomas Park's avatar
Thomas Park committed
79
@icon-font-path:          "../fonts/";
Thomas Park's avatar
Thomas Park committed
80
//** File name for all font files.
Thomas Park's avatar
Thomas Park committed
81
@icon-font-name:          "glyphicons-halflings-regular";
Thomas Park's avatar
Thomas Park committed
82
//** Element ID within SVG icon file.
Thomas Park's avatar
Thomas Park committed
83
@icon-font-svg-id:        "glyphicons_halflingsregular";
Thomas Park's avatar
Thomas Park committed
84

Thomas Park's avatar
Thomas Park committed
85

Thomas Park's avatar
Thomas Park committed
86
87
88
//== Components
//
//## Define common padding and border radius sizes and more. Values based on 14px text and 1.428 line-height (~20px to start).
Thomas Park's avatar
Thomas Park committed
89

Thomas Park's avatar
Thomas Park committed
90
91
@padding-base-vertical:     8px;
@padding-base-horizontal:   12px;
Thomas Park's avatar
Thomas Park committed
92

93
94
@padding-large-vertical:    16px;
@padding-large-horizontal:  20px;
Thomas Park's avatar
Thomas Park committed
95

96
97
@padding-small-vertical:    8px;
@padding-small-horizontal:  12px;
Thomas Park's avatar
Thomas Park committed
98

99
100
@padding-xs-vertical:       4px;
@padding-xs-horizontal:     6px;
Thomas Park's avatar
Thomas Park committed
101

Thomas Park's avatar
Thomas Park committed
102
103
@line-height-large:         1.33;
@line-height-small:         1.5;
104

Thomas Park's avatar
Thomas Park committed
105
106
107
@border-radius-base:        0;
@border-radius-large:       0;
@border-radius-small:       0;
Thomas Park's avatar
Thomas Park committed
108

Thomas Park's avatar
Thomas Park committed
109
110
111
112
//** Global color for active items (e.g., navs or dropdowns).
@component-active-color:    #fff;
//** Global background color for active items (e.g., navs or dropdowns).
@component-active-bg:       @brand-primary;
Thomas Park's avatar
Thomas Park committed
113

Thomas Park's avatar
Thomas Park committed
114
115
116
117
//** Width of the `border` for generating carets that indicator dropdowns.
@caret-width-base:          4px;
//** Carets increase slightly in size for larger components.
@caret-width-large:         5px;
Thomas Park's avatar
Thomas Park committed
118
119


Thomas Park's avatar
Thomas Park committed
120
121
122
//== Tables
//
//## Customizes the `.table` component with basic values, each used across all table variations.
Thomas Park's avatar
Thomas Park committed
123

Thomas Park's avatar
Thomas Park committed
124
125
126
127
//** Padding for `<th>`s and `<td>`s.
@table-cell-padding:            8px;
//** Padding for cells in `.table-condensed`.
@table-condensed-cell-padding:  5px;
Thomas Park's avatar
Thomas Park committed
128

Thomas Park's avatar
Thomas Park committed
129
130
131
132
133
134
135
//** Default background color used for all tables.
@table-bg:                      transparent;
//** Background color used for `.table-striped`.
@table-bg-accent:               #f9f9f9;
//** Background color used for `.table-hover`.
@table-bg-hover:                #f5f5f5;
@table-bg-active:               @table-bg-hover;
Thomas Park's avatar
Thomas Park committed
136

Thomas Park's avatar
Thomas Park committed
137
138
//** Border color for table and cell borders.
@table-border-color:            #ddd;
Thomas Park's avatar
Thomas Park committed
139
140


Thomas Park's avatar
Thomas Park committed
141
142
143
//== Buttons
//
//## For each of Bootstrap's buttons, define text, background and border color.
Thomas Park's avatar
Thomas Park committed
144
145
146
147
148

@btn-font-weight:                normal;

@btn-default-color:              @gray-dark;
@btn-default-bg:                 #e7e7e7;
149
@btn-default-border:             #ccc;
Thomas Park's avatar
Thomas Park committed
150
151
152
153
154
155
156
157
158

@btn-primary-color:              #fff;
@btn-primary-bg:                 @brand-primary;
@btn-primary-border:             darken(@btn-primary-bg, 5%);

@btn-success-color:              #fff;
@btn-success-bg:                 @brand-success;
@btn-success-border:             darken(@btn-success-bg, 5%);

Thomas Park's avatar
Thomas Park committed
159
160
161
162
@btn-info-color:                 #fff;
@btn-info-bg:                    @brand-info;
@btn-info-border:                darken(@btn-info-bg, 5%);

Thomas Park's avatar
Thomas Park committed
163
164
165
166
167
168
169
170
171
172
173
@btn-warning-color:              #fff;
@btn-warning-bg:                 @brand-warning;
@btn-warning-border:             darken(@btn-warning-bg, 5%);

@btn-danger-color:               #fff;
@btn-danger-bg:                  @brand-danger;
@btn-danger-border:              darken(@btn-danger-bg, 5%);

@btn-link-disabled-color:        @gray-light;


Thomas Park's avatar
Thomas Park committed
174
175
176
//== Forms
//
//##
Thomas Park's avatar
Thomas Park committed
177

Thomas Park's avatar
Thomas Park committed
178
//** `<input>` background color
Thomas Park's avatar
Thomas Park committed
179
@input-bg:                       #fff;
Thomas Park's avatar
Thomas Park committed
180
//** `<input disabled>` background color
Thomas Park's avatar
Thomas Park committed
181
182
@input-bg-disabled:              @gray-lighter;

Thomas Park's avatar
Thomas Park committed
183
//** Text color for `<input>`s
Thomas Park's avatar
Thomas Park committed
184
@input-color:                    @gray;
Thomas Park's avatar
Thomas Park committed
185
//** `<input>` border color
Thomas Park's avatar
Thomas Park committed
186
@input-border:                   #ccc;
Thomas Park's avatar
Thomas Park committed
187
188
189

// TODO: Rename `@input-border-radius` to `@input-border-radius-base` in v4
//** Default `.form-control` border radius
Thomas Park's avatar
Thomas Park committed
190
@input-border-radius:            @border-radius-base;
Thomas Park's avatar
Thomas Park committed
191
192
193
194
195
//** Large `.form-control` border radius
@input-border-radius-large:      @border-radius-large;
//** Small `.form-control` border radius
@input-border-radius-small:      @border-radius-small;

Thomas Park's avatar
Thomas Park committed
196
//** Border color for inputs on focus
Thomas Park's avatar
Thomas Park committed
197
198
@input-border-focus:             #66afe9;

Thomas Park's avatar
Thomas Park committed
199
//** Placeholder text color
Thomas Park's avatar
Thomas Park committed
200
201
@input-color-placeholder:        @gray-light;

Thomas Park's avatar
Thomas Park committed
202
//** Default `.form-control` height
Thomas Park's avatar
Thomas Park committed
203
@input-height-base:              (@line-height-computed + (@padding-base-vertical * 2) + 2);
Thomas Park's avatar
Thomas Park committed
204
//** Large `.form-control` height
205
@input-height-large:             (ceil(@font-size-large * @line-height-large) + (@padding-large-vertical * 2) + 2);
Thomas Park's avatar
Thomas Park committed
206
//** Small `.form-control` height
Thomas Park's avatar
Thomas Park committed
207
208
209
210
211
@input-height-small:             (floor(@font-size-small * @line-height-small) + (@padding-small-vertical * 2) + 2);

@legend-color:                   @gray-dark;
@legend-border-color:            #e5e5e5;

Thomas Park's avatar
Thomas Park committed
212
//** Background color for textual input addons
Thomas Park's avatar
Thomas Park committed
213
@input-group-addon-bg:           @gray-lighter;
Thomas Park's avatar
Thomas Park committed
214
//** Border color for textual input addons
Thomas Park's avatar
Thomas Park committed
215
216
@input-group-addon-border-color: @input-border;

Thomas Park's avatar
Thomas Park committed
217
218
219
//** Disabled cursor for form controls and buttons.
@cursor-disabled:                not-allowed;

Thomas Park's avatar
Thomas Park committed
220

Thomas Park's avatar
Thomas Park committed
221
222
223
//== Dropdowns
//
//## Dropdown menu container and contents.
Thomas Park's avatar
Thomas Park committed
224

Thomas Park's avatar
Thomas Park committed
225
//** Background for the dropdown menu.
Thomas Park's avatar
Thomas Park committed
226
@dropdown-bg:                    #fff;
Thomas Park's avatar
Thomas Park committed
227
//** Dropdown menu `border-color`.
Thomas Park's avatar
Thomas Park committed
228
@dropdown-border:                rgba(0,0,0,.15);
Thomas Park's avatar
Thomas Park committed
229
//** Dropdown menu `border-color` **for IE8**.
Thomas Park's avatar
Thomas Park committed
230
@dropdown-fallback-border:       #ccc;
Thomas Park's avatar
Thomas Park committed
231
//** Divider color for between dropdown items.
Thomas Park's avatar
Thomas Park committed
232
233
@dropdown-divider-bg:            rgba(0,0,0,.2);

Thomas Park's avatar
Thomas Park committed
234
//** Dropdown link text color.
Thomas Park's avatar
Thomas Park committed
235
@dropdown-link-color:            #555;
Thomas Park's avatar
Thomas Park committed
236
//** Hover color for dropdown links.
Thomas Park's avatar
Thomas Park committed
237
@dropdown-link-hover-color:      darken(@gray-dark, 5%);
Thomas Park's avatar
Thomas Park committed
238
//** Hover background for dropdown links.
Thomas Park's avatar
Thomas Park committed
239
240
@dropdown-link-hover-bg:         #eee;

Thomas Park's avatar
Thomas Park committed
241
//** Active dropdown menu item text color.
Thomas Park's avatar
Thomas Park committed
242
@dropdown-link-active-color:     @component-active-color;
Thomas Park's avatar
Thomas Park committed
243
//** Active dropdown menu item background color.
Thomas Park's avatar
Thomas Park committed
244
245
@dropdown-link-active-bg:        @component-active-bg;

Thomas Park's avatar
Thomas Park committed
246
//** Disabled dropdown menu item background color.
Thomas Park's avatar
Thomas Park committed
247
248
@dropdown-link-disabled-color:   @gray-light;

Thomas Park's avatar
Thomas Park committed
249
//** Text color for headers within dropdown menus.
Thomas Park's avatar
Thomas Park committed
250
251
@dropdown-header-color:          @gray-light;

Thomas Park's avatar
Thomas Park committed
252
//** Deprecated `@dropdown-caret-color` as of v3.1.0
Thomas Park's avatar
Thomas Park committed
253
@dropdown-caret-color:           #000;
Thomas Park's avatar
Thomas Park committed
254
255


Thomas Park's avatar
Thomas Park committed
256
257
258
259
260
261
//-- Z-index master list
//
// Warning: Avoid customizing these values. They're used for a bird's eye view
// of components dependent on the z-axis and are designed to all work together.
//
// Note: These variables are not generated into the Customizer.
Thomas Park's avatar
Thomas Park committed
262
263
264

@zindex-navbar:            1000;
@zindex-dropdown:          1000;
Thomas Park's avatar
Thomas Park committed
265
266
@zindex-popover:           1060;
@zindex-tooltip:           1070;
Thomas Park's avatar
Thomas Park committed
267
@zindex-navbar-fixed:      1030;
Thomas Park's avatar
Thomas Park committed
268
@zindex-modal:             1040;
Thomas Park's avatar
Thomas Park committed
269

Thomas Park's avatar
Thomas Park committed
270
271
272
273

//== Media queries breakpoints
//
//## Define the breakpoints at which your layout will change, adapting to different screen sizes.
Thomas Park's avatar
Thomas Park committed
274
275

// Extra small screen / phone
Thomas Park's avatar
Thomas Park committed
276
//** Deprecated `@screen-xs` as of v3.0.1
Thomas Park's avatar
Thomas Park committed
277
@screen-xs:                  480px;
Thomas Park's avatar
Thomas Park committed
278
//** Deprecated `@screen-xs-min` as of v3.2.0
Thomas Park's avatar
Thomas Park committed
279
@screen-xs-min:              @screen-xs;
Thomas Park's avatar
Thomas Park committed
280
//** Deprecated `@screen-phone` as of v3.0.1
Thomas Park's avatar
Thomas Park committed
281
282
283
@screen-phone:               @screen-xs-min;

// Small screen / tablet
Thomas Park's avatar
Thomas Park committed
284
//** Deprecated `@screen-sm` as of v3.0.1
Thomas Park's avatar
Thomas Park committed
285
286
@screen-sm:                  768px;
@screen-sm-min:              @screen-sm;
Thomas Park's avatar
Thomas Park committed
287
//** Deprecated `@screen-tablet` as of v3.0.1
Thomas Park's avatar
Thomas Park committed
288
289
290
@screen-tablet:              @screen-sm-min;

// Medium screen / desktop
Thomas Park's avatar
Thomas Park committed
291
//** Deprecated `@screen-md` as of v3.0.1
Thomas Park's avatar
Thomas Park committed
292
293
@screen-md:                  992px;
@screen-md-min:              @screen-md;
Thomas Park's avatar
Thomas Park committed
294
//** Deprecated `@screen-desktop` as of v3.0.1
Thomas Park's avatar
Thomas Park committed
295
296
297
@screen-desktop:             @screen-md-min;

// Large screen / wide desktop
Thomas Park's avatar
Thomas Park committed
298
//** Deprecated `@screen-lg` as of v3.0.1
Thomas Park's avatar
Thomas Park committed
299
300
@screen-lg:                  1200px;
@screen-lg-min:              @screen-lg;
Thomas Park's avatar
Thomas Park committed
301
//** Deprecated `@screen-lg-desktop` as of v3.0.1
Thomas Park's avatar
Thomas Park committed
302
303
304
305
306
307
308
309
@screen-lg-desktop:          @screen-lg-min;

// So media queries don't overlap when required, provide a maximum
@screen-xs-max:              (@screen-sm-min - 1);
@screen-sm-max:              (@screen-md-min - 1);
@screen-md-max:              (@screen-lg-min - 1);


Thomas Park's avatar
Thomas Park committed
310
311
312
//== Grid system
//
//## Define your custom responsive grid.
Thomas Park's avatar
Thomas Park committed
313

Thomas Park's avatar
Thomas Park committed
314
//** Number of columns in the grid.
Thomas Park's avatar
Thomas Park committed
315
@grid-columns:              12;
Thomas Park's avatar
Thomas Park committed
316
//** Padding between columns. Gets divided in half for the left and right.
Thomas Park's avatar
Thomas Park committed
317
@grid-gutter-width:         30px;
318
// Navbar collapse
Thomas Park's avatar
Thomas Park committed
319
//** Point at which the navbar becomes uncollapsed.
Thomas Park's avatar
Thomas Park committed
320
@grid-float-breakpoint:     @screen-sm-min;
Thomas Park's avatar
Thomas Park committed
321
//** Point at which the navbar begins collapsing.
322
@grid-float-breakpoint-max: (@grid-float-breakpoint - 1);
Thomas Park's avatar
Thomas Park committed
323
324


Thomas Park's avatar
Thomas Park committed
325
326
327
328
329
//== Container sizes
//
//## Define the maximum width of `.container` for different screen sizes.

// Small screen / tablet
Thomas Park's avatar
Thomas Park committed
330
@container-tablet:             (720px + @grid-gutter-width);
Thomas Park's avatar
Thomas Park committed
331
332
333
334
//** For `@screen-sm-min` and up.
@container-sm:                 @container-tablet;

// Medium screen / desktop
Thomas Park's avatar
Thomas Park committed
335
@container-desktop:            (940px + @grid-gutter-width);
Thomas Park's avatar
Thomas Park committed
336
337
338
339
//** For `@screen-md-min` and up.
@container-md:                 @container-desktop;

// Large screen / wide desktop
Thomas Park's avatar
Thomas Park committed
340
@container-large-desktop:      (1140px + @grid-gutter-width);
Thomas Park's avatar
Thomas Park committed
341
342
343
344
//** For `@screen-lg-min` and up.
@container-lg:                 @container-large-desktop;


Thomas Park's avatar
Thomas Park committed
345
346
347
//== Navbar
//
//##
Thomas Park's avatar
Thomas Park committed
348
349
350
351
352

// Basics of a navbar
@navbar-height:                    45px;
@navbar-margin-bottom:             @line-height-computed;
@navbar-border-radius:             @border-radius-base;
Thomas Park's avatar
Thomas Park committed
353
@navbar-padding-horizontal:        floor((@grid-gutter-width / 2));
Thomas Park's avatar
Thomas Park committed
354
@navbar-padding-vertical:          ((@navbar-height - @line-height-computed) / 2);
Thomas Park's avatar
Thomas Park committed
355
@navbar-collapse-max-height:       340px;
Thomas Park's avatar
Thomas Park committed
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382

@navbar-default-color:             #fff;
@navbar-default-bg:                @gray-dark;
@navbar-default-border:            darken(@navbar-default-bg, 6.5%);

// Navbar links
@navbar-default-link-color:                #fff;
@navbar-default-link-hover-color:          #fff;
@navbar-default-link-hover-bg:             #272727;
@navbar-default-link-active-color:         #fff;
@navbar-default-link-active-bg:            #272727;
@navbar-default-link-disabled-color:       #ccc;
@navbar-default-link-disabled-bg:          transparent;

// Navbar brand label
@navbar-default-brand-color:               @navbar-default-link-color;
@navbar-default-brand-hover-color:         @navbar-default-brand-color;
@navbar-default-brand-hover-bg:            transparent;

// Navbar toggle
@navbar-default-toggle-hover-bg:           transparent;
@navbar-default-toggle-icon-bar-bg:        #fff;
@navbar-default-toggle-border-color:       transparent;


// Inverted navbar
// Reset inverted navbar basics
383
@navbar-inverse-color:                      #fff;
Thomas Park's avatar
Thomas Park committed
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
@navbar-inverse-bg:                         @brand-primary;
@navbar-inverse-border:                     darken(@navbar-inverse-bg, 10%);

// Inverted navbar links
@navbar-inverse-link-color:                 #fff;
@navbar-inverse-link-hover-color:           #fff;
@navbar-inverse-link-hover-bg:              darken(@navbar-inverse-bg, 10%);
@navbar-inverse-link-active-color:          #fff;
@navbar-inverse-link-active-bg:             darken(@navbar-inverse-bg, 10%);
@navbar-inverse-link-disabled-color:        #444;
@navbar-inverse-link-disabled-bg:           transparent;

// Inverted navbar brand label
@navbar-inverse-brand-color:                @navbar-inverse-link-color;
@navbar-inverse-brand-hover-color:          #fff;
@navbar-inverse-brand-hover-bg:             transparent;

// Inverted navbar toggle
@navbar-inverse-toggle-hover-bg:            transparent;
@navbar-inverse-toggle-icon-bar-bg:         #fff;
@navbar-inverse-toggle-border-color:        transparent;


Thomas Park's avatar
Thomas Park committed
407
408
409
//== Navs
//
//##
Thomas Park's avatar
Thomas Park committed
410

Thomas Park's avatar
Thomas Park committed
411
//=== Shared nav styles
Thomas Park's avatar
Thomas Park committed
412
413
414
415
416
417
@nav-link-padding:                          10px 15px;
@nav-link-hover-bg:                         @gray-lighter;

@nav-disabled-link-color:                   @gray-light;
@nav-disabled-link-hover-color:             @gray-light;

Thomas Park's avatar
Thomas Park committed
418
//== Tabs
Thomas Park's avatar
Thomas Park committed
419
420
421
422
423
424
425
426
427
428
429
@nav-tabs-border-color:                     #ddd;

@nav-tabs-link-hover-border-color:          @gray-lighter;

@nav-tabs-active-link-hover-bg:             @body-bg;
@nav-tabs-active-link-hover-color:          @gray;
@nav-tabs-active-link-hover-border-color:   #ddd;

@nav-tabs-justified-link-border-color:            #ddd;
@nav-tabs-justified-active-link-border-color:     @body-bg;

Thomas Park's avatar
Thomas Park committed
430
//== Pills
Thomas Park's avatar
Thomas Park committed
431
432
433
434
435
@nav-pills-border-radius:                   @border-radius-base;
@nav-pills-active-link-hover-bg:            @component-active-bg;
@nav-pills-active-link-hover-color:         @component-active-color;


Thomas Park's avatar
Thomas Park committed
436
437
438
//== Pagination
//
//##
Thomas Park's avatar
Thomas Park committed
439

Thomas Park's avatar
Thomas Park committed
440
@pagination-color:                     @link-color;
Thomas Park's avatar
Thomas Park committed
441
442
443
@pagination-bg:                        transparent;
@pagination-border:                    transparent;

Thomas Park's avatar
Thomas Park committed
444
@pagination-hover-color:               @link-hover-color;
Thomas Park's avatar
Thomas Park committed
445
@pagination-hover-bg:                  @gray-lighter;
Thomas Park's avatar
Thomas Park committed
446
@pagination-hover-border:              transparent;
Thomas Park's avatar
Thomas Park committed
447
448

@pagination-active-color:              #fff;
Thomas Park's avatar
Thomas Park committed
449
450
@pagination-active-bg:                 @brand-primary;
@pagination-active-border:             transparent;
Thomas Park's avatar
Thomas Park committed
451
452

@pagination-disabled-color:            @gray-light;
Thomas Park's avatar
Thomas Park committed
453
454
@pagination-disabled-bg:               #fff;
@pagination-disabled-border:           transparent;
Thomas Park's avatar
Thomas Park committed
455
456


Thomas Park's avatar
Thomas Park committed
457
458
459
//== Pager
//
//##
Thomas Park's avatar
Thomas Park committed
460

Thomas Park's avatar
Thomas Park committed
461
462
@pager-bg:                             @pagination-bg;
@pager-border:                         @pagination-border;
Thomas Park's avatar
Thomas Park committed
463
@pager-border-radius:                  3px;
Thomas Park's avatar
Thomas Park committed
464
465
466
467
468
469

@pager-hover-bg:                       @pagination-hover-bg;

@pager-active-bg:                      @pagination-active-bg;
@pager-active-color:                   @pagination-active-color;

Thomas Park's avatar
Thomas Park committed
470
471
472
@pager-disabled-color:                 @gray-light;


Thomas Park's avatar
Thomas Park committed
473
474
475
//== Jumbotron
//
//##
Thomas Park's avatar
Thomas Park committed
476
477
478
479
480

@jumbotron-padding:              30px;
@jumbotron-color:                inherit;
@jumbotron-bg:                   #fafafa;
@jumbotron-heading-color:        inherit;
Thomas Park's avatar
Thomas Park committed
481
@jumbotron-font-size:            ceil((@font-size-base * 1.5));
Thomas Park's avatar
Thomas Park committed
482
483


Thomas Park's avatar
Thomas Park committed
484
485
486
//== Form states and alerts
//
//## Define colors for form feedback states and, by default, alerts.
Thomas Park's avatar
Thomas Park committed
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504

@state-success-text:             @brand-success;
@state-success-bg:               #dff0d8;
@state-success-border:           darken(@state-success-text, 5%);

@state-info-text:                @brand-info;
@state-info-bg:                  #d9edf7;
@state-info-border:              darken(@state-info-text, 7%);

@state-warning-text:             @brand-warning;
@state-warning-bg:               #fcf8e3;
@state-warning-border:           darken(@state-warning-text, 5%);

@state-danger-text:              @brand-danger;
@state-danger-bg:                #f2dede;
@state-danger-border:            darken(@state-danger-text, 5%);


Thomas Park's avatar
Thomas Park committed
505
506
507
508
509
//== Tooltips
//
//##

//** Tooltip max width
Thomas Park's avatar
Thomas Park committed
510
@tooltip-max-width:           200px;
Thomas Park's avatar
Thomas Park committed
511
//** Tooltip text color
Thomas Park's avatar
Thomas Park committed
512
@tooltip-color:               #fff;
Thomas Park's avatar
Thomas Park committed
513
//** Tooltip background color
Thomas Park's avatar
Thomas Park committed
514
@tooltip-bg:                  @gray-dark;
Thomas Park's avatar
Thomas Park committed
515
@tooltip-opacity:             .9;
Thomas Park's avatar
Thomas Park committed
516

Thomas Park's avatar
Thomas Park committed
517
//** Tooltip arrow width
Thomas Park's avatar
Thomas Park committed
518
@tooltip-arrow-width:         5px;
Thomas Park's avatar
Thomas Park committed
519
//** Tooltip arrow color
Thomas Park's avatar
Thomas Park committed
520
521
522
@tooltip-arrow-color:         @tooltip-bg;


Thomas Park's avatar
Thomas Park committed
523
524
525
526
527
//== Popovers
//
//##

//** Popover body background color
Thomas Park's avatar
Thomas Park committed
528
@popover-bg:                          @gray-dark;
Thomas Park's avatar
Thomas Park committed
529
//** Popover maximum width
Thomas Park's avatar
Thomas Park committed
530
@popover-max-width:                   276px;
Thomas Park's avatar
Thomas Park committed
531
//** Popover border color
Thomas Park's avatar
Thomas Park committed
532
@popover-border-color:                transparent;
Thomas Park's avatar
Thomas Park committed
533
//** Popover fallback border color
Thomas Park's avatar
Thomas Park committed
534
535
@popover-fallback-border-color:       @gray-dark;

Thomas Park's avatar
Thomas Park committed
536
//** Popover title background color
Thomas Park's avatar
Thomas Park committed
537
538
@popover-title-bg:                    @popover-bg;

Thomas Park's avatar
Thomas Park committed
539
//** Popover arrow width
Thomas Park's avatar
Thomas Park committed
540
@popover-arrow-width:                 10px;
Thomas Park's avatar
Thomas Park committed
541
//** Popover arrow color
Thomas Park's avatar
Thomas Park committed
542
543
@popover-arrow-color:                 @popover-bg;

Thomas Park's avatar
Thomas Park committed
544
//** Popover outer arrow width
Thomas Park's avatar
Thomas Park committed
545
@popover-arrow-outer-width:           (@popover-arrow-width + 1);
Thomas Park's avatar
Thomas Park committed
546
//** Popover outer arrow color
Thomas Park's avatar
Thomas Park committed
547
@popover-arrow-outer-color:           fadein(@popover-border-color, 5%);
Thomas Park's avatar
Thomas Park committed
548
//** Popover outer arrow fallback color
Thomas Park's avatar
Thomas Park committed
549
@popover-arrow-outer-fallback-color:  darken(@popover-fallback-border-color, 20%);
Thomas Park's avatar
Thomas Park committed
550
551


Thomas Park's avatar
Thomas Park committed
552
553
554
//== Labels
//
//##
Thomas Park's avatar
Thomas Park committed
555

Thomas Park's avatar
Thomas Park committed
556
//** Default label background color
Thomas Park's avatar
Thomas Park committed
557
@label-default-bg:            @gray-light;
Thomas Park's avatar
Thomas Park committed
558
//** Primary label background color
Thomas Park's avatar
Thomas Park committed
559
@label-primary-bg:            @brand-primary;
Thomas Park's avatar
Thomas Park committed
560
//** Success label background color
Thomas Park's avatar
Thomas Park committed
561
@label-success-bg:            @brand-success;
Thomas Park's avatar
Thomas Park committed
562
//** Info label background color
Thomas Park's avatar
Thomas Park committed
563
@label-info-bg:               @brand-info;
Thomas Park's avatar
Thomas Park committed
564
//** Warning label background color
Thomas Park's avatar
Thomas Park committed
565
@label-warning-bg:            @brand-warning;
Thomas Park's avatar
Thomas Park committed
566
//** Danger label background color
Thomas Park's avatar
Thomas Park committed
567
568
@label-danger-bg:             @brand-danger;

Thomas Park's avatar
Thomas Park committed
569
//** Default label text color
Thomas Park's avatar
Thomas Park committed
570
@label-color:                 #fff;
Thomas Park's avatar
Thomas Park committed
571
//** Default text color of a linked label
Thomas Park's avatar
Thomas Park committed
572
573
574
@label-link-hover-color:      #fff;


Thomas Park's avatar
Thomas Park committed
575
576
577
578
579
//== Modals
//
//##

//** Padding applied to the modal body
Thomas Park's avatar
Thomas Park committed
580
581
@modal-inner-padding:         20px;

Thomas Park's avatar
Thomas Park committed
582
//** Padding applied to the modal title
Thomas Park's avatar
Thomas Park committed
583
@modal-title-padding:         15px;
Thomas Park's avatar
Thomas Park committed
584
//** Modal title line-height
Thomas Park's avatar
Thomas Park committed
585
586
@modal-title-line-height:     @line-height-base;

Thomas Park's avatar
Thomas Park committed
587
//** Background color of modal content area
Thomas Park's avatar
Thomas Park committed
588
@modal-content-bg:                             #fff;
Thomas Park's avatar
Thomas Park committed
589
//** Modal content border color
Thomas Park's avatar
Thomas Park committed
590
@modal-content-border-color:                   rgba(0,0,0,.2);
Thomas Park's avatar
Thomas Park committed
591
//** Modal content border color **for IE8**
Thomas Park's avatar
Thomas Park committed
592
593
@modal-content-fallback-border-color:          #999;

Thomas Park's avatar
Thomas Park committed
594
//** Modal backdrop background color
Thomas Park's avatar
Thomas Park committed
595
@modal-backdrop-bg:           #000;
Thomas Park's avatar
Thomas Park committed
596
597
598
//** Modal backdrop opacity
@modal-backdrop-opacity:      .5;
//** Modal header border color
Thomas Park's avatar
Thomas Park committed
599
@modal-header-border-color:   #e5e5e5;
Thomas Park's avatar
Thomas Park committed
600
//** Modal footer border color
Thomas Park's avatar
Thomas Park committed
601
602
@modal-footer-border-color:   @modal-header-border-color;

Thomas Park's avatar
Thomas Park committed
603
604
605
606
607
608
609
610
@modal-lg:                    900px;
@modal-md:                    600px;
@modal-sm:                    300px;


//== Alerts
//
//## Define alert colors, border radius, and padding.
Thomas Park's avatar
Thomas Park committed
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632

@alert-padding:               15px;
@alert-border-radius:         @border-radius-base;
@alert-link-font-weight:      bold;

@alert-success-bg:            @brand-success;
@alert-success-text:          #fff;
@alert-success-border:        @state-success-border;

@alert-info-bg:               @brand-info;
@alert-info-text:             #fff;
@alert-info-border:           @state-info-border;

@alert-warning-bg:            @brand-warning;
@alert-warning-text:          #fff;
@alert-warning-border:        @state-warning-border;

@alert-danger-bg:             @brand-danger;
@alert-danger-text:           #fff;
@alert-danger-border:         @state-danger-border;


Thomas Park's avatar
Thomas Park committed
633
634
635
636
637
//== Progress bars
//
//##

//** Background color of the whole progress component
Thomas Park's avatar
Thomas Park committed
638
@progress-bg:                 #f5f5f5;
Thomas Park's avatar
Thomas Park committed
639
//** Progress bar text color
Thomas Park's avatar
Thomas Park committed
640
@progress-bar-color:          #fff;
Thomas Park's avatar
Thomas Park committed
641
642
//** Variable for setting rounded corners on progress bar.
@progress-border-radius:      @border-radius-base;
Thomas Park's avatar
Thomas Park committed
643

Thomas Park's avatar
Thomas Park committed
644
//** Default progress bar color
Thomas Park's avatar
Thomas Park committed
645
@progress-bar-bg:             @brand-primary;
Thomas Park's avatar
Thomas Park committed
646
//** Success progress bar color
Thomas Park's avatar
Thomas Park committed
647
@progress-bar-success-bg:     @brand-success;
Thomas Park's avatar
Thomas Park committed
648
//** Warning progress bar color
Thomas Park's avatar
Thomas Park committed
649
@progress-bar-warning-bg:     @brand-warning;
Thomas Park's avatar
Thomas Park committed
650
//** Danger progress bar color
Thomas Park's avatar
Thomas Park committed
651
@progress-bar-danger-bg:      @brand-danger;
Thomas Park's avatar
Thomas Park committed
652
//** Info progress bar color
Thomas Park's avatar
Thomas Park committed
653
654
655
@progress-bar-info-bg:        @brand-info;


Thomas Park's avatar
Thomas Park committed
656
657
658
659
660
661
662
663
664
665
666
//== List group
//
//##

//** Background color on `.list-group-item`
@list-group-bg:                 #fff;
//** `.list-group-item` border color
@list-group-border:             #ddd;
//** List group border radius
@list-group-border-radius:      @border-radius-base;

Thomas Park's avatar
Thomas Park committed
667
//** Background color of single list items on hover
Thomas Park's avatar
Thomas Park committed
668
@list-group-hover-bg:           #f5f5f5;
Thomas Park's avatar
Thomas Park committed
669
//** Text color of active list items
Thomas Park's avatar
Thomas Park committed
670
@list-group-active-color:       @component-active-color;
Thomas Park's avatar
Thomas Park committed
671
//** Background color of active list items
Thomas Park's avatar
Thomas Park committed
672
673
674
@list-group-active-bg:          @component-active-bg;
//** Border color of active list elements
@list-group-active-border:      @list-group-active-bg;
Thomas Park's avatar
Thomas Park committed
675
//** Text color for content within active list items
Thomas Park's avatar
Thomas Park committed
676
677
@list-group-active-text-color:  lighten(@list-group-active-bg, 40%);

Thomas Park's avatar
Thomas Park committed
678
679
680
681
682
683
684
//** Text color of disabled list items
@list-group-disabled-color:      @gray-light;
//** Background color of disabled list items
@list-group-disabled-bg:         @gray-lighter;
//** Text color for content within disabled list items
@list-group-disabled-text-color: @list-group-disabled-color;

Thomas Park's avatar
Thomas Park committed
685
@list-group-link-color:         #555;
Thomas Park's avatar
Thomas Park committed
686
@list-group-link-hover-color:   @list-group-link-color;
Thomas Park's avatar
Thomas Park committed
687
688
689
690
691
692
@list-group-link-heading-color: #333;


//== Panels
//
//##
Thomas Park's avatar
Thomas Park committed
693
694

@panel-bg:                    #fff;
Thomas Park's avatar
Thomas Park committed
695
@panel-body-padding:          15px;
Thomas Park's avatar
Thomas Park committed
696
697
@panel-heading-padding:       10px 15px;
@panel-footer-padding:        @panel-heading-padding;
Thomas Park's avatar
Thomas Park committed
698
@panel-border-radius:         @border-radius-base;
Thomas Park's avatar
Thomas Park committed
699
700
701

//** Border color for elements within panels
@panel-inner-border:          #ddd;
Thomas Park's avatar
Thomas Park committed
702
703
704
705
706
707
708
709
710
711
@panel-footer-bg:             #f5f5f5;

@panel-default-text:          @gray-dark;
@panel-default-border:        #ddd;
@panel-default-heading-bg:    #f5f5f5;

@panel-primary-text:          #fff;
@panel-primary-border:        @brand-primary;
@panel-primary-heading-bg:    @brand-primary;

712
@panel-success-text:          #fff;
Thomas Park's avatar
Thomas Park committed
713
@panel-success-border:        @state-success-border;
714
@panel-success-heading-bg:    @brand-success;
Thomas Park's avatar
Thomas Park committed
715

716
@panel-info-text:             #fff;
Thomas Park's avatar
Thomas Park committed
717
@panel-info-border:           @state-info-border;
718
@panel-info-heading-bg:       @brand-info;
Thomas Park's avatar
Thomas Park committed
719

720
@panel-warning-text:          #fff;
Thomas Park's avatar
Thomas Park committed
721
@panel-warning-border:        @state-warning-border;
722
@panel-warning-heading-bg:    @brand-warning;
Thomas Park's avatar
Thomas Park committed
723

724
@panel-danger-text:           #fff;
Thomas Park's avatar
Thomas Park committed
725
@panel-danger-border:         @state-danger-border;
726
@panel-danger-heading-bg:     @brand-danger;
Thomas Park's avatar
Thomas Park committed
727
728


Thomas Park's avatar
Thomas Park committed
729
730
731
//== Thumbnails
//
//##
Thomas Park's avatar
Thomas Park committed
732

Thomas Park's avatar
Thomas Park committed
733
//** Padding around the thumbnail image
Thomas Park's avatar
Thomas Park committed
734
@thumbnail-padding:           4px;
Thomas Park's avatar
Thomas Park committed
735
//** Thumbnail background color
Thomas Park's avatar
Thomas Park committed
736
@thumbnail-bg:                @body-bg;
Thomas Park's avatar
Thomas Park committed
737
//** Thumbnail border color
Thomas Park's avatar
Thomas Park committed
738
@thumbnail-border:            #ddd;
Thomas Park's avatar
Thomas Park committed
739
//** Thumbnail border radius
Thomas Park's avatar
Thomas Park committed
740
741
@thumbnail-border-radius:     @border-radius-base;

Thomas Park's avatar
Thomas Park committed
742
//** Custom text color for thumbnail captions
Thomas Park's avatar
Thomas Park committed
743
@thumbnail-caption-color:     @text-color;
Thomas Park's avatar
Thomas Park committed
744
//** Padding around the thumbnail caption
Thomas Park's avatar
Thomas Park committed
745
746
747
@thumbnail-caption-padding:   9px;


Thomas Park's avatar
Thomas Park committed
748
749
750
751
//== Wells
//
//##

Thomas Park's avatar
Thomas Park committed
752
@well-bg:                     @jumbotron-bg;
Thomas Park's avatar
Thomas Park committed
753
@well-border:                 darken(@well-bg, 7%);
Thomas Park's avatar
Thomas Park committed
754
755


Thomas Park's avatar
Thomas Park committed
756
757
758
759
//== Badges
//
//##

Thomas Park's avatar
Thomas Park committed
760
@badge-color:                 #777;
Thomas Park's avatar
Thomas Park committed
761
//** Linked badge text color on hover
Thomas Park's avatar
Thomas Park committed
762
763
764
@badge-link-hover-color:      #fff;
@badge-bg:                    @btn-default-bg;

Thomas Park's avatar
Thomas Park committed
765
//** Badge text color in active nav link
Thomas Park's avatar
Thomas Park committed
766
@badge-active-color:          @link-color;
Thomas Park's avatar
Thomas Park committed
767
//** Badge background color in active nav link
Thomas Park's avatar
Thomas Park committed
768
769
770
771
772
773
774
@badge-active-bg:             #fff;

@badge-font-weight:           bold;
@badge-line-height:           1;
@badge-border-radius:         10px;


Thomas Park's avatar
Thomas Park committed
775
776
777
778
779
780
781
782
783
784
785
786
787
788
//== Breadcrumbs
//
//##

@breadcrumb-padding-vertical:   8px;
@breadcrumb-padding-horizontal: 15px;
//** Breadcrumb background color
@breadcrumb-bg:                 #f5f5f5;
//** Breadcrumb text color
@breadcrumb-color:              @gray-light;
//** Text color of current page in the breadcrumb
@breadcrumb-active-color:       @gray-dark;
//** Textual separator for between breadcrumb elements
@breadcrumb-separator:          "/";
Thomas Park's avatar
Thomas Park committed
789
790


Thomas Park's avatar
Thomas Park committed
791
792
793
//== Carousel
//
//##
Thomas Park's avatar
Thomas Park committed
794
795
796
797
798
799
800
801
802
803
804
805
806
807

@carousel-text-shadow:                        0 1px 2px rgba(0,0,0,.6);

@carousel-control-color:                      #fff;
@carousel-control-width:                      15%;
@carousel-control-opacity:                    .5;
@carousel-control-font-size:                  20px;

@carousel-indicator-active-bg:                #fff;
@carousel-indicator-border-color:             #fff;

@carousel-caption-color:                      #fff;


Thomas Park's avatar
Thomas Park committed
808
809
810
811
//== Close
//
//##

Thomas Park's avatar
Thomas Park committed
812
@close-font-weight:           bold;
813
@close-color:                 #fff;
Thomas Park's avatar
Thomas Park committed
814
815
816
@close-text-shadow:           0 1px 0 #fff;


Thomas Park's avatar
Thomas Park committed
817
818
819
820
//== Code
//
//##

Thomas Park's avatar
Thomas Park committed
821
822
823
@code-color:                  #c7254e;
@code-bg:                     #f9f2f4;

Thomas Park's avatar
Thomas Park committed
824
825
826
@kbd-color:                   #fff;
@kbd-bg:                      #333;

Thomas Park's avatar
Thomas Park committed
827
828
829
830
831
@pre-bg:                      #f5f5f5;
@pre-color:                   @gray-dark;
@pre-border-color:            #ccc;
@pre-scrollable-max-height:   340px;

Thomas Park's avatar
Thomas Park committed
832
833
834
835
836

//== Type
//
//##

Thomas Park's avatar
Thomas Park committed
837
838
//** Horizontal offset for forms and lists.
@component-offset-horizontal: 180px;
Thomas Park's avatar
Thomas Park committed
839
//** Text muted color
Thomas Park's avatar
Thomas Park committed
840
@text-muted:                  @gray-light;
Thomas Park's avatar
Thomas Park committed
841
//** Abbreviations and acronyms border color
Thomas Park's avatar
Thomas Park committed
842
@abbr-border-color:           @gray-light;
Thomas Park's avatar
Thomas Park committed
843
//** Headings small color
Thomas Park's avatar
Thomas Park committed
844
@headings-small-color:        @gray-light;
Thomas Park's avatar
Thomas Park committed
845
//** Blockquote small color
Thomas Park's avatar
Thomas Park committed
846
@blockquote-small-color:      @gray;
Thomas Park's avatar
Thomas Park committed
847
848
//** Blockquote font size
@blockquote-font-size:        (@font-size-base * 1.25);
Thomas Park's avatar
Thomas Park committed
849
//** Blockquote border color
Thomas Park's avatar
Thomas Park committed
850
@blockquote-border-color:     @hr-border;
Thomas Park's avatar
Thomas Park committed
851
//** Page header border color
Thomas Park's avatar
Thomas Park committed
852
@page-header-border-color:    @hr-border;
Thomas Park's avatar
Thomas Park committed
853
854
//** Width of horizontal description list titles
@dl-horizontal-offset:        @component-offset-horizontal;
Thomas Park's avatar
Thomas Park committed
855
//** Horizontal line color.
Thomas Park's avatar
Thomas Park committed
856
@hr-border:                   #ddd;