less-rails-bootswatch 0.1.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (33) hide show
  1. data/Gemfile +3 -0
  2. data/Gemfile.lock +72 -0
  3. data/LICENSE +22 -0
  4. data/LICENSE-bootswatch +13 -0
  5. data/README.md +29 -0
  6. data/Rakefile +47 -0
  7. data/lib/less/rails/bootswatch/engine.rb +9 -0
  8. data/lib/less/rails/bootswatch/version.rb +7 -0
  9. data/lib/less/rails/bootswatch.rb +2 -0
  10. data/vendor/assets/stylesheets/bootswatch/amelia/bootswatch.less +600 -0
  11. data/vendor/assets/stylesheets/bootswatch/amelia/variables.less +203 -0
  12. data/vendor/assets/stylesheets/bootswatch/cerulean/bootswatch.less +97 -0
  13. data/vendor/assets/stylesheets/bootswatch/cerulean/variables.less +203 -0
  14. data/vendor/assets/stylesheets/bootswatch/cyborg/bootswatch.less +473 -0
  15. data/vendor/assets/stylesheets/bootswatch/cyborg/variables.less +203 -0
  16. data/vendor/assets/stylesheets/bootswatch/default/variables.less +201 -0
  17. data/vendor/assets/stylesheets/bootswatch/journal/bootswatch.less +159 -0
  18. data/vendor/assets/stylesheets/bootswatch/journal/variables.less +203 -0
  19. data/vendor/assets/stylesheets/bootswatch/readable/bootswatch.less +452 -0
  20. data/vendor/assets/stylesheets/bootswatch/readable/variables.less +203 -0
  21. data/vendor/assets/stylesheets/bootswatch/simplex/bootswatch.less +276 -0
  22. data/vendor/assets/stylesheets/bootswatch/simplex/variables.less +203 -0
  23. data/vendor/assets/stylesheets/bootswatch/slate/bootswatch.less +417 -0
  24. data/vendor/assets/stylesheets/bootswatch/slate/variables.less +203 -0
  25. data/vendor/assets/stylesheets/bootswatch/spacelab/bootswatch.less +175 -0
  26. data/vendor/assets/stylesheets/bootswatch/spacelab/variables.less +203 -0
  27. data/vendor/assets/stylesheets/bootswatch/spruce/bootswatch.less +503 -0
  28. data/vendor/assets/stylesheets/bootswatch/spruce/variables.less +203 -0
  29. data/vendor/assets/stylesheets/bootswatch/superhero/bootswatch.less +625 -0
  30. data/vendor/assets/stylesheets/bootswatch/superhero/variables.less +203 -0
  31. data/vendor/assets/stylesheets/bootswatch/united/bootswatch.less +97 -0
  32. data/vendor/assets/stylesheets/bootswatch/united/variables.less +203 -0
  33. metadata +90 -0
