bootswatch.less 9.25 KB
Newer Older
Thomas Park's avatar
Thomas Park committed
1
// Bootswatch.less
Thomas Park's avatar
Thomas Park committed
2
// Swatch: Spruce
Thomas Park's avatar
Thomas Park committed
3
// Version: 2.1.0
Thomas Park's avatar
Thomas Park committed
4
5
6
7
8
// -----------------------------------------------------

// TYPOGRAPHY
// --------------------------------------------------

Thomas Park's avatar
Thomas Park committed
9
@import url('https://fonts.googleapis.com/css?family=Josefin+Slab:400,700');
Thomas Park's avatar
Thomas Park committed
10

Thomas Park's avatar
Thomas Park committed
11
12
13
14
15
16
17
18
19
20
h1 {
	font-size: 54px;
	line-height: 1.2em;
	color: @yellow;
}

h2 { font-size: 48px; }
h3 { font-size: 36px; }
h4 { font-size: 24px; }
h5 { font-size: 20px; }
Thomas Park's avatar
Thomas Park committed
21

Thomas Park's avatar
Thomas Park committed
22
23
24
25
26
27
28
h1 > small,
h2 > small,
h3 > small,
h4 > small,
h5 > small,
h6 > small,
.muted {
Thomas Park's avatar
Thomas Park committed
29
	color: @headingsColor;
Thomas Park's avatar
Thomas Park committed
30
31
32
	font-family: @baseFontFamily;
}

Thomas Park's avatar
Thomas Park committed
33
34
35
code, pre {
	color: lighten(@blueDark, 10%);
	background-color: @headingsColor;
Thomas Park's avatar
Thomas Park committed
36
37
38
39
40
}

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

Thomas Park's avatar
Thomas Park committed
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
// body {
// 	#gradient > .vertical-three-colors (#90A38F, #AEAD8E, 60%, #90A38F);
// 	background-size: 100% 1400px;
// 	background-repeat: repeat-y;
// }

.page-header {
	border-bottom: 2px solid @headingsColor;
	padding-bottom: 5px;

	h1 {
		margin-bottom: 0;
	}
}

hr {
	border-top: none;
	border-bottom: 2px solid @headingsColor;
Thomas Park's avatar
Thomas Park committed
59
60
61
}

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

Thomas Park's avatar
Thomas Park committed
64
	&.pull-right {
Thomas Park's avatar
Thomas Park committed
65
		border-right: 2px solid @headingsColor;
Thomas Park's avatar
Thomas Park committed
66
	}
Thomas Park's avatar
Thomas Park committed
67

Thomas Park's avatar
Thomas Park committed
68
69
70
71
72
73
74
75
	small {
		color: @blueDark;
	}
}

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

