less-rails-bootswatch 0.3.0 → 0.3.1

Sign up to get free protection for your applications and to get access to all the features.
@@ -3,6 +3,12 @@
3
3
  // Version: 2.1.0
4
4
  // -----------------------------------------------------
5
5
 
6
+ // TYPOGRAPHY
7
+ // -----------------------------------------------------
8
+
9
+ // SCAFFOLDING
10
+ // -----------------------------------------------------
11
+
6
12
  // NAVBAR
7
13
  // -----------------------------------------------------
8
14
 
@@ -124,6 +130,9 @@ div.subnav {
124
130
  }
125
131
  }
126
132
 
133
+ // NAV
134
+ // -----------------------------------------------------
135
+
127
136
  .nav > li.dropdown > .dropdown-toggle,
128
137
  .nav > li.dropdown.active > .dropdown-toggle,
129
138
  .nav > li.dropdown.open > .dropdown-toggle,
@@ -141,7 +150,7 @@ div.subnav {
141
150
  }
142
151
  }
143
152
 
144
- // BUTTON
153
+ // BUTTONS
145
154
  // -----------------------------------------------------
146
155
 
147
156
  .btn {
@@ -183,22 +192,29 @@ div.subnav {
183
192
  .buttonBackground(lighten(@purple, 5%), @purple);
184
193
  }
185
194
 
195
+ // TABLES
196
+ // -----------------------------------------------------
186
197
 
187
198
  // FORMS
188
199
  // -----------------------------------------------------
189
200
 
190
201
  .control-group.warning {
191
- .formFieldState(#E29235, #E29235, @warningBackground);
202
+ .formFieldState(#E29235, #E29235, @warningBackground);
192
203
  }
193
204
 
194
205
  .control-group.error {
195
- .formFieldState(#C00, #C00, @errorBackground);
206
+ .formFieldState(#C00, #C00, @errorBackground);
196
207
  }
197
208
 
198
209
  .control-group.success {
199
- .formFieldState(#2BA949, #2BA949, @successBackground);
210
+ .formFieldState(#2BA949, #2BA949, @successBackground);
200
211
  }
201
212
 
213
+ // DROPDOWNS
214
+ // -----------------------------------------------------
215
+
216
+ // ALERTS, LABELS, BADGES
217
+ // -----------------------------------------------------
202
218
 
203
219
  // MISC
204
220
  // -----------------------------------------------------
@@ -211,4 +227,7 @@ div.subnav {
211
227
  .hero-unit {
212
228
  .box-shadow(inset 0 1px 1px rgba(0,0,0,.05));
213
229
  border: 1px solid rgba(0,0,0,.05);
214
- }
230
+ }
231
+
232
+ // MEDIA QUERIES
233
+ // -----------------------------------------------------
@@ -8,14 +8,6 @@
8
8
 
9
9
  @import url('https://fonts.googleapis.com/css?family=Josefin+Slab:400,700');
10
10
 
11
- .navbar .brand, legend, .btn,
12
- .navbar .nav > li > a,
13
- div.subnav li > a,
14
- .navbar-text {
15
- font-family: @headingsFontFamily;
16
- font-weight: @headingsFontWeight;
17
- }
18
-
19
11
  h1 {
20
12
  font-size: 54px;
21
13
  line-height: 1.2em;
@@ -27,23 +19,43 @@ h3 { font-size: 36px; }
27
19
  h4 { font-size: 24px; }
28
20
  h5 { font-size: 20px; }
29
21
 
30
- h1 > small, h2 > small, h3 > small, h4 > small, h5 > small, h6 > small, .muted {
22
+ h1 > small,
23
+ h2 > small,
24
+ h3 > small,
25
+ h4 > small,
26
+ h5 > small,
27
+ h6 > small,
28
+ .muted {
31
29
  color: @headingsColor;
32
30
  font-family: @baseFontFamily;
33
31
  }
34
32
 
35
- .alert-heading {
36
- font-family: @baseFontFamily;
37
- color: inherit;
33
+ code, pre {
34
+ color: lighten(@blueDark, 10%);
35
+ background-color: @headingsColor;
38
36
  }
39
37
 
40
38
  // SCAFFOLDING
41
39
  // --------------------------------------------------
42
40
 
43
- body {
44
- // #gradient > .vertical-three-colors (#90A38F, #AEAD8E, 60%, #90A38F);
45
- background-size: 100% 1400px;
46
- background-repeat: repeat-y;
41
+ // body {
42
+ // #gradient > .vertical-three-colors (#90A38F, #AEAD8E, 60%, #90A38F);
43
+ // background-size: 100% 1400px;
44
+ // background-repeat: repeat-y;
45
+ // }
46
+
47
+ .page-header {
48
+ border-bottom: 2px solid @headingsColor;
49
+ padding-bottom: 5px;
50
+
51
+ h1 {
52
+ margin-bottom: 0;
53
+ }
54
+ }
55
+
56
+ hr {
57
+ border-top: none;
58
+ border-bottom: 2px solid @headingsColor;
47
59
  }
48
60
 
49
61
  blockquote {
@@ -58,11 +70,6 @@ blockquote {
58
70
  }
59
71
  }
60
72
 
61
- code, pre {
62
- color: lighten(@blueDark, 10%);
63
- background-color: @headingsColor;
64
- }
65
-
66
73
  // NAVBAR
67
74
  // --------------------------------------------------
68
75
 
@@ -74,13 +81,17 @@ code, pre {
74
81
  }
75
82
 
76
83
  .brand {
77
- font-size: 26px;
78
84
  padding: 18px 20px 12px;
85
+ font-size: 26px;
86
+ font-family: @headingsFontFamily;
87
+ font-weight: @headingsFontWeight;
79
88
  }
80
89
 
81
90
  .nav > li > a {
82
- font-size: 20px;
83
91
  padding: 20px 20px 10px;
92
+ font-size: 20px;
93
+ font-family: @headingsFontFamily;
94
+ font-weight: @headingsFontWeight;
84
95
  }
85
96
 
86
97
  .nav .active > a,
@@ -97,6 +108,8 @@ code, pre {
97
108
  .navbar-text {
98
109
  margin: 19px 20px 0;
99
110
  font-size: 20px;
111
+ font-family: @headingsFontFamily;
112
+ font-weight: @headingsFontWeight;
100
113
  line-height: inherit;
101
114
  }
102
115
 
@@ -159,6 +172,8 @@ div.subnav {
159
172
  padding: 13px 12px 9px;
160
173
  border-color: transparent;
161
174
  background-color: transparent;
175
+ font-family: @headingsFontFamily;
176
+ font-weight: @headingsFontWeight;
162
177
  color: @headingsColor;
163
178
  }
164
179
 
@@ -193,103 +208,109 @@ div.subnav {
193
208
  }
194
209
  }
195
210
 
196
- // TABLES
211
+ // NAV
197
212
  // --------------------------------------------------
198
213
 
199
- .table,
200
- .table.table-bordered,
201
- .table.table-striped {
202
- .border-radius(0 0 8px 8px);
203
- }
214
+ .nav {
215
+ .disabled > a {
204
216
 
205
- .table-bordered thead:first-child tr:first-child th:first-child,
206
- .table-bordered tbody:first-child tr:first-child td:first-child,
207
- .table-bordered thead:first-child tr:first-child th:last-child,
208
- .table-bordered tbody:first-child tr:first-child td:last-child {
209
- .border-radius(0);
210
- }
217
+ color: #ccc;
211
218
 
212
- .table-striped tbody:last-child tr:last-child td:first-child {
213
- .border-radius(0 0 0 8px);
219
+ &:hover {
220
+ background-color: #748C73;
221
+ }
222
+ }
214
223
  }
215
224
 
216
- .table-striped tbody:last-child tr:last-child td:last-child {
217
- .border-radius(0 0 8px 0);
218
- }
225
+ .nav-list {
219
226
 
220
- .table-bordered {
221
- border: none;
222
- }
227
+ li > a,
228
+ .nav-header {
229
+ text-shadow: none;
230
+ }
223
231
 
224
- .table thead tr th:first-child,
225
- .table tbody tr td:first-child {
226
- border-left: none;
227
- }
232
+ li > a:hover {
233
+ background-color: transparent;
234
+ }
228
235
 
229
- .table th,
230
- .table-striped tbody tr:nth-child(odd) th {
231
- background-color: darken(#90A38F, 10%);
232
- color: @headingsColor;
233
- }
236
+ li.active > a,
237
+ li.active > a:hover {
238
+ background-color: #A2CDB5;
239
+ text-shadow: none;
240
+ }
234
241
 
235
- // BUTTONS
236
- // --------------------------------------------------
242
+ .divider {
243
+ background-color: transparent;
244
+ border-bottom: 1px solid @headingsColor;
245
+ }
246
+ }
237
247
 
238
- .btn {
239
- .buttonBackground(lighten(@blueDark, 5%), @blueDark);
240
- text-shadow: none;
241
- color: @white;
248
+ .nav-tabs {
242
249
  border-color: transparent;
243
- .box-shadow(none);
250
+ }
251
+
252
+ .nav-tabs > li > a,
253
+ .nav-pills > li > a {
254
+ background-color: #748C73;
244
255
 
245
256
  &:hover {
246
- color: @grayLighter;
257
+ background-color: #748C73;
258
+ border-color: transparent;
247
259
  }
248
260
  }
249
261
 
250
- .btn-large {
251
- font-size: 18px;
262
+ .nav-tabs > .active > a,
263
+ .nav-tabs > .active > a:hover,
264
+ .nav-pills .active > a,
265
+ .nav-pills .active > a:hover {
266
+ background-color: #A2CDB5;
267
+ border-color: transparent;
268
+ color: @blue;
252
269
  }
253
270
 
254
- .btn-primary {
255
- .buttonBackground(lighten(@blue, 10%), lighten(@blue, 5%));
256
- }
271
+ .nav-tabs.nav-stacked > li > a {
272
+ border-color: transparent;
257
273
 
258
- .btn-warning {
259
- .buttonBackground(@orange, darken(@orange, 5%));
274
+ &:hover {
275
+ border-color: transparent;
276
+ }
260
277
  }
261
278
 
262
- .btn-danger {
263
- .buttonBackground(lighten(@red, 5%), @red);
279
+ .nav-tabs .open .dropdown-toggle,
280
+ .nav-pills .open .dropdown-toggle {
281
+ background-color: #748C73;
282
+ border-color: transparent;
283
+ color: @yellow;
264
284
  }
265
285
 
266
- .btn-success {
267
- .buttonBackground(#62c462, #51a351);
286
+ .nav-tabs .active.open .dropdown-toggle,
287
+ .nav-pills .active.open .dropdown-toggle {
288
+ background-color: #A2CDB5;
268
289
  }
269
290
 
270
- .btn-info {
271
- .buttonBackground(#5bc0de, #2f96b4);
272
- }
291
+ .nav-tabs .dropdown-menu,
292
+ .nav-pills .dropdown-menu {
293
+ background-color: @headingsColor;
294
+ color: @textColor;
295
+ border-color: transparent;
273
296
 
274
- .btn-inverse {
275
- .buttonBackground(@yellow, darken(@yellow, 5%));
297
+ a:hover {
298
+ background-color: #A2CDB5;
299
+ color: @headingsColor;
300
+ }
276
301
  }
277
302
 
278
- .btn-group .dropdown-toggle {
279
- .box-shadow(none);
303
+ .nav .nav-header {
304
+ color: @blue;
280
305
  }
281
306
 
282
- // NAVIGATION
283
- // --------------------------------------------------
284
-
285
- .nav {
286
- .disabled > a {
287
-
288
- color: #ccc;
289
-
290
- &:hover {
291
- background-color: #748C73;
292
- }
307
+ .tabbable {
308
+ .nav-tabs,
309
+ .nav-tabs > li > a,
310
+ .nav-tabs > li > a:hover,
311
+ .nav-tabs > li.active > a,
312
+ .nav-tabs > li.active > a:hover {
313
+ border-color: transparent;
293
314
  }
294
315
  }
295
316
 
@@ -351,120 +372,118 @@ div.subnav {
351
372
  }
352
373
  }
353
374
 
354
- .nav-list {
375
+ .pager {
355
376
 
356
- li > a,
357
- .nav-header {
358
- text-shadow: none;
359
- }
377
+ a {
378
+ border: none;
379
+ background-color: #748C73;
360
380
 
361
- li > a:hover {
362
- background-color: transparent;
381
+ &:hover {
382
+ background-color: #687D67;
383
+ }
363
384
  }
364
385
 
365
- li.active > a,
366
- li.active > a:hover {
367
- background-color: #A2CDB5;
368
- text-shadow: none;
386
+ .disabled a,
387
+ .disabled a:hover {
388
+ background-color: #748C73;
389
+ color: @textColor;
369
390
  }
391
+ }
370
392
 
371
- .divider {
372
- background-color: transparent;
373
- border-bottom: 1px solid @headingsColor;
393
+ // BUTTONS
394
+ // --------------------------------------------------
395
+
396
+ .btn {
397
+ .buttonBackground(lighten(@blueDark, 5%), @blueDark);
398
+ font-family: @headingsFontFamily;
399
+ font-weight: @headingsFontWeight;
400
+ color: @white;
401
+ text-shadow: none;
402
+ border-color: transparent;
403
+ .box-shadow(none);
404
+
405
+ &:hover {
406
+ color: @grayLighter;
374
407
  }
375
408
  }
376
409
 
377
- .nav-tabs {
378
- border-color: transparent;
410
+ .btn-large {
411
+ font-size: 18px;
379
412
  }
380
413
 
381
- .nav-tabs > li > a,
382
- .nav-pills > li > a {
383
- background-color: #748C73;
414
+ .btn-primary {
415
+ .buttonBackground(lighten(@blue, 10%), lighten(@blue, 5%));
416
+ }
384
417
 
385
- &:hover {
386
- background-color: #748C73;
387
- border-color: transparent;
388
- }
418
+ .btn-warning {
419
+ .buttonBackground(@orange, darken(@orange, 5%));
389
420
  }
390
421
 
391
- .nav-tabs > .active > a,
392
- .nav-tabs > .active > a:hover,
393
- .nav-pills .active > a,
394
- .nav-pills .active > a:hover {
395
- background-color: #A2CDB5;
396
- border-color: transparent;
397
- color: @blue;
422
+ .btn-danger {
423
+ .buttonBackground(lighten(@red, 5%), @red);
398
424
  }
399
425
 
400
- .nav-tabs.nav-stacked > li > a {
401
- border-color: transparent;
426
+ .btn-success {
427
+ .buttonBackground(#62c462, #51a351);
428
+ }
402
429
 
403
- &:hover {
404
- border-color: transparent;
405
- }
430
+ .btn-info {
431
+ .buttonBackground(#5bc0de, #2f96b4);
406
432
  }
407
433
 
408
- .nav-tabs .open .dropdown-toggle,
409
- .nav-pills .open .dropdown-toggle {
410
- background-color: #748C73;
411
- border-color: transparent;
412
- color: @yellow;
434
+ .btn-inverse {
435
+ .buttonBackground(@yellow, darken(@yellow, 5%));
413
436
  }
414
437
 
415
- .nav-tabs .active.open .dropdown-toggle,
416
- .nav-pills .active.open .dropdown-toggle {
417
- background-color: #A2CDB5;
438
+ .btn-group .dropdown-toggle {
439
+ .box-shadow(none);
418
440
  }
419
441
 
420
- .nav-tabs .dropdown-menu,
421
- .nav-pills .dropdown-menu {
422
- background-color: @headingsColor;
423
- color: @textColor;
424
- border-color: transparent;
442
+ // TABLES
443
+ // --------------------------------------------------
425
444
 
426
- a:hover {
427
- background-color: #A2CDB5;
428
- color: @headingsColor;
429
- }
445
+ .table,
446
+ .table.table-bordered,
447
+ .table.table-striped {
448
+ .border-radius(0 0 8px 8px);
430
449
  }
431
450
 
432
- .nav .nav-header {
433
- color: @blue;
451
+ .table-bordered thead:first-child tr:first-child th:first-child,
452
+ .table-bordered tbody:first-child tr:first-child td:first-child,
453
+ .table-bordered thead:first-child tr:first-child th:last-child,
454
+ .table-bordered tbody:first-child tr:first-child td:last-child {
455
+ .border-radius(0);
434
456
  }
435
457
 
436
- .tabbable {
437
- .nav-tabs,
438
- .nav-tabs > li > a,
439
- .nav-tabs > li > a:hover,
440
- .nav-tabs > li.active > a,
441
- .nav-tabs > li.active > a:hover {
442
- border-color: transparent;
443
- }
458
+ .table-striped tbody:last-child tr:last-child td:first-child {
459
+ .border-radius(0 0 0 8px);
444
460
  }
445
461
 
446
- .pager {
462
+ .table-striped tbody:last-child tr:last-child td:last-child {
463
+ .border-radius(0 0 8px 0);
464
+ }
447
465
 
448
- a {
449
- border: none;
450
- background-color: #748C73;
466
+ .table-bordered {
467
+ border: none;
468
+ }
451
469
 
452
- &:hover {
453
- background-color: #687D67;
454
- }
455
- }
470
+ .table thead tr th:first-child,
471
+ .table tbody tr td:first-child {
472
+ border-left: none;
473
+ }
456
474
 
457
- .disabled a,
458
- .disabled a:hover {
459
- background-color: #748C73;
460
- color: @textColor;
461
- }
475
+ .table th,
476
+ .table-striped tbody tr:nth-child(odd) th {
477
+ background-color: darken(#90A38F, 10%);
478
+ color: @headingsColor;
462
479
  }
463
480
 
464
481
  // FORMS
465
482
  // --------------------------------------------------
466
483
 
467
484
  legend {
485
+ font-family: @headingsFontFamily;
486
+ font-weight: @headingsFontWeight;
468
487
  color: @headingsColor;
469
488
  }
470
489
 
@@ -489,30 +508,7 @@ legend {
489
508
  .border-radius(4px);
490
509
  }
491
510
 
492
- // MODALS
493
- // --------------------------------------------------
494
-
495
- .modal-header {
496
- padding: 12px 15px 6px;
497
- background-color: @green;
498
- }
499
-
500
- .modal-body,
501
- .modal-footer {
502
- background-color: @headingsColor;
503
- border: none;
504
- .box-shadow(none);
505
-
506
- label {
507
- color: @textColor;
508
- }
509
- }
510
-
511
- .modal-footer {
512
- .border-radius(0 0 4px 4px);
513
- }
514
-
515
- // MISCELLANEOUS
511
+ // ALERTS, LABELS, BADGES
516
512
  // --------------------------------------------------
517
513
 
518
514
  .alert {
@@ -520,6 +516,11 @@ legend {
520
516
  border: none;
521
517
  }
522
518
 
519
+ .alert-heading {
520
+ font-family: @baseFontFamily;
521
+ color: inherit;
522
+ }
523
+
523
524
  .badge,
524
525
  .label {
525
526
 
@@ -547,10 +548,8 @@ legend {
547
548
  }
548
549
  }
549
550
 
550
- .progress {
551
- background-color: darken(#90A38F, 10%);
552
- background-image: none;
553
- }
551
+ // MISC
552
+ // --------------------------------------------------
554
553
 
555
554
  .well {
556
555
  border: none;
@@ -566,12 +565,33 @@ legend {
566
565
  }
567
566
  }
568
567
 
569
- hr {
570
- border-top: none;
571
- border-bottom: 2px solid @headingsColor;
568
+ .progress {
569
+ background-color: darken(#90A38F, 10%);
570
+ background-image: none;
572
571
  }
573
572
 
574
- .page-header {
575
- border-bottom: 2px solid @headingsColor;
576
- padding-bottom: 5px;
573
+ .modal {
574
+
575
+ &-header {
576
+ padding: 12px 15px 6px;
577
+ background-color: @green;
578
+ }
579
+
580
+ &-body,
581
+ &-footer {
582
+ background-color: @headingsColor;
583
+ border: none;
584
+ .box-shadow(none);
585
+
586
+ label {
587
+ color: @textColor;
588
+ }
589
+ }
590
+
591
+ &-footer {
592
+ .border-radius(0 0 4px 4px);
593
+ }
577
594
  }
595
+
596
+ // MEDIA QUERIES
597
+ // --------------------------------------------------