bootswatch.less 9.17 KB
Newer Older
Thomas Park's avatar
Thomas Park committed
1
// Spruce 2.2.2
Thomas Park's avatar
Thomas Park committed
2
// Bootswatch
Thomas Park's avatar
Thomas Park committed
3
4
// -----------------------------------------------------

Thomas Park's avatar
Thomas Park committed
5

Thomas Park's avatar
Thomas Park committed
6
7
8
// TYPOGRAPHY
// --------------------------------------------------

9
@import url(//fonts.googleapis.com/css?family=Crete+Round);
Thomas Park's avatar
Thomas Park committed
10

Thomas Park's avatar
Thomas Park committed
11
12
13
14
15
16
17
h1 > small,
h2 > small,
h3 > small,
h4 > small,
h5 > small,
h6 > small,
.muted {
Thomas Park's avatar
Thomas Park committed
18
	color: @headingsColor;
Thomas Park's avatar
Thomas Park committed
19
20
21
	font-family: @baseFontFamily;
}

22
23
.jumbotron h1 {
	font-weight: normal !important;
Thomas Park's avatar
Thomas Park committed
24
25
26
27
28
}

// SCAFFOLDING
// --------------------------------------------------

Thomas Park's avatar
Thomas Park committed
29
.page-header {
30
	border-bottom: none;
Thomas Park's avatar
Thomas Park committed
31
32
33
34
35
36
37
38
39
40
	padding-bottom: 5px;

	h1 {
		margin-bottom: 0;
	}
}

hr {
	border-top: none;
	border-bottom: 2px solid @headingsColor;
Thomas Park's avatar
Thomas Park committed
41
42
43
}

blockquote {
Thomas Park's avatar
Thomas Park committed
44
	border-left: 2px solid @headingsColor;
Thomas Park's avatar
Thomas Park committed
45

Thomas Park's avatar
Thomas Park committed
46
	&.pull-right {
Thomas Park's avatar
Thomas Park committed
47
		border-right: 2px solid @headingsColor;
Thomas Park's avatar
Thomas Park committed
48
	}
Thomas Park's avatar
Thomas Park committed
49

Thomas Park's avatar
Thomas Park committed
50
51
52
53
54
55
56
57
	small {
		color: @blueDark;
	}
}

// NAVBAR
// --------------------------------------------------

58
.navbar {
Thomas Park's avatar
Thomas Park committed
59

60
61
62
63
	.navbar-inner {
		background-image: none;
		.box-shadow(none);
	}
Thomas Park's avatar
Thomas Park committed
64

65
	.brand {
66
		padding: 18px 20px 16px;
Thomas Park's avatar
Thomas Park committed
67
68
69
		font-size: 26px;
		font-family: @headingsFontFamily;
		font-weight: @headingsFontWeight;
70
71
72
73

		&:hover {
			background-color: @navbarLinkBackgroundHover;
		}
74
	}
Thomas Park's avatar
Thomas Park committed
75

76
	.nav > li > a {
77
		padding: 20px 20px 14px;
Thomas Park's avatar
Thomas Park committed
78
79
80
		font-size: 20px;
		font-family: @headingsFontFamily;
		font-weight: @headingsFontWeight;
81
		text-shadow: none;
Thomas Park's avatar
Thomas Park committed
82
	}
Thomas Park's avatar
Thomas Park committed
83

Thomas Park's avatar
Thomas Park committed
84
85
86
87
88
89
	.nav > .active > a,
	.nav > .active > a:hover,
	.nav > .active > a:focus {
		.box-shadow(none);
	}

90
	.navbar-text {
Thomas Park's avatar
Thomas Park committed
91
		margin: 19px 20px 0;
92
		font-size: 20px;
Thomas Park's avatar
Thomas Park committed
93
94
		font-family: @headingsFontFamily;
		font-weight: @headingsFontWeight;
Thomas Park's avatar
Thomas Park committed
95
96
97
98
99
		line-height: inherit;
	}

	.divider-vertical {
		border-color: rgba(0, 0, 0, 0.2);
100
	}
Thomas Park's avatar
Thomas Park committed
101

102
103
104
105
106
107
	.btn-navbar {
		margin-top: 14px;
	}

	.navbar-form, .navbar-search {
		border-color: transparent;
108
		margin-top: 12px;
109
110
		.box-shadow(none);
		line-height: normal;
111
	}
Thomas Park's avatar
Thomas Park committed
112

113
114
115
	.navbar-search .search-query {
		border-color: transparent;
		background-color: rgba(255, 255, 255, 0.4);
116
		line-height: normal;
Thomas Park's avatar
Thomas Park committed
117
		color: @white;
118
	}
Thomas Park's avatar
Thomas Park committed
119

120
121
122
	.dropdown-menu li > a {
		font-family: @headingsFontFamily;
		font-weight: @headingsFontWeight;
123
124
	}

125
126
127
	.nav > li > .dropdown-menu::before,
	.nav > li > .dropdown-menu::after {
		border-bottom: none;
128
	}
129
130
131

	&-inverse {

132
133
134
135
		.navbar-search .search-query {
			color: @gray;
		}

136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
		.dropdown-menu {
			background-color: @navbarInverseLinkBackgroundHover;

			li > a {
				color: @headingsColor;

				&:hover {
					background-color: @navbarInverseBackground;
				}
			}

			.divider {
				border-bottom: 1px solid rgba(0, 0, 0, 0.2);
			}

			.nav-header {
152
				color: @gray;
153
154
155
156
157
			}
		}

	}

Thomas Park's avatar
Thomas Park committed
158
159
}

160
161
162
163
164
@media (max-width: @navbarCollapseWidth) {

	.navbar .nav-collapse {

		.nav li > a {
165
			color: @navbarLinkColor;
166
167

			&:hover {
168
				background-color: @navbarLinkBackgroundHover;
169
170
171
172
173
174
175
176
177
			}
		}	
	}

	.navbar-inverse .nav-collapse {

		.nav li > a:hover {
			background-color: rgba(0, 0, 0, 0.06) !important;
		}
178
	}
179

180
181
182
183
	.nav-collapse .navbar-form,
	.nav-collapse .navbar-search {
		border: none !important;
		.box-shadow(none) !important;
184
185
186
	}
}

Thomas Park's avatar
Thomas Park committed
187
div.subnav {
188

189
	background: @green none;
Thomas Park's avatar
Thomas Park committed
190
	border-color: transparent;
Thomas Park's avatar
Thomas Park committed
191

192
	.nav > li > a {
193
		padding: 12px 12px 10px;
194
195
		border-color: transparent;
		background-color: transparent;
Thomas Park's avatar
Thomas Park committed
196
197
		font-family: @headingsFontFamily;
		font-weight: @headingsFontWeight;
198
		color: @navbarLinkColor;
199
	}
Thomas Park's avatar
Thomas Park committed
200

201
	.nav > li > a:hover,
202
203
	.nav > .active > a,
	.nav > .active > a:hover,
204
205
	.dropdown.open .dropdown-toggle,
	.dropdown.open.active .dropdown-toggle:hover {
206
		background-color: @navbarLinkBackgroundHover;
207
208
		.box-shadow(none);
		border-color: transparent;
209
		color: @white;
Thomas Park's avatar
Thomas Park committed
210
	}
Thomas Park's avatar
Thomas Park committed
211

212
	&.subnav-fixed {
Thomas Park's avatar
Thomas Park committed
213
		top: @navbarHeight;
214
	}
Thomas Park's avatar
Thomas Park committed
215
216
}

Thomas Park's avatar
Thomas Park committed
217
// NAV
Thomas Park's avatar
Thomas Park committed
218
219
// --------------------------------------------------

Thomas Park's avatar
Thomas Park committed
220
.nav {
Thomas Park's avatar
Thomas Park committed
221

Thomas Park's avatar
Thomas Park committed
222
	.nav-header {
223
		color: @headingsColor;
Thomas Park's avatar
Thomas Park committed
224
	}
Thomas Park's avatar
Thomas Park committed
225

226
227
228
229
	.disabled > a,
	.disabled > a:hover {
		background-color: lighten(@green, 10%);
		color: @white;
Thomas Park's avatar
Thomas Park committed
230
231
	}
}
Thomas Park's avatar
Thomas Park committed
232

Thomas Park's avatar
Thomas Park committed
233
.nav-tabs {
234
	
Thomas Park's avatar
Thomas Park committed
235
	border-color: transparent;
Thomas Park's avatar
Thomas Park committed
236

237
238
239
240
241
242
243
244
245
	& > li > a {
		background-color: @green;
		color: @white;

		&:hover {
			background-color: @navbarBackground;
			border-color: transparent;
		}	
	}
Thomas Park's avatar
Thomas Park committed
246

247
248
249
	.active > a,
	.active > a:hover {
		background-color: @navbarBackground;
Thomas Park's avatar
Thomas Park committed
250
		border-color: transparent;
251
		color: @white;
Thomas Park's avatar
Thomas Park committed
252
253
	}

254
255
	&.nav-stacked > li > a {
		border-color: transparent;
Thomas Park's avatar
Thomas Park committed
256

257
258
259
260
		&:hover {
			border-color: transparent;
		}
	}
Thomas Park's avatar
Thomas Park committed
261

262
263
264
	.open .dropdown-toggle,
	.active.open .dropdown-toggle {
		background-color: @navbarBackground;
Thomas Park's avatar
Thomas Park committed
265
	}
Thomas Park's avatar
Thomas Park committed
266
}
Thomas Park's avatar
Thomas Park committed
267

268
.nav-pills {
Thomas Park's avatar
Thomas Park committed
269

270
271
272
	& > li > a {
		background-color: @green;
		color: @white;
Thomas Park's avatar
Thomas Park committed
273

274
275
276
277
278
		&:hover {
			background-color: @navbarBackground;
			border-color: transparent;
		}
	}
Thomas Park's avatar
Thomas Park committed
279

280
281
282
283
284
	.active > a,
	.active > a:hover {
		background-color: @navbarBackground;
		border-color: transparent;
		color: @white;
Thomas Park's avatar
Thomas Park committed
285
	}
Thomas Park's avatar
Thomas Park committed
286

287
288
289
290
	.open .dropdown-toggle,
	.active.open .dropdown-toggle {
		background-color: @navbarBackground;
	}
Thomas Park's avatar
Thomas Park committed
291
292
}

Thomas Park's avatar
Thomas Park committed
293
294
295
296
297
298
299
.tabbable {
	.nav-tabs,
	.nav-tabs > li > a,
	.nav-tabs > li > a:hover,
	.nav-tabs > li.active > a,
	.nav-tabs > li.active > a:hover  {
		border-color: transparent;
Thomas Park's avatar
Thomas Park committed
300
301
302
	}
}

303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
.nav-list {

	.nav-header,
	li > a {
		text-shadow: none;
	}

	li > a:hover {
		background-color: @green;
		color: @white;
	}

	li.active > a,
	li.active > a:hover {
		background-color: @navbarBackground;
		text-shadow: none;
	}

	.divider {
		background-color: transparent;
323
		border-bottom: 1px solid @grayLight;
324
325
326
	}
}

327
.breadcrumb {
328
329

	background-color: @green;
Thomas Park's avatar
Thomas Park committed
330
331
	background-image: none;
	.box-shadow(none);
332
	border-color: transparent;
Thomas Park's avatar
Thomas Park committed
333

334
	li {
335
		color: @white;
336
337
338
		text-shadow: none;

		a {
339
340
			color: @white;
			text-decoration: underline;
341
342
343
		}

		a:hover {
344
			color: @white;
345
346
347
		}

		.divider {
348
			color: @white;
349
		}
Thomas Park's avatar
Thomas Park committed
350
	}
Thomas Park's avatar
Thomas Park committed
351

Thomas Park's avatar
Thomas Park committed
352
	.active {
353
		color: @white;
Thomas Park's avatar
Thomas Park committed
354
	}
355
356
}

Thomas Park's avatar
Thomas Park committed
357
.pagination {
Thomas Park's avatar
Thomas Park committed
358

359
	ul {
360
		background-color: @green;
Thomas Park's avatar
Thomas Park committed
361
362
		background-image: none;
		.box-shadow(none);
363
		border-color: transparent;
Thomas Park's avatar
Thomas Park committed
364
365
	}

366

367
368
	ul > li > a,
	ul > li > span {
369
		background-color: @green;
Thomas Park's avatar
Thomas Park committed
370
		border-color: transparent;
371
		color: @white;
Thomas Park's avatar
Thomas Park committed
372
373

		&:hover {
374
375
			background-color: @navbarBackground;
			color: @white;
Thomas Park's avatar
Thomas Park committed
376
		}
Thomas Park's avatar
Thomas Park committed
377
378
	}

379
380
	ul > .active > a,
	ul > .active > span {
381
382
		background-color: @navbarBackground;
		color: @white;
Thomas Park's avatar
Thomas Park committed
383
	}
Thomas Park's avatar
Thomas Park committed
384

385
	ul > .disabled > a,
386
387
388
	ul > .disabled > a:hover,
	ul > .disabled > span,
	ul > .disabled > span:hover {
389
390
		background-color: lighten(@green, 10%);
		color: @white;
Thomas Park's avatar
Thomas Park committed
391
	}
Thomas Park's avatar
Thomas Park committed
392
393
}

Thomas Park's avatar
Thomas Park committed
394
.pager {
Thomas Park's avatar
Thomas Park committed
395

396
397
	li > a,
	li > span {
Thomas Park's avatar
Thomas Park committed
398
		border: none;
399
400
		background-color: @green;
		color: @white;
Thomas Park's avatar
Thomas Park committed
401

Thomas Park's avatar
Thomas Park committed
402
		&:hover {
403
			background-color: @navbarBackground;
Thomas Park's avatar
Thomas Park committed
404
		}
405
	}
Thomas Park's avatar
Thomas Park committed
406

Thomas Park's avatar
Thomas Park committed
407
408
	.disabled a,
	.disabled a:hover {
409
410
		background-color: lighten(@green, 10%);
		color: @white;
411
	}
Thomas Park's avatar
Thomas Park committed
412
}
Thomas Park's avatar
Thomas Park committed
413

Thomas Park's avatar
Thomas Park committed
414
415
416
417
418
419
420
// BUTTONS
// --------------------------------------------------

.btn {
	font-family: @headingsFontFamily;
	font-weight: @headingsFontWeight;
    text-shadow: none;
Thomas Park's avatar
Thomas Park committed
421
422
}

Thomas Park's avatar
Thomas Park committed
423
424
.btn-large {
	font-size: 18px;
Thomas Park's avatar
Thomas Park committed
425
426
}

Thomas Park's avatar
Thomas Park committed
427
428
.btn-group .dropdown-toggle {
	.box-shadow(none);
Thomas Park's avatar
Thomas Park committed
429
430
}

Thomas Park's avatar
Thomas Park committed
431
432
// TABLES
// --------------------------------------------------
Thomas Park's avatar
Thomas Park committed
433

Thomas Park's avatar
Thomas Park committed
434
435
.table th,
.table-striped tbody tr:nth-child(odd) th {
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
	background-color: @green;
	color: @white;
}

.table {

	tbody tr.success td {
		background-color: #B5EEAA;
	}

	tbody tr.error td {
		background-color: #EEB8B8;
	}

	tbody tr.info td {
		background-color: #AEE2EE;
	}
Thomas Park's avatar
Thomas Park committed
453
454
455
456
457
458
}

// FORMS
// --------------------------------------------------

legend {
459
	border-bottom: none;
Thomas Park's avatar
Thomas Park committed
460
461
	font-family: @headingsFontFamily;
	font-weight: @headingsFontWeight;
Thomas Park's avatar
Thomas Park committed
462
	color: @headingsColor;
Thomas Park's avatar
Thomas Park committed
463
464
465
}

label, .help-block, input[type="file"] {
Thomas Park's avatar
Thomas Park committed
466
	color: @headingsColor;
Thomas Park's avatar
Thomas Park committed
467
468
469
470
471
472
473
474
475
476
477
478
479
480
}

input, textarea, select {
	color: @textColor;
}

.uneditable-input {
	color: @gray;
}

.form-actions {
	border-top: none;
}

481
482
483
484
485
486
487
488
489
490
491
492
.control-group {

	&.warning,
	&.error,
	&.success {

		.control-label {
			color: @textColor;
		}
	}
}

493
494
.control-group.error {

495
496
	.help-block,
	.help-inline {
497
		color: @red;
498
499
500
	}

	input, select, textarea {
501
		border: 1px solid @red;
502
503
504
505
506
507
		color: @textColor;
	}
}

.control-group.success {

508
509
	.help-block,
	.help-inline {
510
		color: @green;
511
512
513
	}

	input, select, textarea {
514
		border: 1px solid @green;
515
516
517
518
519
520
		color: @textColor;
	}
}

.control-group.warning {

521
522
	.help-block,
	.help-inline {
523
		color: @orange;
524
525
526
	}

	input, select, textarea {
527
		border: 1px solid @orange;
528
529
530
531
		color: @textColor;
	}
}

Thomas Park's avatar
Thomas Park committed
532
// ALERTS, LABELS, BADGES
Thomas Park's avatar
Thomas Park committed
533
534
535
536
537
// --------------------------------------------------

.alert {
	text-shadow: none;
	border: none;
538
539
540
541
542

	h1, h2, h3, h4, h5, h6 {
		font-weight: bold;
		color: @white;
	}
Thomas Park's avatar
Thomas Park committed
543
544
}

Thomas Park's avatar
Thomas Park committed
545
546
547
548
549
.alert-heading {
	font-family: @baseFontFamily;
	color: inherit;
}

Thomas Park's avatar
Thomas Park committed
550
.badge,
Thomas Park's avatar
Thomas Park committed
551
.label {
Thomas Park's avatar
Thomas Park committed
552

553
	background-color: @green;
Thomas Park's avatar
Thomas Park committed
554
	text-shadow: none;
Thomas Park's avatar
Thomas Park committed
555
556

	&-success {
557
		background-color: @btnSuccessBackground;
Thomas Park's avatar
Thomas Park committed
558
559
560
	}

	&-warning {
561
		background-color: @btnWarningBackground;
Thomas Park's avatar
Thomas Park committed
562
563
564
	}

	&-important {
565
		background-color: @btnDangerBackground;
Thomas Park's avatar
Thomas Park committed
566
567
568
	}

	&-info {
569
		background-color: @btnInfoBackground;
Thomas Park's avatar
Thomas Park committed
570
571
572
	}

	&-inverse {
573
		background-color: @btnInverseBackground;
Thomas Park's avatar
Thomas Park committed
574
	}
Thomas Park's avatar
Thomas Park committed
575
576
}

Thomas Park's avatar
Thomas Park committed
577
578
// MISC
// --------------------------------------------------
Thomas Park's avatar
Thomas Park committed
579
580
581
582
583
584

.well {
	border: none;
	.box-shadow(none);
}

585
586
587
588
.hero-unit {
	border: none;
}

Thomas Park's avatar
Thomas Park committed
589
590
591
592
593
.thumbnail {
	border: none;
	.box-shadow(none);
}

594
595
596
597
598
599
600
601
602
603
604
.dropdown-menu .nav-header {
	color: @white;
	text-shadow: none;
}

.dropdown-menu li > a:hover,
.dropdown-menu li > a:focus,
.dropdown-submenu:hover > a {
	background-image: none;
}

Thomas Park's avatar
Thomas Park committed
605
.progress {
606
	background-color: darken(@grayLighter, 10%);
Thomas Park's avatar
Thomas Park committed
607
	background-image: none;
Thomas Park's avatar
Thomas Park committed
608
609
}

610
611
612
613
614
[class^="icon-"],
[class*=" icon-"] {
	vertical-align: baseline;
}

Thomas Park's avatar
Thomas Park committed
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
.modal {

	&-header {
		padding: 12px 15px 6px;
		background-color: @green;
	}

	&-body,
	&-footer {
		background-color: @headingsColor;
		border: none;
		.box-shadow(none);

		label {
			color: @textColor;
		}
	}
Thomas Park's avatar
Thomas Park committed
632
}
Thomas Park's avatar
Thomas Park committed
633

634
635
636
637
638
639
640
.popover {

	&-title {
		color: @white;
	}
}

Thomas Park's avatar
Thomas Park committed
641
642
// MEDIA QUERIES
// --------------------------------------------------