@@ -0,0 +1,417 @@
1
+ // Bootswatch.less
2
+ // Swatch: Slate
3
+ // Version: 2.0.2
4
+ // -----------------------------------------------------
5
+
6
+ // SCAFFOLDING
7
+ // -----------------------------------------------------
8
+
9
+ h1, h2, h3, h4, h5, h6, body, legend, label {
10
+ text-shadow: -1px -1px 0 #111;
11
+ }
12
+
13
+ // NAVBAR
14
+ // -----------------------------------------------------
15
+
16
+ .navbar .brand {
17
+ font-weight: bold;
18
+ }
19
+
20
+ .navbar .navbar-inner,
21
+ div.subnav {
22
+ #gradient > .vertical-three-colors(@gray, @grayDark, 70%, @grayDark);
23
+ }
24
+
25
+ .navbar .divider-vertical {
26
+ background-color: transparent;
27
+ border-right: none;
28
+ }
29
+
30
+ .navbar .brand,
31
+ .navbar .nav > li > a,
32
+ div.subnav .nav > li > a {
33
+ color: @grayLighter;
34
+ text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
35
+ border-right: 1px solid darken(@gray, 15%);
36
+ }
37
+
38
+ .navbar .nav > li > a,
39
+ div.subnav .nav > li > a {
40
+ border-left: 1px solid @gray;
41
+
42
+ &:hover {
43
+ color: @grayLighter;
44
+ background-color: @grayDark;
45
+ #gradient > .directional(@grayDarker, @grayDark, 280deg);
46
+ border-left: 1px solid transparent;
47
+ border-right: 1px solid transparent;
48
+ }
49
+ }
50
+
51
+ .navbar .nav > li.active > a,
52
+ div.subnav .nav > li.active > a,
53
+ .navbar .nav > li.active > a:hover,
54
+ div.subnav .nav > li.active > a:hover {
55
+ color: @grayLighter;
56
+ background-color: @grayDark;
57
+ #gradient > .directional(lighten(@grayDarker, 4%), lighten(@grayDark, 4%), 280deg);
58
+ border-right: 1px solid darken(@gray, 15%);
59
+ }
60
+
61
+ div.subnav .nav > li:first-child > a,
62
+ div.subnav .nav > li:first-child > a:hover {
63
+ border-left: 1px solid transparent;
64
+ }
65
+
66
+ div.subnav.subnav-fixed .nav > li.active:first-child > a,
67
+ div.subnav.subnav-fixed .nav > li:first-child > a:hover {
68
+ border-left: 1px solid darken(@gray, 15%);
69
+ }
70
+
71
+ div.subnav .nav > li.active:last-child > a,
72
+ div.subnav .nav > li:last-child > a:hover {
73
+ border-right: 1px solid darken(@gray, 15%);
74
+ }
75
+
76
+ div.subnav {
77
+ border: 1px solid transparent;
78
+ .box-shadow('0 1px 3px rgba(0, 0, 0, 0.25), inset 0 -1px 0 rgba(0, 0, 0, 0.1)');
79
+ }
80
+
81
+ div.subnav-fixed {
82
+ .box-shadow(none);
83
+ }
84
+
85
+ .navbar-search .search-query {
86
+ border: 1px solid darken(@gray, 15%);
87
+ }
88
+
89
+ .nav .nav-header {
90
+ text-shadow: none;
91
+ }
92
+
93
+ .navbar .nav-collapse.in > .nav > li > a,
94
+ .navbar .nav-collapse.in > .nav > li.active > a,
95
+ .navbar .nav-collapse.in > .nav > li > a:hover,
96
+ .navbar .nav-collapse.in > .nav > li.active > a:hover {
97
+ color: @grayLighter;
98
+ border: 1px solid transparent;
99
+ .box-shadow(none);
100
+ background-color: transparent;
101
+ background-image: none;
102
+ }
103
+
104
+ .navbar .nav-collapse.in > .nav > li > a:hover,
105
+ .navbar .nav-collapse.in > .nav > li.active > a:hover {
106
+ background-color: @grayDarker;
107
+ }
108
+
109
+ @media (max-width: 979px) {
110
+ .navbar .brand {
111
+ border-right: none;
112
+ }
113
+ }
114
+
115
+ @media (max-width: 768px) {
116
+ div.subnav .nav > li + li > a {
117
+ border-top: 1px solid transparent;
118
+ }
119
+ }
120
+
121
+ // BUTTONS
122
+ // -----------------------------------------------------
123
+
124
+ .btn {
125
+ .buttonBackground(@gray, darken(@gray, 10%));
126
+ .border-radius(3px);
127
+ border: 1px solid @grayDarker;
128
+ }
129
+
130
+ .btn, .btn:hover {
131
+ color: @white;
132
+ font-weight: bold;
133
+ text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
134
+ }
135
+
136
+ .btn-primary {
137
+ .buttonBackground(@btnPrimaryBackground, spin(@btnPrimaryBackground, 20));
138
+ }
139
+ .btn-warning {
140
+ .buttonBackground(lighten(@orange, 15%), @orange);
141
+ }
142
+
143
+ .btn-danger {
144
+ .buttonBackground(#ee5f5b, #bd362f);
145
+ }
146
+
147
+ .btn-success {
148
+ .buttonBackground(#62c462, #51a351);
149
+ }
150
+
151
+ .btn-info {
152
+ .buttonBackground(#5bc0de, #2f96b4);
153
+ }
154
+
155
+ .btn-inverse {
156
+ .buttonBackground(#454545, #262626);
157
+ }
158
+
159
+ .caret {
160
+ border-top-color: @white;
161
+ }
162
+
163
+ // TABLES
164
+ // -----------------------------------------------------
165
+
166
+
167
+
168
+ // NAVIGATION
169
+ // -----------------------------------------------------
170
+
171
+ .pagination > ul {
172
+ .box-shadow(none);
173
+ }
174
+
175
+ .breadcrumb {
176
+ .box-shadow(none);
177
+ }
178
+
179
+ .breadcrumb, .pagination > ul a, .pager a {
180
+ border: 1px solid transparent;
181
+ .box-shadow('0 1px 3px rgba(0, 0, 0, 0.25), inset 0 -1px 0 rgba(0, 0, 0, 0.1)');
182
+ #gradient > .vertical-three-colors(@gray, @grayDark, 70%, @grayDark);
183
+ }
184
+
185
+ .breadcrumb li, .breadcrumb a, .pagination > ul a {
186
+ color: @grayLighter;
187
+ font-weight: bold;
188
+ text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
189
+ }
190
+
191
+ .breadcrumb a {
192
+ color: @white;
193
+ }
194
+
195
+ .pagination li > a,
196
+ .pagination li.disabled > a {
197
+ border-left: 1px solid @gray;
198
+ border-right: 1px solid darken(@gray, 15%);
199
+ border-top: none;
200
+ border-bottom: none;
201
+ }
202
+
203
+ .pagination li.disabled > a {
204
+ #gradient > .vertical-three-colors(@grayLight, @gray, 70%, @gray);
205
+ }
206
+
207
+ .pagination > ul > li:not(.disabled) a:hover,
208
+ {
209
+ #gradient > .directional(@grayDarker, @grayDark, 280deg);
210
+ border-left: 1px solid transparent;
211
+ }
212
+
213
+ .pagination > ul > li.active > a,
214
+ .pagination > ul > li.active > a:hover {
215
+ color: @grayLighter;
216
+ background-color: @grayDark;
217
+ #gradient > .directional(lighten(@grayDarker, 4%), lighten(@grayDark, 4%), 280deg);
218
+ border-left: 1px solid transparent;
219
+ }
220
+
221
+ .pager a:hover {
222
+ #gradient > .directional(@grayDarker, @grayDark, 280deg);
223
+ border: 1px solid transparent;
224
+ }
225
+
226
+ .nav > li > a,
227
+ .nav > li > a:hover,
228
+ .nav > li.active > a,
229
+ .nav > li.active > a:hover,
230
+ .nav-tabs.nav-stacked > li > a,
231
+ .nav-tabs.nav-stacked > li > a:hover {
232
+ border: none;
233
+ background-color: transparent;
234
+ color: @grayLighter;
235
+ font-weight: bold;
236
+ text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
237
+ }
238
+
239
+ .dropdown-menu {
240
+ .box-shadow(0 5px 5px rgba(0, 0, 0, 0.2));
241
+ }
242
+
243
+ .dropdown-menu,
244
+ .dropdown-menu li.active a,
245
+ .dropdown-menu li.active a:hover {
246
+ background-color: @grayDark;
247
+ }
248
+
249
+ .dropdown-menu a,
250
+ .dropdown-menu li.active a,
251
+ .dropdown-menu li a:hover,
252
+ .dropdown-menu li.active a:hover,
253
+ .dropdown.open .dropdown-toggle {
254
+ color: @grayLighter;
255
+ }
256
+
257
+ .dropdown-menu li a:hover,
258
+ .dropdown-menu li.active a:hover {
259
+ background-color: @grayDarker;
260
+ }
261
+
262
+ .navbar .dropdown-menu::after {
263
+ border-bottom: 6px solid @grayDark;
264
+ }
265
+
266
+ .nav > li > a {
267
+ border: none;
268
+ .box-shadow('0 1px 3px rgba(0, 0, 0, 0.25), inset 0 -1px 0 rgba(0, 0, 0, 0.1)');
269
+ #gradient > .vertical-three-colors(@gray, @grayDark, 70%, @grayDark);
270
+
271
+ }
272
+
273
+ .nav.nav-list .nav-header {
274
+ color: @grayLight;
275
+ text-shadow: -1px -1px 0 #111;
276
+ }
277
+
278
+ .nav.nav-list .divider {
279
+ border-bottom: 1px solid darken(@grayDarker, 5%);
280
+ background-color: transparent;
281
+ }
282
+
283
+ .nav-tabs {
284
+ border-bottom: none;
285
+ }
286
+
287
+ .tabs-below .nav-tabs {
288
+ border-top: none;
289
+ }
290
+
291
+ .tabs-left .nav-tabs {
292
+ border-right: none;
293
+ }
294
+
295
+ .tabs-right .nav-tabs {
296
+ border-left: none;
297
+ }
298
+
299
+ // FORMS
300
+ // -----------------------------------------------------
301
+
302
+ label, input, button, select, textarea, legend {
303
+ color: @textColor;
304
+ }
305
+
306
+ .form-actions {
307
+ background-color: darken(@grayDarker, 3%);
308
+ border-top: none;
309
+ }
310
+
311
+ .input-prepend .add-on, .input-append .add-on {
312
+ vertical-align: top;
313
+ height: 19px;
314
+ background-color: @gray;
315
+ border-top: 1px solid @grayLight;
316
+ border-left: 1px solid @grayLight;
317
+ border-bottom: 1px solid @grayDark;
318
+ border-right: 1px solid @grayDark;
319
+ text-shadow: none;
320
+ }
321
+
322
+ .uneditable-input, input[disabled], select[disabled], textarea[disabled], input[readonly], select[readonly], textarea[readonly] {
323
+ text-shadow: none;
324
+ color: @grayLighter;
325
+ }
326
+
327
+ // LABELS AND ALERTS
328
+ // -----------------------------------------------------
329
+
330
+ .label, .alert {
331
+ color: rgba(256, 256, 256, 0.9);
332
+ text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.4);
333
+ .box-shadow(1px 1px 1px rgba(0, 0, 0, 0.3));
334
+ }
335
+
336
+ .alert-heading {
337
+ color: rgba(256, 256, 256, 0.9);
338
+ text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.4);
339
+ }
340
+
341
+ .alert {
342
+ background-color: @warningText;
343
+ border-color: @warningText;
344
+ }
345
+
346
+ .alert-success {
347
+ background-color: @successText;
348
+ border-color: @successText;
349
+ }
350
+
351
+ .alert-danger,
352
+ .alert-error {
353
+ background-color: @errorText;
354
+ border-color: @errorText;
355
+ }
356
+
357
+ .alert-info {
358
+ background-color: @infoText;
359
+ border-color: @infoText;
360
+ }
361
+
362
+ // MODALS
363
+ // -----------------------------------------------------
364
+
365
+ .modal {
366
+ background-color: darken(@grayDark, 5%);
367
+ }
368
+
369
+ .modal-header {
370
+ border-bottom: none;
371
+ }
372
+
373
+ .modal-body {
374
+ border-bottom: 1px solid #1C1E22;
375
+ }
376
+
377
+ .modal-footer {
378
+ border-top: none;
379
+ background-color: @grayDarker;
380
+ .box-shadow(none);
381
+ }
382
+
383
+ // MISCELLANEOUS
384
+ // -----------------------------------------------------
385
+
386
+ code, pre {
387
+ background-color: #F7F7F7;
388
+ border: 1px solid darken(@grayDarker, 5%);
389
+ text-shadow: none;
390
+ }
391
+
392
+ hr, legend, .page-header, .dropdown-menu .divider {
393
+ border-top: none;
394
+ border-bottom: 1px solid darken(@grayDarker, 5%);
395
+ background-color: transparent;
396
+ }
397
+
398
+ footer.footer {
399
+ border-top: 1px solid darken(@grayDarker, 5%);
400
+
401
+ p {
402
+ color: @textColor;
403
+ }
404
+ }
405
+
406
+ .well, .progress, .hero-unit {
407
+ background-color: darken(@grayDarker, 3%);
408
+ .box-shadow(inset 1px 1px 1px rgba(0, 0, 0, 0.5);
409
+ }
410
+
411
+ .progress {
412
+ #gradient > .vertical(darken(@grayDarker, 3%), darken(@grayDarker, 3%));
413
+ }
414
+
415
+ .thumbnail, a.thumbnail:hover {
416
+ border: 1px solid darken(@grayDarker, 5%);
417
+ }
@@ -0,0 +1,203 @@
1
+ // Variables.less
2
+ // Variables to customize the look and feel of Bootstrap
3
+ // Swatch: Slate
4
+ // Version: 2.0.2
5
+ // -----------------------------------------------------
6
+
7
+
8
+
9
+ // GLOBAL VALUES
10
+ // --------------------------------------------------
11
+
12
+
13
+ // Grays
14
+ // -------------------------
15
+ @black: #000;
16
+ @grayDarker: #272B30;
17
+ @grayDark: #3A3F44;
18
+ @gray: #52575C;
19
+ @grayLight: #757C82;
20
+ @grayLighter: #BBBFC2;
21
+ @white: #fff;
22
+
23
+
24
+ // Accent colors
25
+ // -------------------------
26
+ @blue: #02A1DD;
27
+ @blueDark: #108CBB;
28
+ @green: #87CA4D;
29
+ @red: #9d261d;
30
+ @yellow: #F6D30D;
31
+ @orange: #f89406;
32
+ @pink: #c3325f;
33
+ @purple: #7a43b6;
34
+
35
+
36
+ // Scaffolding
37
+ // -------------------------
38
+ @bodyBackground: @grayDarker;
39
+ @textColor: @grayLight;
40
+
41
+
42
+ // Links
43
+ // -------------------------
44
+ @linkColor: @white;
45
+ @linkColorHover: @white;
46
+
47
+
48
+ // Typography
49
+ // -------------------------
50
+ @baseFontSize: 13px;
51
+ @baseFontFamily: "Helvetica Neue", Helvetica, Arial, sans-serif;
52
+ @baseLineHeight: 18px;
53
+ @altFontFamily: Georgia, "Times New Roman", Times, serif;
54
+
55
+ @headingsFontFamily: inherit; // empty to use BS default, @baseFontFamily
56
+ @headingsFontWeight: bold; // instead of browser default, bold
57
+ @headingsColor: inherit; // empty to use BS default, @textColor
58
+
59
+
60
+ // Tables
61
+ // -------------------------
62
+ @tableBackground: transparent; // overall background-color
63
+ @tableBackgroundAccent: darken(@grayDark, 5%); // for striping
64
+ @tableBackgroundHover: @grayDark; // for hover
65
+ @tableBorder: darken(@grayDarker, 5%); // table and cell border
66
+
67
+
68
+ // Buttons
69
+ // -------------------------
70
+ @btnBackground: @white;
71
+ @btnBackgroundHighlight: darken(@white, 10%);
72
+ @btnBorder: darken(@white, 20%);
73
+
74
+ @btnPrimaryBackground: @grayLight;
75
+ @btnPrimaryBackgroundHighlight: spin(@btnPrimaryBackground, 15%);
76
+
77
+ @btnInfoBackground: #5bc0de;
78
+ @btnInfoBackgroundHighlight: #2f96b4;
79
+
80
+ @btnSuccessBackground: #62c462;
81
+ @btnSuccessBackgroundHighlight: #51a351;
82
+
83
+ @btnWarningBackground: lighten(@orange, 15%);
84
+ @btnWarningBackgroundHighlight: @orange;
85
+
86
+ @btnDangerBackground: #ee5f5b;
87
+ @btnDangerBackgroundHighlight: #bd362f;
88
+
89
+ @btnInverseBackground: @gray;
90
+ @btnInverseBackgroundHighlight: @grayDarker;
91
+
92
+
93
+ // Forms
94
+ // -------------------------
95
+ @inputBackground: @white;
96
+ @inputBorder: #ccc;
97
+ @inputDisabledBackground: @grayLighter;
98
+
99
+
100
+ // Dropdowns
101
+ // -------------------------
102
+ @dropdownBackground: @white;
103
+ @dropdownBorder: rgba(0,0,0,.2);
104
+ @dropdownLinkColor: @grayDark;
105
+ @dropdownLinkColorHover: @white;
106
+ @dropdownLinkBackgroundHover: @linkColor;
107
+
108
+
109
+
110
+
111
+ // COMPONENT VARIABLES
112
+ // --------------------------------------------------
113
+
114
+ // Z-index master list
115
+ // -------------------------
116
+ // Used for a bird's eye view of components dependent on the z-axis
117
+ // Try to avoid customizing these :)
118
+ @zindexDropdown: 1000;
119
+ @zindexPopover: 1010;
120
+ @zindexTooltip: 1020;
121
+ @zindexFixedNavbar: 1030;
122
+ @zindexModalBackdrop: 1040;
123
+ @zindexModal: 1050;
124
+
125
+
126
+ // Sprite icons path
127
+ // -------------------------
128
+ @iconSpritePath: "./twitter/bootstrap/glyphicons-halflings.png";
129
+ @iconWhiteSpritePath: "./twitter/bootstrap/glyphicons-halflings-white.png";
130
+
131
+
132
+ // Input placeholder text color
133
+ // -------------------------
134
+ @placeholderText: @grayLight;
135
+
136
+
137
+ // Hr border color
138
+ // -------------------------
139
+ @hrBorder: @grayLighter;
140
+
141
+
142
+ // Navbar
143
+ // -------------------------
144
+ @navbarHeight: 40px;
145
+ @navbarBackground: @grayDarker;
146
+ @navbarBackgroundHighlight: @grayDark;
147
+
148
+ @navbarText: @grayLight;
149
+ @navbarLinkColor: @grayLight;
150
+ @navbarLinkColorHover: @white;
151
+ @navbarLinkColorActive: @navbarLinkColorHover;
152
+ @navbarLinkBackgroundHover: transparent;
153
+ @navbarLinkBackgroundActive: @navbarBackground;
154
+
155
+ @navbarSearchBackground: lighten(@navbarBackground, 25%);
156
+ @navbarSearchBackgroundFocus: @white;
157
+ @navbarSearchBorder: darken(@navbarSearchBackground, 30%);
158
+ @navbarSearchPlaceholderColor: #ccc;
159
+
160
+
161
+ // Hero unit
162
+ // -------------------------
163
+ @heroUnitBackground: @grayLighter;
164
+ @heroUnitHeadingColor: inherit;
165
+ @heroUnitLeadColor: inherit;
166
+
167
+
168
+ // Form states and alerts
169
+ // -------------------------
170
+ @warningText: #c09853;
171
+ @warningBackground: #fcf8e3;
172
+ @warningBorder: darken(spin(@warningBackground, -10), 3%);
173
+
174
+ @errorText: #b94a48;
175
+ @errorBackground: #f2dede;
176
+ @errorBorder: darken(spin(@errorBackground, -10), 3%);
177
+
178
+ @successText: #468847;
179
+ @successBackground: #dff0d8;
180
+ @successBorder: darken(spin(@successBackground, -10), 5%);
181
+
182
+ @infoText: #3a87ad;
183
+ @infoBackground: #d9edf7;
184
+ @infoBorder: darken(spin(@infoBackground, -10), 7%);
185
+
186
+
187
+
188
+
189
+ // GRID
190
+ // --------------------------------------------------
191
+
192
+ // Default 940px grid
193
+ // -------------------------
194
+ @gridColumns: 12;
195
+ @gridColumnWidth: 60px;
196
+ @gridGutterWidth: 20px;
197
+ @gridRowWidth: (@gridColumns * @gridColumnWidth) + (@gridGutterWidth * (@gridColumns - 1));
198
+
199
+
200
+ // Fluid grid
201
+ // -------------------------
202
+ @fluidGridColumnWidth: 6.382978723%;
203
+ @fluidGridGutterWidth: 2.127659574%;