rbootstrap 1.1.2

Sign up to get free protection for your applications and to get access to all the features.
Files changed (111) hide show
  1. data/README.md +282 -0
  2. data/Rakefile +14 -0
  3. data/app/helpers/bootstrap_flash_helper.rb +17 -0
  4. data/app/helpers/flash_block_helper.rb +17 -0
  5. data/app/helpers/glyph_helper.rb +12 -0
  6. data/app/helpers/modal_helper.rb +42 -0
  7. data/app/helpers/twitter_breadcrumbs_helper.rb +5 -0
  8. data/app/views/twitter-bootstrap/_breadcrumbs.html.erb +14 -0
  9. data/lib/generators/bootstrap/install/install_generator.rb +57 -0
  10. data/lib/generators/bootstrap/install/templates/application.css +7 -0
  11. data/lib/generators/bootstrap/install/templates/application.js +10 -0
  12. data/lib/generators/bootstrap/install/templates/bootstrap.coffee +4 -0
  13. data/lib/generators/bootstrap/install/templates/bootstrap.js +5 -0
  14. data/lib/generators/bootstrap/install/templates/bootstrap_and_overrides.less +31 -0
  15. data/lib/generators/bootstrap/layout/layout_generator.rb +23 -0
  16. data/lib/generators/bootstrap/layout/templates/layout.html.erb +108 -0
  17. data/lib/generators/bootstrap/layout/templates/layout.html.haml +68 -0
  18. data/lib/generators/bootstrap/layout/templates/layout.html.slim +68 -0
  19. data/lib/generators/bootstrap/partial/partial_generator.rb +20 -0
  20. data/lib/generators/bootstrap/partial/templates/_login.html.erb +29 -0
  21. data/lib/generators/bootstrap/partial/templates/_navbar.html.erb +13 -0
  22. data/lib/generators/bootstrap/themed/templates/_form.html.erb +16 -0
  23. data/lib/generators/bootstrap/themed/templates/_form.html.haml +10 -0
  24. data/lib/generators/bootstrap/themed/templates/_form.html.slim +11 -0
  25. data/lib/generators/bootstrap/themed/templates/edit.html.erb +6 -0
  26. data/lib/generators/bootstrap/themed/templates/edit.html.haml +4 -0
  27. data/lib/generators/bootstrap/themed/templates/edit.html.slim +4 -0
  28. data/lib/generators/bootstrap/themed/templates/index.html.erb +40 -0
  29. data/lib/generators/bootstrap/themed/templates/index.html.haml +25 -0
  30. data/lib/generators/bootstrap/themed/templates/index.html.slim +27 -0
  31. data/lib/generators/bootstrap/themed/templates/new.html.erb +6 -0
  32. data/lib/generators/bootstrap/themed/templates/new.html.haml +4 -0
  33. data/lib/generators/bootstrap/themed/templates/new.html.slim +4 -0
  34. data/lib/generators/bootstrap/themed/templates/show.html.erb +23 -0
  35. data/lib/generators/bootstrap/themed/templates/show.html.haml +15 -0
  36. data/lib/generators/bootstrap/themed/templates/show.html.slim +17 -0
  37. data/lib/generators/bootstrap/themed/templates/simple_form/_form.html.erb +14 -0
  38. data/lib/generators/bootstrap/themed/templates/simple_form/_form.html.haml +11 -0
  39. data/lib/generators/bootstrap/themed/templates/simple_form/_form.html.slim +12 -0
  40. data/lib/generators/bootstrap/themed/themed_generator.rb +110 -0
  41. data/lib/twitter-bootstrap-rails.rb +10 -0
  42. data/lib/twitter/bootstrap/rails/bootstrap.rb +2 -0
  43. data/lib/twitter/bootstrap/rails/engine.rb +29 -0
  44. data/lib/twitter/bootstrap/rails/twitter-bootstrap-breadcrumbs.rb +30 -0
  45. data/lib/twitter/bootstrap/rails/version.rb +7 -0
  46. data/vendor/assets/fonts/fontawesome-webfont.eot +0 -0
  47. data/vendor/assets/fonts/fontawesome-webfont.svg +255 -0
  48. data/vendor/assets/fonts/fontawesome-webfont.ttf +0 -0
  49. data/vendor/assets/fonts/fontawesome-webfont.woff +0 -0
  50. data/vendor/assets/images/twitter/bootstrap/glyphicons-halflings-white.png +0 -0
  51. data/vendor/assets/images/twitter/bootstrap/glyphicons-halflings.png +0 -0
  52. data/vendor/assets/javascripts/twitter/bootstrap.js +13 -0
  53. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-affix.js +106 -0
  54. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-alert.js +88 -0
  55. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-button.js +94 -0
  56. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-carousel.js +176 -0
  57. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-collapse.js +156 -0
  58. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-dropdown.js +148 -0
  59. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-modal.js +234 -0
  60. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-popover.js +103 -0
  61. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-scrollspy.js +151 -0
  62. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-tab.js +133 -0
  63. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-tooltip.js +276 -0
  64. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-transition.js +60 -0
  65. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-typeahead.js +311 -0
  66. data/vendor/assets/javascripts/twitter/bootstrap_ujs.js +11 -0
  67. data/vendor/toolkit/font-awesome-ie7.less +245 -0
  68. data/vendor/toolkit/fontawesome.less +328 -0
  69. data/vendor/toolkit/twitter/bootstrap/accordion.less +34 -0
  70. data/vendor/toolkit/twitter/bootstrap/alerts.less +65 -0
  71. data/vendor/toolkit/twitter/bootstrap/bootstrap.less +63 -0
  72. data/vendor/toolkit/twitter/bootstrap/breadcrumbs.less +24 -0
  73. data/vendor/toolkit/twitter/bootstrap/button-groups.less +242 -0
  74. data/vendor/toolkit/twitter/bootstrap/buttons.less +232 -0
  75. data/vendor/toolkit/twitter/bootstrap/carousel.less +131 -0
  76. data/vendor/toolkit/twitter/bootstrap/close.less +31 -0
  77. data/vendor/toolkit/twitter/bootstrap/code.less +59 -0
  78. data/vendor/toolkit/twitter/bootstrap/component-animations.less +22 -0
  79. data/vendor/toolkit/twitter/bootstrap/dropdowns.less +237 -0
  80. data/vendor/toolkit/twitter/bootstrap/forms.less +683 -0
  81. data/vendor/toolkit/twitter/bootstrap/grid.less +21 -0
  82. data/vendor/toolkit/twitter/bootstrap/hero-unit.less +25 -0
  83. data/vendor/toolkit/twitter/bootstrap/labels-badges.less +74 -0
  84. data/vendor/toolkit/twitter/bootstrap/layouts.less +16 -0
  85. data/vendor/toolkit/twitter/bootstrap/media.less +55 -0
  86. data/vendor/toolkit/twitter/bootstrap/mixins.less +686 -0
  87. data/vendor/toolkit/twitter/bootstrap/modals.less +94 -0
  88. data/vendor/toolkit/twitter/bootstrap/navbar.less +472 -0
  89. data/vendor/toolkit/twitter/bootstrap/navs.less +385 -0
  90. data/vendor/toolkit/twitter/bootstrap/pager.less +41 -0
  91. data/vendor/toolkit/twitter/bootstrap/pagination.less +121 -0
  92. data/vendor/toolkit/twitter/bootstrap/popovers.less +117 -0
  93. data/vendor/toolkit/twitter/bootstrap/progress-bars.less +122 -0
  94. data/vendor/toolkit/twitter/bootstrap/reset.less +138 -0
  95. data/vendor/toolkit/twitter/bootstrap/responsive-1200px-min.less +28 -0
  96. data/vendor/toolkit/twitter/bootstrap/responsive-767px-max.less +193 -0
  97. data/vendor/toolkit/twitter/bootstrap/responsive-768px-979px.less +19 -0
  98. data/vendor/toolkit/twitter/bootstrap/responsive-navbar.less +185 -0
  99. data/vendor/toolkit/twitter/bootstrap/responsive-utilities.less +43 -0
  100. data/vendor/toolkit/twitter/bootstrap/responsive.less +48 -0
  101. data/vendor/toolkit/twitter/bootstrap/scaffolding.less +52 -0
  102. data/vendor/toolkit/twitter/bootstrap/sprites.less +193 -0
  103. data/vendor/toolkit/twitter/bootstrap/tables.less +236 -0
  104. data/vendor/toolkit/twitter/bootstrap/thumbnails.less +52 -0
  105. data/vendor/toolkit/twitter/bootstrap/tooltip.less +70 -0
  106. data/vendor/toolkit/twitter/bootstrap/type.less +230 -0
  107. data/vendor/toolkit/twitter/bootstrap/utilities.less +30 -0
  108. data/vendor/toolkit/twitter/bootstrap/variables.less +301 -0
  109. data/vendor/toolkit/twitter/bootstrap/wells.less +29 -0
  110. data/vendor/toolkit/twitter/bootstrap_base.less +2 -0
  111. metadata +224 -0