76
.navbar {
Thomas Park's avatar
Thomas Park committed
77

78
79
80
81
	.navbar-inner {
		background-image: none;
		.box-shadow(none);
	}
Thomas Park's avatar
Thomas Park committed
82

83
84
	.brand {
		padding: 18px 20px 12px;
Thomas Park's avatar
Thomas Park committed
85
86
87
		font-size: 26px;
		font-family: @headingsFontFamily;
		font-weight: @headingsFontWeight;
88
	}
Thomas Park's avatar
Thomas Park committed
89

90
	.nav > li > a {
Thomas Park's avatar
Thomas Park committed
91
		padding: 20px 20px 10px;
Thomas Park's avatar
Thomas Park committed
92
93
94
		font-size: 20px;
		font-family: @headingsFontFamily;
		font-weight: @headingsFontWeight;
95
	}
Thomas Park's avatar
Thomas Park committed
96

97
98
	.nav .active > a,
	.nav .active > a:hover {
Thomas Park's avatar
Thomas Park committed
99
100
		color: @yellow;
	}
Thomas Park's avatar
Thomas Park committed
101

Thomas Park's avatar
Thomas Park committed
102
103
104
105
106
107
	.nav > .active > a,
	.nav > .active > a:hover,
	.nav > .active > a:focus {
		.box-shadow(none);
	}

108
	.navbar-text {
Thomas Park's avatar
Thomas Park committed
109
		margin: 19px 20px 0;
110
		font-size: 20px;
Thomas Park's avatar
Thomas Park committed
111
112
		font-family: @headingsFontFamily;
		font-weight: @headingsFontWeight;
Thomas Park's avatar
Thomas Park committed
113
114
115
116
117
		line-height: inherit;
	}

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

120
121
122
	.navbar-search {
		margin-top: 12px;
	}
Thomas Park's avatar
Thomas Park committed
123

124
125
126
	.navbar-search .search-query {
		border-color: transparent;
		background-color: rgba(255, 255, 255, 0.4);
Thomas Park's avatar
Thomas Park committed
127
		color: @white;
128
	}
Thomas Park's avatar
Thomas Park committed
129

130
131
132
	.nav > .open > a {
		color: @yellow;
	}
Thomas Park's avatar
Thomas Park committed
133

134
	.nav > .open > .dropdown-menu {
Thomas Park's avatar
Thomas Park committed
135
		background-color: @headingsColor;
136
137
138
		color: @textColor;
		border-color: transparent;
	}
Thomas Park's avatar
Thomas Park committed
139

140
141
	.nav > .open > .dropdown-menu a:hover {
		background-color: darken(#90A38F, 10%);
Thomas Park's avatar
Thomas Park committed
142
		color: @headingsColor;
143
	}
Thomas Park's avatar
Thomas Park committed
144

145
146
147
148
149
	.btn-navbar {
		margin-top: 14px;
	}

	.nav-collapse.in .nav li > a {
Thomas Park's avatar
Thomas Park committed
150
		color: @headingsColor;
151
152
153
154
155
156
157
158
159
160
161

		&:hover {
			color: @yellow;
			background-color: @blue;
		}
	}

	.navbar-form, .navbar-search {
		border-color: transparent;
		.box-shadow(none);
	}
Thomas Park's avatar
Thomas Park committed
162
163
164
165
166
167
168
}

div.subnav {
	background-color: @green;
	background-image: none;
	border-color: transparent;
	.box-shadow(0 1px 5px rgba(0,0,0,.1));
Thomas Park's avatar
Thomas Park committed
169
	font-size: 18px;
Thomas Park's avatar
Thomas Park committed
170

171
	.nav > li > a {
172
		padding: 13px 12px 9px;
173
174
		border-color: transparent;
		background-color: transparent;
Thomas Park's avatar
Thomas Park committed
175
176
		font-family: @headingsFontFamily;
		font-weight: @headingsFontWeight;
Thomas Park's avatar
Thomas Park committed
177
		color: @headingsColor;
178
	}
Thomas Park's avatar
Thomas Park committed
179

180
181
182
	.nav > li + li > a {
		border-color: transparent;
	}
Thomas Park's avatar
Thomas Park committed
183

184
185
186
187
188
189
190
191
192
193
	.nav > li.active > a,
	.nav > li > a:hover,
	.nav > li.active > a:hover,
	.dropdown.open .dropdown-toggle,
	.dropdown.open.active .dropdown-toggle:hover {
		.box-shadow(none);
		background-color: transparent;
		border-color: transparent;
		color: @yellow;
	}
Thomas Park's avatar
Thomas Park committed
194

195
	.dropdown.open > .dropdown-menu {
Thomas Park's avatar
Thomas Park committed
196
		background-color: @headingsColor;
197
198
199
		color: @textColor;
		border-color: transparent;
	}
Thomas Park's avatar
Thomas Park committed
200

201
202
	.dropdown.open > .dropdown-menu a:hover {
		background-color: darken(#90A38F, 10%);
Thomas Park's avatar
Thomas Park committed
203
		color: @headingsColor;
Thomas Park's avatar
Thomas Park committed
204
	}
Thomas Park's avatar
Thomas Park committed
205

206
	&.subnav-fixed {
Thomas Park's avatar
Thomas Park committed
207
		top: @navbarHeight;
208
	}
Thomas Park's avatar
Thomas Park committed
209
210
}

Thomas Park's avatar
Thomas Park committed
211
// NAV
Thomas Park's avatar
Thomas Park committed
212
213
// --------------------------------------------------

Thomas Park's avatar
Thomas Park committed
214
215
.nav {
	.disabled > a {
Thomas Park's avatar
Thomas Park committed
216

Thomas Park's avatar
Thomas Park committed
217
		color: #ccc;
Thomas Park's avatar
Thomas Park committed
218

Thomas Park's avatar
Thomas Park committed
219
220
221
222
		&:hover {
			background-color: #748C73;
		}
	}
Thomas Park's avatar
Thomas Park committed
223
224
}

Thomas Park's avatar
Thomas Park committed
225
.nav-list {
Thomas Park's avatar
Thomas Park committed
226

Thomas Park's avatar
Thomas Park committed
227
228
229
230
	li > a,
	.nav-header {
		text-shadow: none;
	}
Thomas Park's avatar
Thomas Park committed
231

Thomas Park's avatar
Thomas Park committed
232
233
234
	li > a:hover {
		background-color: transparent;
	}
Thomas Park's avatar
Thomas Park committed
235

Thomas Park's avatar
Thomas Park committed
236
237
238
239
240
	li.active > a,
	li.active > a:hover {
		background-color: #A2CDB5;
		text-shadow: none;
	}
Thomas Park's avatar
Thomas Park committed
241

Thomas Park's avatar
Thomas Park committed
242
243
244
245
246
	.divider {
		background-color: transparent;
		border-bottom: 1px solid @headingsColor;
	}
}
Thomas Park's avatar
Thomas Park committed
247

Thomas Park's avatar
Thomas Park committed
248
.nav-tabs {
Thomas Park's avatar
Thomas Park committed
249
	border-color: transparent;
Thomas Park's avatar
Thomas Park committed
250
251
252
253
254
}

.nav-tabs > li > a,
.nav-pills > li > a {
	background-color: #748C73;
Thomas Park's avatar
Thomas Park committed
255

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

Thomas Park's avatar
Thomas Park committed
262
263
264
265
266
267
268
.nav-tabs > .active > a,
.nav-tabs > .active > a:hover,
.nav-pills .active > a,
.nav-pills .active > a:hover {
	background-color: #A2CDB5;
	border-color: transparent;
	color: @blue;
Thomas Park's avatar
Thomas Park committed
269
270
}

Thomas Park's avatar
Thomas Park committed
271
272
.nav-tabs.nav-stacked > li > a {
	border-color: transparent;
Thomas Park's avatar
Thomas Park committed
273

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

Thomas Park's avatar
Thomas Park committed
279
280
281
282
283
.nav-tabs .open .dropdown-toggle,
.nav-pills .open .dropdown-toggle  {
	background-color: #748C73;
	border-color: transparent;
	color: @yellow;
Thomas Park's avatar
Thomas Park committed
284
}
Thomas Park's avatar
Thomas Park committed
285

Thomas Park's avatar
Thomas Park committed
286
287
288
.nav-tabs .active.open .dropdown-toggle,
.nav-pills .active.open .dropdown-toggle {
	background-color: #A2CDB5;
Thomas Park's avatar
Thomas Park committed
289
}
Thomas Park's avatar
Thomas Park committed
290

Thomas Park's avatar
Thomas Park committed
291
292
293
294
295
.nav-tabs .dropdown-menu,
.nav-pills .dropdown-menu {
	background-color: @headingsColor;
	color: @textColor;
	border-color: transparent;
Thomas Park's avatar
Thomas Park committed
296

Thomas Park's avatar
Thomas Park committed
297
298
299
300
	a:hover {
		background-color: #A2CDB5;
		color: @headingsColor;
	}
Thomas Park's avatar
Thomas Park committed
301
302
}

Thomas Park's avatar
Thomas Park committed
303
304
.nav .nav-header {
	color: @blue;
Thomas Park's avatar
Thomas Park committed
305
306
}

Thomas Park's avatar
Thomas Park committed
307
308
309
310
311
312
313
.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
314
315
316
	}
}

317
.breadcrumb {
Thomas Park's avatar
Thomas Park committed
318
319
320
321
	background-color: darken(#90A38F, 10%);
	background-image: none;
	border-color: transparent;
	.box-shadow(none);
Thomas Park's avatar
Thomas Park committed
322

323
	li {
Thomas Park's avatar
Thomas Park committed
324
		color: @yellow;
325
326
327
		text-shadow: none;

		a {
Thomas Park's avatar
Thomas Park committed
328
			color: @yellow;
329
330
331
332
333
334
335
		}

		a:hover {
			color: @yellow;
		}

		.divider {
Thomas Park's avatar
Thomas Park committed
336
			color: @headingsColor;
337
		}
Thomas Park's avatar
Thomas Park committed
338
	}
Thomas Park's avatar
Thomas Park committed
339

Thomas Park's avatar
Thomas Park committed
340
341
342
	.active {
		color: @headingsColor;
	}
343
344
}

Thomas Park's avatar
Thomas Park committed
345
.pagination {
Thomas Park's avatar
Thomas Park committed
346

Thomas Park's avatar
Thomas Park committed
347
348
349
350
351
352
353
354
	& > ul {
		background-color: darken(#90A38F, 10%);
		background-image: none;
		border-color: transparent;
		.box-shadow(none);
	}

	a {
Thomas Park's avatar
Thomas Park committed
355
		color: @yellow;
Thomas Park's avatar
Thomas Park committed
356
357
358
359
360
361
		border-color: transparent;

		&:hover {
			color: @yellow;
			background-color: rgba(0, 0, 0, 0.1);
		}
Thomas Park's avatar
Thomas Park committed
362
363
	}

Thomas Park's avatar
Thomas Park committed
364
365
366
367
	.active a {
		color: @headingsColor;
		background-color: rgba(0, 0, 0, 0.1);
	}
Thomas Park's avatar
Thomas Park committed
368

Thomas Park's avatar
Thomas Park committed
369
370
371
372
	.disabled a,
	.disabled a:hover {
		color: @blue;
	}
Thomas Park's avatar
Thomas Park committed
373
374
}

Thomas Park's avatar
Thomas Park committed
375
.pager {
Thomas Park's avatar
Thomas Park committed
376

Thomas Park's avatar
Thomas Park committed
377
378
379
	a {
		border: none;
		background-color: #748C73;
Thomas Park's avatar
Thomas Park committed
380

Thomas Park's avatar
Thomas Park committed
381
382
383
		&:hover {
			background-color: #687D67;
		}
384
	}
Thomas Park's avatar
Thomas Park committed
385

Thomas Park's avatar
Thomas Park committed
386
387
388
389
	.disabled a,
	.disabled a:hover {
		background-color: #748C73;
		color: @textColor;
390
	}
Thomas Park's avatar
Thomas Park committed
391
}
Thomas Park's avatar
Thomas Park committed
392

Thomas Park's avatar
Thomas Park committed
393
394
395
396
397
398
399
400
401
402
403
404
405
406
// BUTTONS
// --------------------------------------------------

.btn {
	.buttonBackground(lighten(@blueDark, 5%), @blueDark);
	font-family: @headingsFontFamily;
	font-weight: @headingsFontWeight;
    color: @white;
    text-shadow: none;
	border-color: transparent;
	.box-shadow(none);

	&:hover {
		color: @grayLighter;
407
	}
Thomas Park's avatar
Thomas Park committed
408
409
}

Thomas Park's avatar
Thomas Park committed
410
411
.btn-large {
	font-size: 18px;
Thomas Park's avatar
Thomas Park committed
412
413
}

Thomas Park's avatar
Thomas Park committed
414
415
416
.btn-primary {
	.buttonBackground(lighten(@blue, 10%), lighten(@blue, 5%));
}
Thomas Park's avatar
Thomas Park committed
417

Thomas Park's avatar
Thomas Park committed
418
419
.btn-warning {
  .buttonBackground(@orange, darken(@orange, 5%));
Thomas Park's avatar
Thomas Park committed
420
421
}

Thomas Park's avatar
Thomas Park committed
422
423
.btn-danger {
  .buttonBackground(lighten(@red, 5%), @red);
Thomas Park's avatar
Thomas Park committed
424
425
}

Thomas Park's avatar
Thomas Park committed
426
427
428
.btn-success {
  .buttonBackground(#62c462, #51a351);
}
Thomas Park's avatar
Thomas Park committed
429

Thomas Park's avatar
Thomas Park committed
430
431
.btn-info {
  .buttonBackground(#5bc0de, #2f96b4);
Thomas Park's avatar
Thomas Park committed
432
433
}

Thomas Park's avatar
Thomas Park committed
434
435
.btn-inverse {
  .buttonBackground(@yellow, darken(@yellow, 5%));
Thomas Park's avatar
Thomas Park committed
436
437
}

Thomas Park's avatar
Thomas Park committed
438
439
.btn-group .dropdown-toggle {
	.box-shadow(none);
Thomas Park's avatar
Thomas Park committed
440
441
}

Thomas Park's avatar
Thomas Park committed
442
443
// TABLES
// --------------------------------------------------
Thomas Park's avatar
Thomas Park committed
444

Thomas Park's avatar
Thomas Park committed
445
446
447
448
.table,
.table.table-bordered,
.table.table-striped {
	.border-radius(0 0 8px 8px);
Thomas Park's avatar
Thomas Park committed
449
450
}

Thomas Park's avatar
Thomas Park committed
451
452
453
454
455
.table-bordered thead:first-child tr:first-child th:first-child,
.table-bordered tbody:first-child tr:first-child td:first-child,
.table-bordered thead:first-child tr:first-child th:last-child,
.table-bordered tbody:first-child tr:first-child td:last-child {
	.border-radius(0);
Thomas Park's avatar
Thomas Park committed
456
457
}

Thomas Park's avatar
Thomas Park committed
458
459
.table-striped tbody:last-child tr:last-child td:first-child {
	.border-radius(0 0 0 8px);
Thomas Park's avatar
Thomas Park committed
460
461
}

Thomas Park's avatar
Thomas Park committed
462
463
464
.table-striped tbody:last-child tr:last-child td:last-child {
	.border-radius(0 0 8px 0);
}
Thomas Park's avatar
Thomas Park committed
465

Thomas Park's avatar
Thomas Park committed
466
467
468
.table-bordered {
	border: none;
}
Thomas Park's avatar
Thomas Park committed
469

Thomas Park's avatar
Thomas Park committed
470
471
472
473
.table thead tr th:first-child,
.table tbody tr td:first-child {
	border-left: none;
}
Thomas Park's avatar
Thomas Park committed
474

Thomas Park's avatar
Thomas Park committed
475
476
477
478
.table th,
.table-striped tbody tr:nth-child(odd) th {
	background-color: darken(#90A38F, 10%);
	color: @headingsColor;
Thomas Park's avatar
Thomas Park committed
479
480
481
482
483
484
}

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

legend {
Thomas Park's avatar
Thomas Park committed
485
486
	font-family: @headingsFontFamily;
	font-weight: @headingsFontWeight;
Thomas Park's avatar
Thomas Park committed
487
	color: @headingsColor;
Thomas Park's avatar
Thomas Park committed
488
489
490
}

label, .help-block, input[type="file"] {
Thomas Park's avatar
Thomas Park committed
491
	color: @headingsColor;
Thomas Park's avatar
Thomas Park committed
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
}

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

.uneditable-input {
	color: @gray;
}

legend {
	border-bottom: 2px solid @white;
}

.form-actions {
	border-top: none;
	.border-radius(4px);
}

Thomas Park's avatar
Thomas Park committed
511
// ALERTS, LABELS, BADGES
Thomas Park's avatar
Thomas Park committed
512
513
514
515
516
517
518
// --------------------------------------------------

.alert {
	text-shadow: none;
	border: none;
}

Thomas Park's avatar
Thomas Park committed
519
520
521
522
523
.alert-heading {
	font-family: @baseFontFamily;
	color: inherit;
}

Thomas Park's avatar
Thomas Park committed
524
.badge,
Thomas Park's avatar
Thomas Park committed
525
.label {
Thomas Park's avatar
Thomas Park committed
526
527

	background-color: @blue;
Thomas Park's avatar
Thomas Park committed
528
	text-shadow: none;
Thomas Park's avatar
Thomas Park committed
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548

	&-success {
		background-color: @successBackground;
	}

	&-warning {
		background-color: @warningBackground;
	}

	&-important {
		background-color: @errorBackground;
	}

	&-info {
		background-color: @infoBackground;
	}

	&-inverse {
		background-color: @yellow;
	}
Thomas Park's avatar
Thomas Park committed
549
550
}

Thomas Park's avatar
Thomas Park committed
551
552
// MISC
// --------------------------------------------------
Thomas Park's avatar
Thomas Park committed
553
554
555
556
557
558
559
560
561

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

.thumbnail {
	border: none;
	.box-shadow(none);
Thomas Park's avatar
Thomas Park committed
562

Thomas Park's avatar
Thomas Park committed
563
564
565
566
567
	img {
		.border-radius(4px);
	}
}

Thomas Park's avatar
Thomas Park committed
568
569
570
.progress {
	background-color: darken(#90A38F, 10%);
	background-image: none;
Thomas Park's avatar
Thomas Park committed
571
572
}

Thomas Park's avatar
Thomas Park committed
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
.modal {

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

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

		label {
			color: @textColor;
		}
	}

	&-footer {
		.border-radius(0 0 4px 4px);
	}
Thomas Park's avatar
Thomas Park committed
594
}
Thomas Park's avatar
Thomas Park committed
595
596
597

// MEDIA QUERIES
// --------------------------------------------------