fennec 2.0.0 → 2.0.2

Sign up to get free protection for your applications and to get access to all the features.
Files changed (70) hide show
  1. data/README.md +23 -6
  2. data/lib/fennec/version.rb +1 -1
  3. data/vendor/assets/javascripts/bootstrap-alert.js +8 -5
  4. data/vendor/assets/javascripts/bootstrap-button.js +5 -3
  5. data/vendor/assets/javascripts/bootstrap-carousel.js +9 -2
  6. data/vendor/assets/javascripts/bootstrap-collapse.js +5 -3
  7. data/vendor/assets/javascripts/bootstrap-dropdown.js +2 -2
  8. data/vendor/assets/javascripts/bootstrap-modal.js +3 -3
  9. data/vendor/assets/javascripts/bootstrap-popover.js +2 -2
  10. data/vendor/assets/javascripts/bootstrap-scrollspy.js +2 -2
  11. data/vendor/assets/javascripts/bootstrap-tab.js +2 -2
  12. data/vendor/assets/javascripts/bootstrap-tooltip.js +3 -3
  13. data/vendor/assets/javascripts/bootstrap-transition.js +3 -3
  14. data/vendor/assets/javascripts/bootstrap-typeahead.js +8 -8
  15. data/vendor/assets/javascripts/bootstrap.js +1726 -0
  16. data/vendor/assets/javascripts/bootstrap.min.js +6 -0
  17. data/vendor/assets/stylesheets/bootstrap-responsive.css +337 -218
  18. data/vendor/assets/stylesheets/bootstrap.css +1022 -397
  19. data/vendor/assets/stylesheets/docs.css +85 -30
  20. metadata +13 -61
  21. data/vendor/assets/javascripts/tests/index.html +0 -49
  22. data/vendor/assets/javascripts/tests/unit/bootstrap-alert.js +0 -41
  23. data/vendor/assets/javascripts/tests/unit/bootstrap-button.js +0 -54
  24. data/vendor/assets/javascripts/tests/unit/bootstrap-collapse.js +0 -25
  25. data/vendor/assets/javascripts/tests/unit/bootstrap-dropdown.js +0 -53
  26. data/vendor/assets/javascripts/tests/unit/bootstrap-modal.js +0 -85
  27. data/vendor/assets/javascripts/tests/unit/bootstrap-popover.js +0 -93
  28. data/vendor/assets/javascripts/tests/unit/bootstrap-scrollspy.js +0 -31
  29. data/vendor/assets/javascripts/tests/unit/bootstrap-tab.js +0 -45
  30. data/vendor/assets/javascripts/tests/unit/bootstrap-tooltip.js +0 -62
  31. data/vendor/assets/javascripts/tests/unit/bootstrap-transition.js +0 -13
  32. data/vendor/assets/javascripts/tests/unit/bootstrap-typeahead.js +0 -128
  33. data/vendor/assets/javascripts/tests/vendor/jquery.js +0 -9252
  34. data/vendor/assets/javascripts/tests/vendor/qunit.css +0 -232
  35. data/vendor/assets/javascripts/tests/vendor/qunit.js +0 -1510
  36. data/vendor/assets/stylesheets/bootstrap/accordion.less +0 -28
  37. data/vendor/assets/stylesheets/bootstrap/alerts.less +0 -70
  38. data/vendor/assets/stylesheets/bootstrap/bootstrap.less +0 -62
  39. data/vendor/assets/stylesheets/bootstrap/breadcrumbs.less +0 -22
  40. data/vendor/assets/stylesheets/bootstrap/button-groups.less +0 -147
  41. data/vendor/assets/stylesheets/bootstrap/buttons.less +0 -165
  42. data/vendor/assets/stylesheets/bootstrap/carousel.less +0 -121
  43. data/vendor/assets/stylesheets/bootstrap/close.less +0 -18
  44. data/vendor/assets/stylesheets/bootstrap/code.less +0 -44
  45. data/vendor/assets/stylesheets/bootstrap/component-animations.less +0 -18
  46. data/vendor/assets/stylesheets/bootstrap/dropdowns.less +0 -131
  47. data/vendor/assets/stylesheets/bootstrap/forms.less +0 -515
  48. data/vendor/assets/stylesheets/bootstrap/grid.less +0 -8
  49. data/vendor/assets/stylesheets/bootstrap/hero-unit.less +0 -20
  50. data/vendor/assets/stylesheets/bootstrap/labels.less +0 -16
  51. data/vendor/assets/stylesheets/bootstrap/layouts.less +0 -17
  52. data/vendor/assets/stylesheets/bootstrap/mixins.less +0 -537
  53. data/vendor/assets/stylesheets/bootstrap/modals.less +0 -72
  54. data/vendor/assets/stylesheets/bootstrap/navbar.less +0 -292
  55. data/vendor/assets/stylesheets/bootstrap/navs.less +0 -344
  56. data/vendor/assets/stylesheets/bootstrap/pager.less +0 -30
  57. data/vendor/assets/stylesheets/bootstrap/pagination.less +0 -55
  58. data/vendor/assets/stylesheets/bootstrap/popovers.less +0 -49
  59. data/vendor/assets/stylesheets/bootstrap/progress-bars.less +0 -95
  60. data/vendor/assets/stylesheets/bootstrap/reset.less +0 -126
  61. data/vendor/assets/stylesheets/bootstrap/responsive.less +0 -323
  62. data/vendor/assets/stylesheets/bootstrap/scaffolding.less +0 -29
  63. data/vendor/assets/stylesheets/bootstrap/sprites.less +0 -156
  64. data/vendor/assets/stylesheets/bootstrap/tables.less +0 -139
  65. data/vendor/assets/stylesheets/bootstrap/thumbnails.less +0 -35
  66. data/vendor/assets/stylesheets/bootstrap/tooltip.less +0 -35
  67. data/vendor/assets/stylesheets/bootstrap/type.less +0 -217
  68. data/vendor/assets/stylesheets/bootstrap/utilities.less +0 -23
  69. data/vendor/assets/stylesheets/bootstrap/variables.less +0 -99
  70. data/vendor/assets/stylesheets/bootstrap/wells.less +0 -17