@@ -0,0 +1,21 @@
1
+ //
2
+ // Grid system
3
+ // --------------------------------------------------
4
+
5
+
6
+ // Fixed (940px)
7
+ #grid > .core(@gridColumnWidth, @gridGutterWidth);
8
+
9
+ // Fluid (940px)
10
+ #grid > .fluid(@fluidGridColumnWidth, @fluidGridGutterWidth);
11
+
12
+ // Reset utility classes due to specificity
13
+ [class*="span"].hide,
14
+ .row-fluid [class*="span"].hide {
15
+ display: none;
16
+ }
17
+
18
+ [class*="span"].pull-right,
19
+ .row-fluid [class*="span"].pull-right {
20
+ float: right;
21
+ }
@@ -0,0 +1,25 @@
1
+ //
2
+ // Hero unit
3
+ // --------------------------------------------------
4
+
5
+
6
+ .hero-unit {
7
+ padding: 60px;
8
+ margin-bottom: 30px;
9
+ font-size: 18px;
10
+ font-weight: 200;
11
+ line-height: @baseLineHeight * 1.5;
12
+ color: @heroUnitLeadColor;
13
+ background-color: @heroUnitBackground;
14
+ .border-radius(6px);
15
+ h1 {
16
+ margin-bottom: 0;
17
+ font-size: 60px;
18
+ line-height: 1;
19
+ color: @heroUnitHeadingColor;
20
+ letter-spacing: -1px;
21
+ }
22
+ li {
23
+ line-height: @baseLineHeight * 1.5; // Reset since we specify in type.less
24
+ }
25
+ }
@@ -0,0 +1,74 @@
1
+ //
2
+ // Labels and badges
3
+ // --------------------------------------------------
4
+
5
+
6
+ // Base classes
7
+ .label,
8
+ .badge {
9
+ display: inline-block;
10
+ padding: 2px 4px;
11
+ font-size: @baseFontSize * .846;
12
+ font-weight: bold;
13
+ line-height: 14px; // ensure proper line-height if floated
14
+ color: @white;
15
+ vertical-align: baseline;
16
+ white-space: nowrap;
17
+ text-shadow: 0 -1px 0 rgba(0,0,0,.25);
18
+ background-color: @grayLight;
19
+ }
20
+ // Set unique padding and border-radii
21
+ .label {
22
+ .border-radius(3px);
23
+ }
24
+ .badge {
25
+ padding-left: 9px;
26
+ padding-right: 9px;
27
+ .border-radius(9px);
28
+ }
29
+
30
+ // Hover state, but only for links
31
+ a {
32
+ &.label:hover,
33
+ &.badge:hover {
34
+ color: @white;
35
+ text-decoration: none;
36
+ cursor: pointer;
37
+ }
38
+ }
39
+
40
+ // Colors
41
+ // Only give background-color difference to links (and to simplify, we don't qualifty with `a` but [href] attribute)
42
+ .label,
43
+ .badge {
44
+ // Important (red)
45
+ &-important { background-color: @errorText; }
46
+ &-important[href] { background-color: darken(@errorText, 10%); }
47
+ // Warnings (orange)
48
+ &-warning { background-color: @orange; }
49
+ &-warning[href] { background-color: darken(@orange, 10%); }
50
+ // Success (green)
51
+ &-success { background-color: @successText; }
52
+ &-success[href] { background-color: darken(@successText, 10%); }
53
+ // Info (turquoise)
54
+ &-info { background-color: @infoText; }
55
+ &-info[href] { background-color: darken(@infoText, 10%); }
56
+ // Inverse (black)
57
+ &-inverse { background-color: @grayDark; }
58
+ &-inverse[href] { background-color: darken(@grayDark, 10%); }
59
+ }
60
+
61
+ // Quick fix for labels/badges in buttons
62
+ .btn {
63
+ .label,
64
+ .badge {
65
+ position: relative;
66
+ top: -1px;
67
+ }
68
+ }
69
+ .btn-mini {
70
+ .label,
71
+ .badge {
72
+ top: 0;
73
+ }
74
+ }
@@ -0,0 +1,16 @@
1
+ //
2
+ // Layouts
3
+ // --------------------------------------------------
4
+
5
+
6
+ // Container (centered, fixed-width layouts)
7
+ .container {
8
+ .container-fixed();
9
+ }
10
+
11
+ // Fluid layouts (left aligned, with sidebar, min- & max-width content)
12
+ .container-fluid {
13
+ padding-right: @gridGutterWidth;
14
+ padding-left: @gridGutterWidth;
15
+ .clearfix();
16
+ }
@@ -0,0 +1,55 @@
1
+ // Media objects
2
+ // Source: http://stubbornella.org/content/?p=497
3
+ // --------------------------------------------------
4
+
5
+
6
+ // Common styles
7
+ // -------------------------
8
+
9
+ // Clear the floats
10
+ .media,
11
+ .media-body {
12
+ overflow: hidden;
13
+ *overflow: visible;
14
+ zoom: 1;
15
+ }
16
+
17
+ // Proper spacing between instances of .media
18
+ .media,
19
+ .media .media {
20
+ margin-top: 15px;
21
+ }
22
+ .media:first-child {
23
+ margin-top: 0;
24
+ }
25
+
26
+ // For images and videos, set to block
27
+ .media-object {
28
+ display: block;
29
+ }
30
+
31
+ // Reset margins on headings for tighter default spacing
32
+ .media-heading {
33
+ margin: 0 0 5px;
34
+ }
35
+
36
+
37
+ // Media image alignment
38
+ // -------------------------
39
+
40
+ .media .pull-left {
41
+ margin-right: 10px;
42
+ }
43
+ .media .pull-right {
44
+ margin-left: 10px;
45
+ }
46
+
47
+
48
+ // Media list variation
49
+ // -------------------------
50
+
51
+ // Undo default ul/ol styles
52
+ .media-list {
53
+ margin-right: 0;
54
+ list-style: none;
55
+ }
@@ -0,0 +1,686 @@
1
+ //
2
+ // Mixins
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
+ // Fixes Opera/contenteditable bug:
19
+ // http://nicolasgallagher.com/micro-clearfix-hack/#comment-36952
20
+ line-height: 0;
21
+ }
22
+ &:after {
23
+ clear: both;
24
+ }
25
+ }
26
+
27
+ // Webkit-style focus
28
+ // ------------------
29
+ .tab-focus() {
30
+ // Default
31
+ outline: thin dotted #333;
32
+ // Webkit
33
+ outline: 5px auto -webkit-focus-ring-color;
34
+ outline-offset: -2px;
35
+ }
36
+
37
+ // Center-align a block level element
38
+ // ----------------------------------
39
+ .center-block() {
40
+ display: block;
41
+ margin-left: auto;
42
+ margin-right: auto;
43
+ }
44
+
45
+ // IE7 inline-block
46
+ // ----------------
47
+ .ie7-inline-block() {
48
+ *display: inline; /* IE7 inline-block hack */
49
+ *zoom: 1;
50
+ }
51
+
52
+ // IE7 likes to collapse whitespace on either side of the inline-block elements.
53
+ // Ems because we're attempting to match the width of a space character. Left
54
+ // version is for form buttons, which typically come after other elements, and
55
+ // right version is for icons, which come before. Applying both is ok, but it will
56
+ // mean that space between those elements will be .6em (~2 space characters) in IE7,
57
+ // instead of the 1 space in other browsers.
58
+ .ie7-restore-left-whitespace() {
59
+ *margin-left: .3em;
60
+
61
+ &:first-child {
62
+ *margin-left: 0;
63
+ }
64
+ }
65
+
66
+ .ie7-restore-right-whitespace() {
67
+ *margin-right: .3em;
68
+ }
69
+
70
+ // Sizing shortcuts
71
+ // -------------------------
72
+ .size(@height, @width) {
73
+ width: @width;
74
+ height: @height;
75
+ }
76
+ .square(@size) {
77
+ .size(@size, @size);
78
+ }
79
+
80
+ // Placeholder text
81
+ // -------------------------
82
+ .placeholder(@color: @placeholderText) {
83
+ &:-moz-placeholder {
84
+ color: @color;
85
+ }
86
+ &:-ms-input-placeholder {
87
+ color: @color;
88
+ }
89
+ &::-webkit-input-placeholder {
90
+ color: @color;
91
+ }
92
+ }
93
+
94
+ // Text overflow
95
+ // -------------------------
96
+ // Requires inline-block or block for proper styling
97
+ .text-overflow() {
98
+ overflow: hidden;
99
+ text-overflow: ellipsis;
100
+ white-space: nowrap;
101
+ }
102
+
103
+ // CSS image replacement
104
+ // -------------------------
105
+ // Source: https://github.com/h5bp/html5-boilerplate/commit/aa0396eae757
106
+ .hide-text {
107
+ font: 0/0 a;
108
+ color: transparent;
109
+ text-shadow: none;
110
+ background-color: transparent;
111
+ border: 0;
112
+ }
113
+
114
+
115
+ // FONTS
116
+ // --------------------------------------------------
117
+
118
+ #font {
119
+ #family {
120
+ .serif() {
121
+ font-family: @serifFontFamily;
122
+ }
123
+ .sans-serif() {
124
+ font-family: @sansFontFamily;
125
+ }
126
+ .monospace() {
127
+ font-family: @monoFontFamily;
128
+ }
129
+ }
130
+ .shorthand(@size: @baseFontSize, @weight: normal, @lineHeight: @baseLineHeight) {
131
+ font-size: @size;
132
+ font-weight: @weight;
133
+ line-height: @lineHeight;
134
+ }
135
+ .serif(@size: @baseFontSize, @weight: normal, @lineHeight: @baseLineHeight) {
136
+ #font > #family > .serif;
137
+ #font > .shorthand(@size, @weight, @lineHeight);
138
+ }
139
+ .sans-serif(@size: @baseFontSize, @weight: normal, @lineHeight: @baseLineHeight) {
140
+ #font > #family > .sans-serif;
141
+ #font > .shorthand(@size, @weight, @lineHeight);
142
+ }
143
+ .monospace(@size: @baseFontSize, @weight: normal, @lineHeight: @baseLineHeight) {
144
+ #font > #family > .monospace;
145
+ #font > .shorthand(@size, @weight, @lineHeight);
146
+ }
147
+ }
148
+
149
+
150
+ // FORMS
151
+ // --------------------------------------------------
152
+
153
+ // Block level inputs
154
+ .input-block-level {
155
+ display: block;
156
+ width: 100%;
157
+ min-height: @inputHeight; // Make inputs at least the height of their button counterpart (base line-height + padding + border)
158
+ .box-sizing(border-box); // Makes inputs behave like true block-level elements
159
+ }
160
+
161
+
162
+
163
+ // Mixin for form field states
164
+ .formFieldState(@textColor: #555, @borderColor: #ccc, @backgroundColor: #f5f5f5) {
165
+ // Set the text color
166
+ > label,
167
+ .help-block,
168
+ .help-inline {
169
+ color: @textColor;
170
+ }
171
+ // Style inputs accordingly
172
+ .checkbox,
173
+ .radio,
174
+ input,
175
+ select,
176
+ textarea {
177
+ color: @textColor;
178
+ }
179
+ input,
180
+ select,
181
+ textarea {
182
+ border-color: @borderColor;
183
+ .box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); // Redeclare so transitions work
184
+ &:focus {
185
+ border-color: darken(@borderColor, 10%);
186
+ @shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px lighten(@borderColor, 20%);
187
+ .box-shadow(@shadow);
188
+ }
189
+ }
190
+ // Give a small background color for input-prepend/-append
191
+ .input-prepend .add-on,
192
+ .input-append .add-on {
193
+ color: @textColor;
194
+ background-color: @backgroundColor;
195
+ border-color: @textColor;
196
+ }
197
+ }
198
+
199
+
200
+
201
+ // CSS3 PROPERTIES
202
+ // --------------------------------------------------
203
+
204
+ // Border Radius
205
+ .border-radius(@radius) {
206
+ -webkit-border-radius: @radius;
207
+ -moz-border-radius: @radius;
208
+ border-radius: @radius;
209
+ }
210
+
211
+ // Single Corner Border Radius
212
+ .border-top-left-radius(@radius) {
213
+ -webkit-border-top-left-radius: @radius;
214
+ -moz-border-radius-topleft: @radius;
215
+ border-top-left-radius: @radius;
216
+ }
217
+ .border-top-right-radius(@radius) {
218
+ -webkit-border-top-right-radius: @radius;
219
+ -moz-border-radius-topright: @radius;
220
+ border-top-right-radius: @radius;
221
+ }
222
+ .border-bottom-right-radius(@radius) {
223
+ -webkit-border-bottom-right-radius: @radius;
224
+ -moz-border-radius-bottomright: @radius;
225
+ border-bottom-right-radius: @radius;
226
+ }
227
+ .border-bottom-left-radius(@radius) {
228
+ -webkit-border-bottom-left-radius: @radius;
229
+ -moz-border-radius-bottomleft: @radius;
230
+ border-bottom-left-radius: @radius;
231
+ }
232
+
233
+ // Single Side Border Radius
234
+ .border-top-radius(@radius) {
235
+ .border-top-right-radius(@radius);
236
+ .border-top-left-radius(@radius);
237
+ }
238
+ .border-right-radius(@radius) {
239
+ .border-top-right-radius(@radius);
240
+ .border-bottom-right-radius(@radius);
241
+ }
242
+ .border-bottom-radius(@radius) {
243
+ .border-bottom-right-radius(@radius);
244
+ .border-bottom-left-radius(@radius);
245
+ }
246
+ .border-left-radius(@radius) {
247
+ .border-top-left-radius(@radius);
248
+ .border-bottom-left-radius(@radius);
249
+ }
250
+
251
+ // Drop shadows
252
+ .box-shadow(@shadow) {
253
+ -webkit-box-shadow: @shadow;
254
+ -moz-box-shadow: @shadow;
255
+ box-shadow: @shadow;
256
+ }
257
+
258
+ // Transitions
259
+ .transition(@transition) {
260
+ -webkit-transition: @transition;
261
+ -moz-transition: @transition;
262
+ -o-transition: @transition;
263
+ transition: @transition;
264
+ }
265
+ .transition-delay(@transition-delay) {
266
+ -webkit-transition-delay: @transition-delay;
267
+ -moz-transition-delay: @transition-delay;
268
+ -o-transition-delay: @transition-delay;
269
+ transition-delay: @transition-delay;
270
+ }
271
+
272
+ // Transformations
273
+ .rotate(@degrees) {
274
+ -webkit-transform: rotate(@degrees);
275
+ -moz-transform: rotate(@degrees);
276
+ -ms-transform: rotate(@degrees);
277
+ -o-transform: rotate(@degrees);
278
+ transform: rotate(@degrees);
279
+ }
280
+ .scale(@ratio) {
281
+ -webkit-transform: scale(@ratio);
282
+ -moz-transform: scale(@ratio);
283
+ -ms-transform: scale(@ratio);
284
+ -o-transform: scale(@ratio);
285
+ transform: scale(@ratio);
286
+ }
287
+ .translate(@x, @y) {
288
+ -webkit-transform: translate(@x, @y);
289
+ -moz-transform: translate(@x, @y);
290
+ -ms-transform: translate(@x, @y);
291
+ -o-transform: translate(@x, @y);
292
+ transform: translate(@x, @y);
293
+ }
294
+ .skew(@x, @y) {
295
+ -webkit-transform: skew(@x, @y);
296
+ -moz-transform: skew(@x, @y);
297
+ -ms-transform: skewX(@x) skewY(@y); // See https://github.com/twitter/bootstrap/issues/4885
298
+ -o-transform: skew(@x, @y);
299
+ transform: skew(@x, @y);
300
+ -webkit-backface-visibility: hidden; // See https://github.com/twitter/bootstrap/issues/5319
301
+ }
302
+ .translate3d(@x, @y, @z) {
303
+ -webkit-transform: translate3d(@x, @y, @z);
304
+ -moz-transform: translate3d(@x, @y, @z);
305
+ -o-transform: translate3d(@x, @y, @z);
306
+ transform: translate3d(@x, @y, @z);
307
+ }
308
+
309
+ // Backface visibility
310
+ // Prevent browsers from flickering when using CSS 3D transforms.
311
+ // Default value is `visible`, but can be changed to `hidden
312
+ // See git pull https://github.com/dannykeane/bootstrap.git backface-visibility for examples
313
+ .backface-visibility(@visibility){
314
+ -webkit-backface-visibility: @visibility;
315
+ -moz-backface-visibility: @visibility;
316
+ backface-visibility: @visibility;
317
+ }
318
+
319
+ // Background clipping
320
+ // Heads up: FF 3.6 and under need "padding" instead of "padding-box"
321
+ .background-clip(@clip) {
322
+ -webkit-background-clip: @clip;
323
+ -moz-background-clip: @clip;
324
+ background-clip: @clip;
325
+ }
326
+
327
+ // Background sizing
328
+ .background-size(@size) {
329
+ -webkit-background-size: @size;
330
+ -moz-background-size: @size;
331
+ -o-background-size: @size;
332
+ background-size: @size;
333
+ }
334
+
335
+
336
+ // Box sizing
337
+ .box-sizing(@boxmodel) {
338
+ -webkit-box-sizing: @boxmodel;
339
+ -moz-box-sizing: @boxmodel;
340
+ box-sizing: @boxmodel;
341
+ }
342
+
343
+ // User select
344
+ // For selecting text on the page
345
+ .user-select(@select) {
346
+ -webkit-user-select: @select;
347
+ -moz-user-select: @select;
348
+ -ms-user-select: @select;
349
+ -o-user-select: @select;
350
+ user-select: @select;
351
+ }
352
+
353
+ // Resize anything
354
+ .resizable(@direction) {
355
+ resize: @direction; // Options: horizontal, vertical, both
356
+ overflow: auto; // Safari fix
357
+ }
358
+
359
+ // CSS3 Content Columns
360
+ .content-columns(@columnCount, @columnGap: @gridGutterWidth) {
361
+ -webkit-column-count: @columnCount;
362
+ -moz-column-count: @columnCount;
363
+ column-count: @columnCount;
364
+ -webkit-column-gap: @columnGap;
365
+ -moz-column-gap: @columnGap;
366
+ column-gap: @columnGap;
367
+ }
368
+
369
+ // Optional hyphenation
370
+ .hyphens(@mode: auto) {
371
+ word-wrap: break-word;
372
+ -webkit-hyphens: @mode;
373
+ -moz-hyphens: @mode;
374
+ -ms-hyphens: @mode;
375
+ -o-hyphens: @mode;
376
+ hyphens: @mode;
377
+ }
378
+
379
+ // Opacity
380
+ .opacity(@opacity) {
381
+ opacity: @opacity / 100;
382
+ filter: ~"alpha(opacity=@{opacity})";
383
+ }
384
+
385
+
386
+
387
+ // BACKGROUNDS
388
+ // --------------------------------------------------
389
+
390
+ // Add an alphatransparency value to any background or border color (via Elyse Holladay)
391
+ #translucent {
392
+ .background(@color: @white, @alpha: 1) {
393
+ background-color: hsla(hue(@color), saturation(@color), lightness(@color), @alpha);
394
+ }
395
+ .border(@color: @white, @alpha: 1) {
396
+ border-color: hsla(hue(@color), saturation(@color), lightness(@color), @alpha);
397
+ .background-clip(padding-box);
398
+ }
399
+ }
400
+
401
+ // Gradient Bar Colors for buttons and alerts
402
+ .gradientBar(@primaryColor, @secondaryColor, @textColor: #fff, @textShadow: 0 -1px 0 rgba(0,0,0,.25)) {
403
+ color: @textColor;
404
+ text-shadow: @textShadow;
405
+ #gradient > .vertical(@primaryColor, @secondaryColor);
406
+ border-color: @secondaryColor @secondaryColor darken(@secondaryColor, 15%);
407
+ border-color: rgba(0,0,0,.1) rgba(0,0,0,.1) fadein(rgba(0,0,0,.1), 15%);
408
+ }
409
+
410
+ // Gradients
411
+ #gradient {
412
+ .horizontal(@startColor: #555, @endColor: #333) {
413
+ background-color: @endColor;
414
+ background-image: -moz-linear-gradient(left, @startColor, @endColor); // FF 3.6+
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(to right, @startColor, @endColor); // Standard, IE10
419
+ background-repeat: repeat-x;
420
+ filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",argb(@startColor),argb(@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: -webkit-gradient(linear, 0 0, 0 100%, from(@startColor), to(@endColor)); // Safari 4+, Chrome 2+
426
+ background-image: -webkit-linear-gradient(top, @startColor, @endColor); // Safari 5.1+, Chrome 10+
427
+ background-image: -o-linear-gradient(top, @startColor, @endColor); // Opera 11.10
428
+ background-image: linear-gradient(to bottom, @startColor, @endColor); // Standard, IE10
429
+ background-repeat: repeat-x;
430
+ filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@startColor),argb(@endColor))); // IE9 and down
431
+ }
432
+ .directional(@startColor: #555, @endColor: #333, @deg: 45deg) {
433
+ background-color: @endColor;
434
+ background-repeat: repeat-x;
435
+ background-image: -moz-linear-gradient(@deg, @startColor, @endColor); // FF 3.6+
436
+ background-image: -webkit-linear-gradient(@deg, @startColor, @endColor); // Safari 5.1+, Chrome 10+
437
+ background-image: -o-linear-gradient(@deg, @startColor, @endColor); // Opera 11.10
438
+ background-image: linear-gradient(@deg, @startColor, @endColor); // Standard, IE10
439
+ }
440
+ .vertical-three-colors(@startColor: #00b3ee, @midColor: #7a43b6, @colorStop: 50%, @endColor: #c3325f) {
441
+ background-color: mix(@midColor, @endColor, 80%);
442
+ background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@startColor), color-stop(@colorStop, @midColor), to(@endColor));
443
+ background-image: -webkit-linear-gradient(@startColor, @midColor @colorStop, @endColor);
444
+ background-image: -moz-linear-gradient(top, @startColor, @midColor @colorStop, @endColor);
445
+ background-image: -o-linear-gradient(@startColor, @midColor @colorStop, @endColor);
446
+ background-image: linear-gradient(@startColor, @midColor @colorStop, @endColor);
447
+ background-repeat: no-repeat;
448
+ filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@startColor),argb(@endColor))); // IE9 and down, gets no color-stop at all for proper fallback
449
+ }
450
+ .radial(@innerColor: #555, @outerColor: #333) {
451
+ background-color: @outerColor;
452
+ background-image: -webkit-gradient(radial, center center, 0, center center, 460, from(@innerColor), to(@outerColor));
453
+ background-image: -webkit-radial-gradient(circle, @innerColor, @outerColor);
454
+ background-image: -moz-radial-gradient(circle, @innerColor, @outerColor);
455
+ background-image: -o-radial-gradient(circle, @innerColor, @outerColor);
456
+ background-repeat: no-repeat;
457
+ }
458
+ .striped(@color: #555, @angle: 45deg) {
459
+ background-color: @color;
460
+ 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));
461
+ 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);
462
+ 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);
463
+ 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);
464
+ 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);
465
+ }
466
+ }
467
+ // Reset filters for IE
468
+ .reset-filter() {
469
+ filter: e(%("progid:DXImageTransform.Microsoft.gradient(enabled = false)"));
470
+ }
471
+
472
+
473
+
474
+ // COMPONENT MIXINS
475
+ // --------------------------------------------------
476
+
477
+ // Horizontal dividers
478
+ // -------------------------
479
+ // Dividers (basically an hr) within dropdowns and nav lists
480
+ .nav-divider(@top: #e5e5e5, @bottom: @white) {
481
+ // IE7 needs a set width since we gave a height. Restricting just
482
+ // to IE7 to keep the 1px left/right space in other browsers.
483
+ // It is unclear where IE is getting the extra space that we need
484
+ // to negative-margin away, but so it goes.
485
+ *width: 100%;
486
+ height: 1px;
487
+ margin: ((@baseLineHeight / 2) - 1) 1px; // 8px 1px
488
+ *margin: -5px 0 5px;
489
+ overflow: hidden;
490
+ background-color: @top;
491
+ border-bottom: 1px solid @bottom;
492
+ }
493
+
494
+ // Button backgrounds
495
+ // ------------------
496
+ .buttonBackground(@startColor, @endColor, @textColor: #fff, @textShadow: 0 -1px 0 rgba(0,0,0,.25)) {
497
+ // gradientBar will set the background to a pleasing blend of these, to support IE<=9
498
+ .gradientBar(@startColor, @endColor, @textColor, @textShadow);
499
+ *background-color: @endColor; /* Darken IE7 buttons by default so they stand out more given they won't have borders */
500
+ .reset-filter();
501
+
502
+ // in these cases the gradient won't cover the background, so we override
503
+ &:hover, &:active, &.active, &.disabled, &[disabled] {
504
+ color: @textColor;
505
+ background-color: @endColor;
506
+ *background-color: darken(@endColor, 5%);
507
+ }
508
+
509
+ // IE 7 + 8 can't handle box-shadow to show active, so we darken a bit ourselves
510
+ &:active,
511
+ &.active {
512
+ background-color: darken(@endColor, 10%) e("\9");
513
+ }
514
+ }
515
+
516
+ // Navbar vertical align
517
+ // -------------------------
518
+ // Vertically center elements in the navbar.
519
+ // Example: an element has a height of 30px, so write out `.navbarVerticalAlign(30px);` to calculate the appropriate top margin.
520
+ .navbarVerticalAlign(@elementHeight) {
521
+ margin-top: (@navbarHeight - @elementHeight) / 2;
522
+ }
523
+
524
+
525
+
526
+ // Grid System
527
+ // -----------
528
+
529
+ // Centered container element
530
+ .container-fixed() {
531
+ margin-right: auto;
532
+ margin-left: auto;
533
+ .clearfix();
534
+ }
535
+
536
+ // Table columns
537
+ .tableColumns(@columnSpan: 1) {
538
+ float: none; // undo default grid column styles
539
+ width: ((@gridColumnWidth) * @columnSpan) + (@gridGutterWidth * (@columnSpan - 1)) - 16; // 16 is total padding on left and right of table cells
540
+ margin-right: 0; // undo default grid column styles
541
+ }
542
+
543
+ // Make a Grid
544
+ // Use .makeRow and .makeColumn to assign semantic layouts grid system behavior
545
+ .makeRow() {
546
+ margin-right: @gridGutterWidth * -1;
547
+ .clearfix();
548
+ }
549
+ .makeColumn(@columns: 1, @offset: 0) {
550
+ float: right;
551
+ margin-right: (@gridColumnWidth * @offset) + (@gridGutterWidth * (@offset - 1)) + (@gridGutterWidth * 2);
552
+ width: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1));
553
+ }
554
+
555
+ // The Grid
556
+ #grid {
557
+
558
+ .core (@gridColumnWidth, @gridGutterWidth) {
559
+
560
+ .spanX (@index) when (@index > 0) {
561
+ (~".span@{index}") { .span(@index); }
562
+ .spanX(@index - 1);
563
+ }
564
+ .spanX (0) {}
565
+
566
+ .offsetX (@index) when (@index > 0) {
567
+ (~".offset@{index}") { .offset(@index); }
568
+ .offsetX(@index - 1);
569
+ }
570
+ .offsetX (0) {}
571
+
572
+ .offset (@columns) {
573
+ margin-right: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns + 1));
574
+ }
575
+
576
+ .span (@columns) {
577
+ width: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1));
578
+ }
579
+
580
+ .row {
581
+ margin-right: @gridGutterWidth * -1;
582
+ .clearfix();
583
+ }
584
+
585
+ [class*="span"] {
586
+ float: right;
587
+ min-height: 1px; // prevent collapsing columns
588
+ margin-right: @gridGutterWidth;
589
+ }
590
+
591
+ // Set the container width, and override it for fixed navbars in media queries
592
+ .container,
593
+ .navbar-static-top .container,
594
+ .navbar-fixed-top .container,
595
+ .navbar-fixed-bottom .container { .span(@gridColumns); }
596
+
597
+ // generate .spanX and .offsetX
598
+ .spanX (@gridColumns);
599
+ .offsetX (@gridColumns);
600
+
601
+ }
602
+
603
+ .fluid (@fluidGridColumnWidth, @fluidGridGutterWidth) {
604
+
605
+ .spanX (@index) when (@index > 0) {
606
+ (~".span@{index}") { .span(@index); }
607
+ .spanX(@index - 1);
608
+ }
609
+ .spanX (0) {}
610
+
611
+ .offsetX (@index) when (@index > 0) {
612
+ (~'.offset@{index}') { .offset(@index); }
613
+ (~'.offset@{index}:first-child') { .offsetFirstChild(@index); }
614
+ .offsetX(@index - 1);
615
+ }
616
+ .offsetX (0) {}
617
+
618
+ .offset (@columns) {
619
+ margin-right: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) + (@fluidGridGutterWidth*2);
620
+ *margin-right: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) - (.5 / @gridRowWidth * 100 * 1%) + (@fluidGridGutterWidth*2) - (.5 / @gridRowWidth * 100 * 1%);
621
+ }
622
+
623
+ .offsetFirstChild (@columns) {
624
+ margin-right: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) + (@fluidGridGutterWidth);
625
+ *margin-right: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) - (.5 / @gridRowWidth * 100 * 1%) + @fluidGridGutterWidth - (.5 / @gridRowWidth * 100 * 1%);
626
+ }
627
+
628
+ .span (@columns) {
629
+ width: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1));
630
+ *width: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) - (.5 / @gridRowWidth * 100 * 1%);
631
+ }
632
+
633
+ .row-fluid {
634
+ width: 100%;
635
+ .clearfix();
636
+ [class*="span"] {
637
+ .input-block-level();
638
+ float: right;
639
+ margin-right: @fluidGridGutterWidth;
640
+ *margin-right: @fluidGridGutterWidth - (.5 / @gridRowWidth * 100 * 1%);
641
+ }
642
+ [class*="span"]:first-child {
643
+ margin-right: 0;
644
+ }
645
+
646
+ // Space grid-sized controls properly if multiple per line
647
+ .controls-row [class*="span"] + [class*="span"] {
648
+ margin-left: @fluidGridGutterWidth;
649
+ }
650
+
651
+ // generate .spanX and .offsetX
652
+ .spanX (@gridColumns);
653
+ .offsetX (@gridColumns);
654
+ }
655
+
656
+ }
657
+
658
+ .input(@gridColumnWidth, @gridGutterWidth) {
659
+
660
+ .spanX (@index) when (@index > 0) {
661
+ (~"input.span@{index}, textarea.span@{index}, .uneditable-input.span@{index}") { .span(@index); }
662
+ .spanX(@index - 1);
663
+ }
664
+ .spanX (0) {}
665
+
666
+ .span(@columns) {
667
+ width: ((@gridColumnWidth) * @columns) + (@gridGutterWidth * (@columns - 1)) - 14;
668
+ }
669
+
670
+ input,
671
+ textarea,
672
+ .uneditable-input {
673
+ margin-right: 0; // override margin-right from core grid system
674
+ }
675
+
676
+ // Space grid-sized controls properly if multiple per line
677
+ .controls-row [class*="span"] + [class*="span"] {
678
+ margin-right: @gridGutterWidth;
679
+ }
680
+
681
+ // generate .spanX
682
+ .spanX (@gridColumns);
683
+
684
+ }
685
+
686
+ }