@@ -1,8 +0,0 @@
1
- // GRID SYSTEM
2
- // -----------
3
-
4
- // Fixed (940px)
5
- #gridSystem > .generate(@gridColumns, @gridColumnWidth, @gridGutterWidth);
6
-
7
- // Fluid (940px)
8
- #fluidGridSystem > .generate(@gridColumns, @fluidGridColumnWidth, @fluidGridGutterWidth);
@@ -1,20 +0,0 @@
1
- // HERO UNIT
2
- // ---------
3
-
4
- .hero-unit {
5
- padding: 60px;
6
- margin-bottom: 30px;
7
- background-color: #f5f5f5;
8
- .border-radius(6px);
9
- h1 {
10
- margin-bottom: 0;
11
- font-size: 60px;
12
- line-height: 1;
13
- letter-spacing: -1px;
14
- }
15
- p {
16
- font-size: 18px;
17
- font-weight: 200;
18
- line-height: @baseLineHeight * 1.5;
19
- }
20
- }
@@ -1,16 +0,0 @@
1
- // LABELS
2
- // ------
3
-
4
- .label {
5
- padding: 1px 3px 2px;
6
- font-size: @baseFontSize * .75;
7
- font-weight: bold;
8
- color: @white;
9
- text-transform: uppercase;
10
- background-color: @grayLight;
11
- .border-radius(3px);
12
- }
13
- .label-important { background-color: @errorText; }
14
- .label-warning { background-color: @orange; }
15
- .label-success { background-color: @successText; }
16
- .label-info { background-color: @infoText; }
@@ -1,17 +0,0 @@
1
- //
2
- // Layouts
3
- // Fixed-width and fluid (with sidebar) layouts
4
- // --------------------------------------------
5
-
6
-
7
- // Container (centered, fixed-width layouts)
8
- .container {
9
- .container-fixed();
10
- }
11
-
12
- // Fluid layouts (left aligned, with sidebar, min- & max-width content)
13
- .container-fluid {
14
- padding-left: @gridGutterWidth;
15
- padding-right: @gridGutterWidth;
16
- .clearfix();
17
- }
@@ -1,537 +0,0 @@
1
- // Mixins.less
2
- // Snippets of reusable CSS to develop faster and keep code readable
3
- // -----------------------------------------------------------------
4
-
5
-
6
- // UTILITY MIXINS
7
- // --------------------------------------------------
8
-
9
- // Clearfix
10
- // --------
11
- // For clearing floats like a boss h5bp.com/q
12
- .clearfix() {
13
- *zoom: 1;
14
- &:before,
15
- &:after {
16
- display: table;
17
- content: "";
18
- }
19
- &:after {
20
- clear: both;
21
- }
22
- }
23
-
24
- // Webkit-style focus
25
- // ------------------
26
- .tab-focus() {
27
- // Default
28
- outline: thin dotted;
29
- // Webkit
30
- outline: 5px auto -webkit-focus-ring-color;
31
- outline-offset: -2px;
32
- }
33
-
34
- // Center-align a block level element
35
- // ----------------------------------
36
- .center-block() {
37
- display: block;
38
- margin-left: auto;
39
- margin-right: auto;
40
- }
41
-
42
- // IE7 inline-block
43
- // ----------------
44
- .ie7-inline-block() {
45
- *display: inline; /* IE7 inline-block hack */
46
- *zoom: 1;
47
- }
48
-
49
- // IE7 likes to collapse whitespace on either side of the inline-block elements.
50
- // Ems because we're attempting to match the width of a space character. Left
51
- // version is for form buttons, which typically come after other elements, and
52
- // right version is for icons, which come before. Applying both is ok, but it will
53
- // mean that space between those elements will be .6em (~2 space characters) in IE7,
54
- // instead of the 1 space in other browsers.
55
- .ie7-restore-left-whitespace() {
56
- *margin-left: .3em;
57
-
58
- &:first-child {
59
- *margin-left: 0;
60
- }
61
- }
62
-
63
- .ie7-restore-right-whitespace() {
64
- *margin-right: .3em;
65
-
66
- &:last-child {
67
- *margin-left: 0;
68
- }
69
- }
70
-
71
- // Sizing shortcuts
72
- // -------------------------
73
- .size(@height: 5px, @width: 5px) {
74
- width: @width;
75
- height: @height;
76
- }
77
- .square(@size: 5px) {
78
- .size(@size, @size);
79
- }
80
-
81
- // Placeholder text
82
- // -------------------------
83
- .placeholder(@color: @placeholderText) {
84
- :-moz-placeholder {
85
- color: @color;
86
- }
87
- ::-webkit-input-placeholder {
88
- color: @color;
89
- }
90
- }
91
-
92
-
93
-
94
- // FONTS
95
- // --------------------------------------------------
96
-
97
- #font {
98
- #family {
99
- .serif() {
100
- font-family: Georgia, "Times New Roman", Times, serif;
101
- }
102
- .sans-serif() {
103
- font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
104
- }
105
- .monospace() {
106
- font-family: Menlo, Monaco, "Courier New", monospace;
107
- }
108
- }
109
- .shorthand(@size: @baseFontSize, @weight: normal, @lineHeight: @baseLineHeight) {
110
- font-size: @size;
111
- font-weight: @weight;
112
- line-height: @lineHeight;
113
- }
114
- .serif(@size: @baseFontSize, @weight: normal, @lineHeight: @baseLineHeight) {
115
- #font > #family > .serif;
116
- #font > .shorthand(@size, @weight, @lineHeight);
117
- }
118
- .sans-serif(@size: @baseFontSize, @weight: normal, @lineHeight: @baseLineHeight) {
119
- #font > #family > .sans-serif;
120
- #font > .shorthand(@size, @weight, @lineHeight);
121
- }
122
- .monospace(@size: @baseFontSize, @weight: normal, @lineHeight: @baseLineHeight) {
123
- #font > #family > .monospace;
124
- #font > .shorthand(@size, @weight, @lineHeight);
125
- }
126
- }
127
-
128
-
129
-
130
- // GRID SYSTEM
131
- // --------------------------------------------------
132
-
133
- // Site container
134
- // -------------------------
135
- .container-fixed() {
136
- width: @gridRowWidth;
137
- margin-left: auto;
138
- margin-right: auto;
139
- .clearfix();
140
- }
141
-
142
- // Le grid system
143
- // -------------------------
144
- #gridSystem {
145
- // Setup the mixins to be used
146
- .columns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, @columns) {
147
- width: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1));
148
- }
149
- .offset(@gridColumnWidth, @gridGutterWidth, @columns) {
150
- margin-left: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1)) + (@gridGutterWidth * 2);
151
- }
152
- .gridColumn(@gridGutterWidth) {
153
- float: left;
154
- margin-left: @gridGutterWidth;
155
- }
156
- // Take these values and mixins, and make 'em do their thang
157
- .generate(@gridColumns, @gridColumnWidth, @gridGutterWidth) {
158
- // Row surrounds the columns
159
- .row {
160
- margin-left: @gridGutterWidth * -1;
161
- .clearfix();
162
- }
163
- // Find all .span# classes within .row and give them the necessary properties for grid columns (supported by all browsers back to IE7, thanks @dhg)
164
- [class*="span"] {
165
- #gridSystem > .gridColumn(@gridGutterWidth);
166
- }
167
- // Default columns
168
- .span1 { #gridSystem > .columns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 1); }
169
- .span2 { #gridSystem > .columns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 2); }
170
- .span3 { #gridSystem > .columns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 3); }
171
- .span4 { #gridSystem > .columns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 4); }
172
- .span5 { #gridSystem > .columns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 5); }
173
- .span6 { #gridSystem > .columns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 6); }
174
- .span7 { #gridSystem > .columns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 7); }
175
- .span8 { #gridSystem > .columns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 8); }
176
- .span9 { #gridSystem > .columns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 9); }
177
- .span10 { #gridSystem > .columns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 10); }
178
- .span11 { #gridSystem > .columns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 11); }
179
- .span12,
180
- .container { #gridSystem > .columns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 12); }
181
- // Offset column options
182
- .offset1 { #gridSystem > .offset(@gridColumnWidth, @gridGutterWidth, 1); }
183
- .offset2 { #gridSystem > .offset(@gridColumnWidth, @gridGutterWidth, 2); }
184
- .offset3 { #gridSystem > .offset(@gridColumnWidth, @gridGutterWidth, 3); }
185
- .offset4 { #gridSystem > .offset(@gridColumnWidth, @gridGutterWidth, 4); }
186
- .offset5 { #gridSystem > .offset(@gridColumnWidth, @gridGutterWidth, 5); }
187
- .offset6 { #gridSystem > .offset(@gridColumnWidth, @gridGutterWidth, 6); }
188
- .offset7 { #gridSystem > .offset(@gridColumnWidth, @gridGutterWidth, 7); }
189
- .offset8 { #gridSystem > .offset(@gridColumnWidth, @gridGutterWidth, 8); }
190
- .offset9 { #gridSystem > .offset(@gridColumnWidth, @gridGutterWidth, 9); }
191
- .offset10 { #gridSystem > .offset(@gridColumnWidth, @gridGutterWidth, 10); }
192
- .offset11 { #gridSystem > .offset(@gridColumnWidth, @gridGutterWidth, 11); }
193
- }
194
- }
195
-
196
- // Fluid grid system
197
- // -------------------------
198
- #fluidGridSystem {
199
- // Setup the mixins to be used
200
- .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, @columns) {
201
- width: 1% * (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1));
202
- }
203
- .gridColumn(@fluidGridGutterWidth) {
204
- float: left;
205
- margin-left: @fluidGridGutterWidth;
206
- }
207
- // Take these values and mixins, and make 'em do their thang
208
- .generate(@gridColumns, @fluidGridColumnWidth, @fluidGridGutterWidth) {
209
- // Row surrounds the columns
210
- .row-fluid {
211
- width: 100%;
212
- .clearfix();
213
-
214
- // Find all .span# classes within .row and give them the necessary properties for grid columns (supported by all browsers back to IE7, thanks @dhg)
215
- > [class*="span"] {
216
- #fluidGridSystem > .gridColumn(@fluidGridGutterWidth);
217
- }
218
- > [class*="span"]:first-child {
219
- margin-left: 0;
220
- }
221
- // Default columns
222
- .span1 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 1); }
223
- .span2 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 2); }
224
- .span3 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 3); }
225
- .span4 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 4); }
226
- .span5 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 5); }
227
- .span6 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 6); }
228
- .span7 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 7); }
229
- .span8 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 8); }
230
- .span9 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 9); }
231
- .span10 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 10); }
232
- .span11 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 11); }
233
- .span12 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 12); }
234
- }
235
- }
236
- }
237
-
238
-
239
-
240
- // Input grid system
241
- // -------------------------
242
- #inputGridSystem {
243
- .inputColumns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, @columns) {
244
- width: ((@gridColumnWidth) * @columns) + (@gridGutterWidth * (@columns - 1)) - 10;
245
- }
246
- .generate(@gridColumns, @gridColumnWidth, @gridGutterWidth) {
247
- input,
248
- textarea,
249
- .uneditable-input {
250
- &.span1 { #inputGridSystem > .inputColumns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 1); }
251
- &.span2 { #inputGridSystem > .inputColumns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 2); }
252
- &.span3 { #inputGridSystem > .inputColumns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 3); }
253
- &.span4 { #inputGridSystem > .inputColumns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 4); }
254
- &.span5 { #inputGridSystem > .inputColumns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 5); }
255
- &.span6 { #inputGridSystem > .inputColumns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 6); }
256
- &.span7 { #inputGridSystem > .inputColumns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 7); }
257
- &.span8 { #inputGridSystem > .inputColumns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 8); }
258
- &.span9 { #inputGridSystem > .inputColumns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 9); }
259
- &.span10 { #inputGridSystem > .inputColumns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 10); }
260
- &.span11 { #inputGridSystem > .inputColumns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 11); }
261
- &.span12 { #inputGridSystem > .inputColumns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 12); }
262
- }
263
- }
264
- }
265
-
266
-
267
-
268
- // CSS3 PROPERTIES
269
- // --------------------------------------------------
270
-
271
- // Border Radius
272
- .border-radius(@radius: 5px) {
273
- -webkit-border-radius: @radius;
274
- -moz-border-radius: @radius;
275
- border-radius: @radius;
276
- }
277
-
278
- // Drop shadows
279
- .box-shadow(@shadow: 0 1px 3px rgba(0,0,0,.25)) {
280
- -webkit-box-shadow: @shadow;
281
- -moz-box-shadow: @shadow;
282
- box-shadow: @shadow;
283
- }
284
-
285
- // Transitions
286
- .transition(@transition) {
287
- -webkit-transition: @transition;
288
- -moz-transition: @transition;
289
- -ms-transition: @transition;
290
- -o-transition: @transition;
291
- transition: @transition;
292
- }
293
-
294
- // Transformations
295
- .rotate(@degrees) {
296
- -webkit-transform: rotate(@degrees);
297
- -moz-transform: rotate(@degrees);
298
- -ms-transform: rotate(@degrees);
299
- -o-transform: rotate(@degrees);
300
- transform: rotate(@degrees);
301
- }
302
- .scale(@ratio) {
303
- -webkit-transform: scale(@ratio);
304
- -moz-transform: scale(@ratio);
305
- -ms-transform: scale(@ratio);
306
- -o-transform: scale(@ratio);
307
- transform: scale(@ratio);
308
- }
309
- .translate(@x: 0, @y: 0) {
310
- -webkit-transform: translate(@x, @y);
311
- -moz-transform: translate(@x, @y);
312
- -ms-transform: translate(@x, @y);
313
- -o-transform: translate(@x, @y);
314
- transform: translate(@x, @y);
315
- }
316
- .skew(@x: 0, @y: 0) {
317
- -webkit-transform: translate(@x, @y);
318
- -moz-transform: translate(@x, @y);
319
- -ms-transform: translate(@x, @y);
320
- -o-transform: translate(@x, @y);
321
- transform: translate(@x, @y);
322
- }
323
- .skew(@x: 0, @y: 0) {
324
- -webkit-transform: skew(@x, @y);
325
- -moz-transform: skew(@x, @y);
326
- -ms-transform: skew(@x, @y);
327
- -o-transform: skew(@x, @y);
328
- transform: skew(@x, @y);
329
- }
330
-
331
- // Background clipping
332
- // Heads up: FF 3.6 and under need "padding" instead of "padding-box"
333
- .background-clip(@clip) {
334
- -webkit-background-clip: @clip;
335
- -moz-background-clip: @clip;
336
- background-clip: @clip;
337
- }
338
-
339
- // Background sizing
340
- .background-size(@size){
341
- -webkit-background-size: @size;
342
- -moz-background-size: @size;
343
- -o-background-size: @size;
344
- background-size: @size;
345
- }
346
-
347
-
348
- // Box sizing
349
- .box-sizing(@boxmodel) {
350
- -webkit-box-sizing: @boxmodel;
351
- -moz-box-sizing: @boxmodel;
352
- box-sizing: @boxmodel;
353
- }
354
-
355
- // User select
356
- // For selecting text on the page
357
- .user-select(@select) {
358
- -webkit-user-select: @select;
359
- -moz-user-select: @select;
360
- -o-user-select: @select;
361
- user-select: @select;
362
- }
363
-
364
- // Resize anything
365
- .resizable(@direction: both) {
366
- resize: @direction; // Options: horizontal, vertical, both
367
- overflow: auto; // Safari fix
368
- }
369
-
370
- // CSS3 Content Columns
371
- .content-columns(@columnCount, @columnGap: @gridColumnGutter) {
372
- -webkit-column-count: @columnCount;
373
- -moz-column-count: @columnCount;
374
- column-count: @columnCount;
375
- -webkit-column-gap: @columnGap;
376
- -moz-column-gap: @columnGap;
377
- column-gap: @columnGap;
378
- }
379
-
380
- // Opacity
381
- .opacity(@opacity: 100) {
382
- opacity: @opacity / 100;
383
- filter: e(%("alpha(opacity=%d)", @opacity));
384
- }
385
-
386
-
387
-
388
- // BACKGROUNDS
389
- // --------------------------------------------------
390
-
391
- // Add an alphatransparency value to any background or border color (via Elyse Holladay)
392
- #translucent {
393
- .background(@color: @white, @alpha: 1) {
394
- background-color: hsla(hue(@color), saturation(@color), lightness(@color), @alpha);
395
- }
396
- .border(@color: @white, @alpha: 1) {
397
- border-color: hsla(hue(@color), saturation(@color), lightness(@color), @alpha);
398
- .background-clip(padding-box);
399
- }
400
- }
401
-
402
- // Gradient Bar Colors for buttons and alerts
403
- .gradientBar(@primaryColor, @secondaryColor) {
404
- #gradient > .vertical(@primaryColor, @secondaryColor);
405
- border-color: @secondaryColor @secondaryColor darken(@secondaryColor, 15%);
406
- border-color: rgba(0,0,0,.1) rgba(0,0,0,.1) fadein(rgba(0,0,0,.1), 15%);
407
- }
408
-
409
- // Gradients
410
- #gradient {
411
- .horizontal(@startColor: #555, @endColor: #333) {
412
- background-color: @endColor;
413
- background-image: -moz-linear-gradient(left, @startColor, @endColor); // FF 3.6+
414
- background-image: -ms-linear-gradient(left, @startColor, @endColor); // IE10
415
- background-image: -webkit-gradient(linear, 0 0, 100% 0, from(@startColor), to(@endColor)); // Safari 4+, Chrome 2+
416
- background-image: -webkit-linear-gradient(left, @startColor, @endColor); // Safari 5.1+, Chrome 10+
417
- background-image: -o-linear-gradient(left, @startColor, @endColor); // Opera 11.10
418
- background-image: linear-gradient(left, @startColor, @endColor); // Le standard
419
- background-repeat: repeat-x;
420
- filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",@startColor,@endColor)); // IE9 and down
421
- }
422
- .vertical(@startColor: #555, @endColor: #333) {
423
- background-color: mix(@startColor, @endColor, 60%);
424
- background-image: -moz-linear-gradient(top, @startColor, @endColor); // FF 3.6+
425
- background-image: -ms-linear-gradient(top, @startColor, @endColor); // IE10
426
- background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@startColor), to(@endColor)); // Safari 4+, Chrome 2+
427
- background-image: -webkit-linear-gradient(top, @startColor, @endColor); // Safari 5.1+, Chrome 10+
428
- background-image: -o-linear-gradient(top, @startColor, @endColor); // Opera 11.10
429
- background-image: linear-gradient(top, @startColor, @endColor); // The standard
430
- background-repeat: repeat-x;
431
- filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",@startColor,@endColor)); // IE9 and down
432
- }
433
- .directional(@startColor: #555, @endColor: #333, @deg: 45deg) {
434
- background-color: @endColor;
435
- background-repeat: repeat-x;
436
- background-image: -moz-linear-gradient(@deg, @startColor, @endColor); // FF 3.6+
437
- background-image: -ms-linear-gradient(@deg, @startColor, @endColor); // IE10
438
- background-image: -webkit-linear-gradient(@deg, @startColor, @endColor); // Safari 5.1+, Chrome 10+
439
- background-image: -o-linear-gradient(@deg, @startColor, @endColor); // Opera 11.10
440
- background-image: linear-gradient(@deg, @startColor, @endColor); // The standard
441
- }
442
- .vertical-three-colors(@startColor: #00b3ee, @midColor: #7a43b6, @colorStop: 50%, @endColor: #c3325f) {
443
- background-color: mix(@midColor, @endColor, 80%);
444
- background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@startColor), color-stop(@colorStop, @midColor), to(@endColor));
445
- background-image: -webkit-linear-gradient(@startColor, @midColor @colorStop, @endColor);
446
- background-image: -moz-linear-gradient(top, @startColor, @midColor @colorStop, @endColor);
447
- background-image: -ms-linear-gradient(@startColor, @midColor @colorStop, @endColor);
448
- background-image: -o-linear-gradient(@startColor, @midColor @colorStop, @endColor);
449
- background-image: linear-gradient(@startColor, @midColor @colorStop, @endColor);
450
- background-repeat: no-repeat;
451
- filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",@startColor,@endColor)); // IE9 and down, gets no color-stop at all for proper fallback
452
- }
453
- .radial(@innerColor: #555, @outerColor: #333) {
454
- background-color: @outerColor;
455
- background-image: -webkit-gradient(radial, center center, 0, center center, 460, from(@innerColor), to(@outerColor));
456
- background-image: -webkit-radial-gradient(circle, @innerColor, @outerColor);
457
- background-image: -moz-radial-gradient(circle, @innerColor, @outerColor);
458
- background-image: -ms-radial-gradient(circle, @innerColor, @outerColor);
459
- background-repeat: no-repeat;
460
- // Opera cannot do radial gradients yet
461
- }
462
- .striped(@color, @angle: -45deg) {
463
- background-color: @color;
464
- background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(.25, rgba(255,255,255,.15)), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, rgba(255,255,255,.15)), color-stop(.75, rgba(255,255,255,.15)), color-stop(.75, transparent), to(transparent));
465
- background-image: -webkit-linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
466
- background-image: -moz-linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
467
- background-image: -ms-linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
468
- background-image: -o-linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
469
- background-image: linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
470
- }
471
- }
472
- // Reset filters for IE
473
- .reset-filter() {
474
- filter: e(%("progid:DXImageTransform.Microsoft.gradient(enabled = false)"));
475
- }
476
-
477
-
478
- // Mixin for generating button backgrounds
479
- // ---------------------------------------
480
- .buttonBackground(@startColor, @endColor) {
481
- // gradientBar will set the background to a pleasing blend of these, to support IE<=9
482
- .gradientBar(@startColor, @endColor);
483
- .reset-filter();
484
-
485
- // in these cases the gradient won't cover the background, so we override
486
- &:hover, &:active, &.active, &.disabled, &[disabled] {
487
- background-color: @endColor;
488
- }
489
-
490
- // IE 7 + 8 can't handle box-shadow to show active, so we darken a bit ourselves
491
- &:active,
492
- &.active {
493
- background-color: darken(@endColor, 10%) e("\9");
494
- }
495
- }
496
-
497
-
498
- // COMPONENT MIXINS
499
- // --------------------------------------------------
500
-
501
- // POPOVER ARROWS
502
- // -------------------------
503
- // For tipsies and popovers
504
- #popoverArrow {
505
- .top(@arrowWidth: 5px) {
506
- bottom: 0;
507
- left: 50%;
508
- margin-left: -@arrowWidth;
509
- border-left: @arrowWidth solid transparent;
510
- border-right: @arrowWidth solid transparent;
511
- border-top: @arrowWidth solid @black;
512
- }
513
- .left(@arrowWidth: 5px) {
514
- top: 50%;
515
- right: 0;
516
- margin-top: -@arrowWidth;
517
- border-top: @arrowWidth solid transparent;
518
- border-bottom: @arrowWidth solid transparent;
519
- border-left: @arrowWidth solid @black;
520
- }
521
- .bottom(@arrowWidth: 5px) {
522
- top: 0;
523
- left: 50%;
524
- margin-left: -@arrowWidth;
525
- border-left: @arrowWidth solid transparent;
526
- border-right: @arrowWidth solid transparent;
527
- border-bottom: @arrowWidth solid @black;
528
- }
529
- .right(@arrowWidth: 5px) {
530
- top: 50%;
531
- left: 0;
532
- margin-top: -@arrowWidth;
533
- border-top: @arrowWidth solid transparent;
534
- border-bottom: @arrowWidth solid transparent;
535
- border-right: @arrowWidth solid @black;
536
- }
537
- }