bootstrap-sass 2.3.1.3 → 3.4.1

Sign up to get free protection for your applications and to get access to all the features.
Files changed (233) hide show
  1. checksums.yaml +5 -5
  2. data/.gitignore +20 -0
  3. data/.travis.yml +19 -0
  4. data/CHANGELOG.md +215 -0
  5. data/CONTRIBUTING.md +86 -0
  6. data/Gemfile +7 -0
  7. data/LICENSE +18 -10
  8. data/README.md +290 -67
  9. data/Rakefile +98 -0
  10. data/assets/fonts/bootstrap/glyphicons-halflings-regular.eot +0 -0
  11. data/assets/fonts/bootstrap/glyphicons-halflings-regular.svg +288 -0
  12. data/assets/fonts/bootstrap/glyphicons-halflings-regular.ttf +0 -0
  13. data/assets/fonts/bootstrap/glyphicons-halflings-regular.woff +0 -0
  14. data/assets/fonts/bootstrap/glyphicons-halflings-regular.woff2 +0 -0
  15. data/assets/images/.keep +0 -0
  16. data/assets/javascripts/bootstrap-sprockets.js +12 -0
  17. data/assets/javascripts/bootstrap.js +2580 -0
  18. data/assets/javascripts/bootstrap.min.js +6 -0
  19. data/assets/javascripts/bootstrap/affix.js +164 -0
  20. data/assets/javascripts/bootstrap/alert.js +95 -0
  21. data/assets/javascripts/bootstrap/button.js +125 -0
  22. data/assets/javascripts/bootstrap/carousel.js +246 -0
  23. data/assets/javascripts/bootstrap/collapse.js +212 -0
  24. data/assets/javascripts/bootstrap/dropdown.js +165 -0
  25. data/assets/javascripts/bootstrap/modal.js +358 -0
  26. data/assets/javascripts/bootstrap/popover.js +123 -0
  27. data/assets/javascripts/bootstrap/scrollspy.js +172 -0
  28. data/assets/javascripts/bootstrap/tab.js +155 -0
  29. data/assets/javascripts/bootstrap/tooltip.js +677 -0
  30. data/assets/javascripts/bootstrap/transition.js +59 -0
  31. data/assets/stylesheets/_bootstrap-compass.scss +9 -0
  32. data/assets/stylesheets/_bootstrap-mincer.scss +19 -0
  33. data/assets/stylesheets/_bootstrap-sprockets.scss +9 -0
  34. data/assets/stylesheets/_bootstrap.scss +56 -0
  35. data/assets/stylesheets/bootstrap/_alerts.scss +73 -0
  36. data/assets/stylesheets/bootstrap/_badges.scss +68 -0
  37. data/assets/stylesheets/bootstrap/_breadcrumbs.scss +28 -0
  38. data/assets/stylesheets/bootstrap/_button-groups.scss +244 -0
  39. data/assets/stylesheets/bootstrap/_buttons.scss +168 -0
  40. data/assets/stylesheets/bootstrap/_carousel.scss +271 -0
  41. data/{vendor/assets → assets}/stylesheets/bootstrap/_close.scss +13 -8
  42. data/assets/stylesheets/bootstrap/_code.scss +69 -0
  43. data/assets/stylesheets/bootstrap/_component-animations.scss +38 -0
  44. data/assets/stylesheets/bootstrap/_dropdowns.scss +213 -0
  45. data/assets/stylesheets/bootstrap/_forms.scss +607 -0
  46. data/assets/stylesheets/bootstrap/_glyphicons.scss +307 -0
  47. data/assets/stylesheets/bootstrap/_grid.scss +94 -0
  48. data/assets/stylesheets/bootstrap/_input-groups.scss +171 -0
  49. data/assets/stylesheets/bootstrap/_jumbotron.scss +54 -0
  50. data/assets/stylesheets/bootstrap/_labels.scss +66 -0
  51. data/assets/stylesheets/bootstrap/_list-group.scss +128 -0
  52. data/assets/stylesheets/bootstrap/_media.scss +66 -0
  53. data/assets/stylesheets/bootstrap/_mixins.scss +40 -0
  54. data/assets/stylesheets/bootstrap/_modals.scss +150 -0
  55. data/assets/stylesheets/bootstrap/_navbar.scss +656 -0
  56. data/assets/stylesheets/bootstrap/_navs.scss +242 -0
  57. data/assets/stylesheets/bootstrap/_normalize.scss +427 -0
  58. data/assets/stylesheets/bootstrap/_pager.scss +54 -0
  59. data/assets/stylesheets/bootstrap/_pagination.scss +86 -0
  60. data/assets/stylesheets/bootstrap/_panels.scss +271 -0
  61. data/assets/stylesheets/bootstrap/_popovers.scss +126 -0
  62. data/assets/stylesheets/bootstrap/_print.scss +99 -0
  63. data/assets/stylesheets/bootstrap/_progress-bars.scss +87 -0
  64. data/assets/stylesheets/bootstrap/_responsive-embed.scss +35 -0
  65. data/assets/stylesheets/bootstrap/_responsive-utilities.scss +179 -0
  66. data/assets/stylesheets/bootstrap/_scaffolding.scss +161 -0
  67. data/assets/stylesheets/bootstrap/_tables.scss +234 -0
  68. data/assets/stylesheets/bootstrap/_theme.scss +295 -0
  69. data/assets/stylesheets/bootstrap/_thumbnails.scss +38 -0
  70. data/assets/stylesheets/bootstrap/_tooltip.scss +112 -0
  71. data/assets/stylesheets/bootstrap/_type.scss +298 -0
  72. data/assets/stylesheets/bootstrap/_utilities.scss +55 -0
  73. data/assets/stylesheets/bootstrap/_variables.scss +874 -0
  74. data/assets/stylesheets/bootstrap/_wells.scss +29 -0
  75. data/assets/stylesheets/bootstrap/mixins/_alerts.scss +15 -0
  76. data/assets/stylesheets/bootstrap/mixins/_background-variant.scss +12 -0
  77. data/assets/stylesheets/bootstrap/mixins/_border-radius.scss +18 -0
  78. data/assets/stylesheets/bootstrap/mixins/_buttons.scss +61 -0
  79. data/assets/stylesheets/bootstrap/mixins/_center-block.scss +7 -0
  80. data/assets/stylesheets/bootstrap/mixins/_clearfix.scss +22 -0
  81. data/assets/stylesheets/bootstrap/mixins/_forms.scss +88 -0
  82. data/assets/stylesheets/bootstrap/mixins/_gradients.scss +56 -0
  83. data/assets/stylesheets/bootstrap/mixins/_grid-framework.scss +81 -0
  84. data/assets/stylesheets/bootstrap/mixins/_grid.scss +122 -0
  85. data/assets/stylesheets/bootstrap/mixins/_hide-text.scss +21 -0
  86. data/assets/stylesheets/bootstrap/mixins/_image.scss +28 -0
  87. data/assets/stylesheets/bootstrap/mixins/_labels.scss +12 -0
  88. data/assets/stylesheets/bootstrap/mixins/_list-group.scss +32 -0
  89. data/assets/stylesheets/bootstrap/mixins/_nav-divider.scss +10 -0
  90. data/assets/stylesheets/bootstrap/mixins/_nav-vertical-align.scss +9 -0
  91. data/assets/stylesheets/bootstrap/mixins/_opacity.scss +7 -0
  92. data/assets/stylesheets/bootstrap/mixins/_pagination.scss +24 -0
  93. data/assets/stylesheets/bootstrap/mixins/_panels.scss +24 -0
  94. data/assets/stylesheets/bootstrap/mixins/_progress-bar.scss +10 -0
  95. data/assets/stylesheets/bootstrap/mixins/_reset-filter.scss +8 -0
  96. data/assets/stylesheets/bootstrap/mixins/_reset-text.scss +18 -0
  97. data/assets/stylesheets/bootstrap/mixins/_resize.scss +6 -0
  98. data/assets/stylesheets/bootstrap/mixins/_responsive-visibility.scss +17 -0
  99. data/assets/stylesheets/bootstrap/mixins/_size.scss +10 -0
  100. data/assets/stylesheets/bootstrap/mixins/_tab-focus.scss +9 -0
  101. data/assets/stylesheets/bootstrap/mixins/_table-row.scss +28 -0
  102. data/assets/stylesheets/bootstrap/mixins/_text-emphasis.scss +12 -0
  103. data/assets/stylesheets/bootstrap/mixins/_text-overflow.scss +8 -0
  104. data/assets/stylesheets/bootstrap/mixins/_vendor-prefixes.scss +222 -0
  105. data/bootstrap-sass.gemspec +37 -0
  106. data/bower.json +36 -0
  107. data/composer.json +35 -0
  108. data/eyeglass-exports.js +7 -0
  109. data/lib/bootstrap-sass.rb +75 -35
  110. data/lib/bootstrap-sass/engine.rb +12 -2
  111. data/lib/bootstrap-sass/version.rb +4 -0
  112. data/package-lock.json +1611 -0
  113. data/package.json +44 -0
  114. data/sache.json +5 -0
  115. data/tasks/bower.rake +31 -0
  116. data/tasks/converter.rb +80 -0
  117. data/tasks/converter/char_string_scanner.rb +38 -0
  118. data/tasks/converter/fonts_conversion.rb +16 -0
  119. data/tasks/converter/js_conversion.rb +47 -0
  120. data/tasks/converter/less_conversion.rb +713 -0
  121. data/tasks/converter/logger.rb +57 -0
  122. data/tasks/converter/network.rb +97 -0
  123. data/templates/project/_bootstrap-variables.sass +875 -0
  124. data/templates/project/manifest.rb +15 -14
  125. data/templates/project/styles.sass +6 -0
  126. data/test/compilation_test.rb +30 -0
  127. data/test/dummy_node_mincer/apple-touch-icon-144-precomposed.png +0 -0
  128. data/test/dummy_node_mincer/application.css.ejs.scss +6 -0
  129. data/test/dummy_node_mincer/manifest.js +87 -0
  130. data/test/dummy_rails/README.rdoc +3 -0
  131. data/test/dummy_rails/Rakefile +6 -0
  132. data/test/dummy_rails/app/assets/images/.keep +0 -0
  133. data/test/dummy_rails/app/assets/javascripts/application.js +2 -0
  134. data/test/dummy_rails/app/assets/stylesheets/application.sass +2 -0
  135. data/test/dummy_rails/app/controllers/application_controller.rb +5 -0
  136. data/test/dummy_rails/app/controllers/pages_controller.rb +4 -0
  137. data/test/dummy_rails/app/helpers/application_helper.rb +2 -0
  138. data/test/dummy_rails/app/views/layouts/application.html.erb +14 -0
  139. data/test/dummy_rails/app/views/pages/root.html.slim +84 -0
  140. data/test/dummy_rails/config.ru +4 -0
  141. data/test/dummy_rails/config/application.rb +31 -0
  142. data/test/dummy_rails/config/boot.rb +5 -0
  143. data/test/dummy_rails/config/environment.rb +5 -0
  144. data/test/dummy_rails/config/environments/development.rb +23 -0
  145. data/test/dummy_rails/config/environments/production.rb +82 -0
  146. data/test/dummy_rails/config/environments/test.rb +38 -0
  147. data/test/dummy_rails/config/initializers/backtrace_silencers.rb +7 -0
  148. data/test/dummy_rails/config/initializers/filter_parameter_logging.rb +4 -0
  149. data/test/dummy_rails/config/initializers/inflections.rb +16 -0
  150. data/test/dummy_rails/config/initializers/mime_types.rb +5 -0
  151. data/test/dummy_rails/config/initializers/secret_token.rb +18 -0
  152. data/test/dummy_rails/config/initializers/session_store.rb +3 -0
  153. data/test/dummy_rails/config/initializers/wrap_parameters.rb +14 -0
  154. data/test/dummy_rails/config/locales/en.yml +3 -0
  155. data/test/dummy_rails/config/locales/es.yml +3 -0
  156. data/test/dummy_rails/config/routes.rb +3 -0
  157. data/test/dummy_rails/log/.keep +0 -0
  158. data/test/dummy_sass_only/Gemfile +4 -0
  159. data/test/dummy_sass_only/compile.rb +20 -0
  160. data/test/dummy_sass_only/import_all.scss +2 -0
  161. data/test/gemfiles/default.gemfile +3 -0
  162. data/test/node_mincer_test.rb +35 -0
  163. data/test/node_sass_compile_test.sh +9 -0
  164. data/test/pages_test.rb +14 -0
  165. data/test/sass_test.rb +29 -0
  166. data/test/sprockets_rails_test.rb +31 -0
  167. data/test/support/dummy_rails_integration.rb +22 -0
  168. data/test/support/reporting.rb +27 -0
  169. data/test/test_helper.rb +36 -0
  170. data/test/test_helper_rails.rb +6 -0
  171. metadata +404 -89
  172. data/lib/bootstrap-sass/compass_functions.rb +0 -24
  173. data/lib/bootstrap-sass/sass_functions.rb +0 -14
  174. data/templates/project/_variables.scss +0 -301
  175. data/templates/project/styles.scss +0 -8
  176. data/vendor/assets/images/glyphicons-halflings-white.png +0 -0
  177. data/vendor/assets/images/glyphicons-halflings.png +0 -0
  178. data/vendor/assets/javascripts/bootstrap-affix.js +0 -117
  179. data/vendor/assets/javascripts/bootstrap-alert.js +0 -99
  180. data/vendor/assets/javascripts/bootstrap-button.js +0 -105
  181. data/vendor/assets/javascripts/bootstrap-carousel.js +0 -207
  182. data/vendor/assets/javascripts/bootstrap-collapse.js +0 -167
  183. data/vendor/assets/javascripts/bootstrap-dropdown.js +0 -165
  184. data/vendor/assets/javascripts/bootstrap-modal.js +0 -247
  185. data/vendor/assets/javascripts/bootstrap-popover.js +0 -114
  186. data/vendor/assets/javascripts/bootstrap-scrollspy.js +0 -162
  187. data/vendor/assets/javascripts/bootstrap-tab.js +0 -144
  188. data/vendor/assets/javascripts/bootstrap-tooltip.js +0 -361
  189. data/vendor/assets/javascripts/bootstrap-transition.js +0 -60
  190. data/vendor/assets/javascripts/bootstrap-typeahead.js +0 -335
  191. data/vendor/assets/javascripts/bootstrap.js +0 -13
  192. data/vendor/assets/stylesheets/bootstrap-responsive.scss +0 -1
  193. data/vendor/assets/stylesheets/bootstrap.scss +0 -1
  194. data/vendor/assets/stylesheets/bootstrap/_accordion.scss +0 -34
  195. data/vendor/assets/stylesheets/bootstrap/_alerts.scss +0 -79
  196. data/vendor/assets/stylesheets/bootstrap/_breadcrumbs.scss +0 -24
  197. data/vendor/assets/stylesheets/bootstrap/_button-groups.scss +0 -229
  198. data/vendor/assets/stylesheets/bootstrap/_buttons.scss +0 -228
  199. data/vendor/assets/stylesheets/bootstrap/_carousel.scss +0 -158
  200. data/vendor/assets/stylesheets/bootstrap/_code.scss +0 -61
  201. data/vendor/assets/stylesheets/bootstrap/_component-animations.scss +0 -22
  202. data/vendor/assets/stylesheets/bootstrap/_dropdowns.scss +0 -237
  203. data/vendor/assets/stylesheets/bootstrap/_forms.scss +0 -689
  204. data/vendor/assets/stylesheets/bootstrap/_grid.scss +0 -21
  205. data/vendor/assets/stylesheets/bootstrap/_hero-unit.scss +0 -25
  206. data/vendor/assets/stylesheets/bootstrap/_labels-badges.scss +0 -83
  207. data/vendor/assets/stylesheets/bootstrap/_layouts.scss +0 -16
  208. data/vendor/assets/stylesheets/bootstrap/_media.scss +0 -55
  209. data/vendor/assets/stylesheets/bootstrap/_mixins.scss +0 -690
  210. data/vendor/assets/stylesheets/bootstrap/_modals.scss +0 -95
  211. data/vendor/assets/stylesheets/bootstrap/_navbar.scss +0 -497
  212. data/vendor/assets/stylesheets/bootstrap/_navs.scss +0 -409
  213. data/vendor/assets/stylesheets/bootstrap/_pager.scss +0 -43
  214. data/vendor/assets/stylesheets/bootstrap/_pagination.scss +0 -123
  215. data/vendor/assets/stylesheets/bootstrap/_popovers.scss +0 -133
  216. data/vendor/assets/stylesheets/bootstrap/_progress-bars.scss +0 -122
  217. data/vendor/assets/stylesheets/bootstrap/_reset.scss +0 -216
  218. data/vendor/assets/stylesheets/bootstrap/_responsive-1200px-min.scss +0 -28
  219. data/vendor/assets/stylesheets/bootstrap/_responsive-767px-max.scss +0 -193
  220. data/vendor/assets/stylesheets/bootstrap/_responsive-768px-979px.scss +0 -19
  221. data/vendor/assets/stylesheets/bootstrap/_responsive-navbar.scss +0 -189
  222. data/vendor/assets/stylesheets/bootstrap/_responsive-utilities.scss +0 -74
  223. data/vendor/assets/stylesheets/bootstrap/_scaffolding.scss +0 -53
  224. data/vendor/assets/stylesheets/bootstrap/_sprites.scss +0 -197
  225. data/vendor/assets/stylesheets/bootstrap/_tables.scss +0 -235
  226. data/vendor/assets/stylesheets/bootstrap/_thumbnails.scss +0 -53
  227. data/vendor/assets/stylesheets/bootstrap/_tooltip.scss +0 -70
  228. data/vendor/assets/stylesheets/bootstrap/_type.scss +0 -247
  229. data/vendor/assets/stylesheets/bootstrap/_utilities.scss +0 -45
  230. data/vendor/assets/stylesheets/bootstrap/_variables.scss +0 -301
  231. data/vendor/assets/stylesheets/bootstrap/_wells.scss +0 -29
  232. data/vendor/assets/stylesheets/bootstrap/bootstrap.scss +0 -63
  233. data/vendor/assets/stylesheets/bootstrap/responsive.scss +0 -48
@@ -1,21 +0,0 @@
1
- //
2
- // Grid system
3
- // --------------------------------------------------
4
-
5
-
6
- // Fixed (940px)
7
- @include grid-core($gridColumnWidth, $gridGutterWidth);
8
-
9
- // Fluid (940px)
10
- @include 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
- }
@@ -1,25 +0,0 @@
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
- @include 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.scss
24
- }
25
- }
@@ -1,83 +0,0 @@
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
- @include border-radius(3px);
23
- }
24
- .badge {
25
- padding-left: 9px;
26
- padding-right: 9px;
27
- @include border-radius(9px);
28
- }
29
-
30
- // Empty labels/badges collapse
31
- .label,
32
- .badge {
33
- &:empty {
34
- display: none;
35
- }
36
- }
37
-
38
- // Hover/focus state, but only for links
39
- a {
40
- &.label:hover,
41
- &.label:focus,
42
- &.badge:hover,
43
- &.badge:focus {
44
- color: $white;
45
- text-decoration: none;
46
- cursor: pointer;
47
- }
48
- }
49
-
50
- // Colors
51
- // Only give background-color difference to links (and to simplify, we don't qualifty with `a` but [href] attribute)
52
- @each $item in label, badge {
53
- // Important (red)
54
- .#{$item}-important { background-color: $errorText; }
55
- .#{$item}-important[href] { background-color: darken($errorText, 10%); }
56
- // Warnings (orange)
57
- .#{$item}-warning { background-color: $orange; }
58
- .#{$item}-warning[href] { background-color: darken($orange, 10%); }
59
- // Success (green)
60
- .#{$item}-success { background-color: $successText; }
61
- .#{$item}-success[href] { background-color: darken($successText, 10%); }
62
- // Info (turquoise)
63
- .#{$item}-info { background-color: $infoText; }
64
- .#{$item}-info[href] { background-color: darken($infoText, 10%); }
65
- // Inverse (black)
66
- .#{$item}-inverse { background-color: $grayDark; }
67
- .#{$item}-inverse[href] { background-color: darken($grayDark, 10%); }
68
- }
69
-
70
- // Quick fix for labels/badges in buttons
71
- .btn {
72
- .label,
73
- .badge {
74
- position: relative;
75
- top: -1px;
76
- }
77
- }
78
- .btn-mini {
79
- .label,
80
- .badge {
81
- top: 0;
82
- }
83
- }
@@ -1,16 +0,0 @@
1
- //
2
- // Layouts
3
- // --------------------------------------------------
4
-
5
-
6
- // Container (centered, fixed-width layouts)
7
- .container {
8
- @include 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
- @include clearfix();
16
- }
@@ -1,55 +0,0 @@
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-left: 0;
54
- list-style: none;
55
- }
@@ -1,690 +0,0 @@
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
- @mixin 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
- @mixin 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
- @mixin center-block() {
40
- display: block;
41
- margin-left: auto;
42
- margin-right: auto;
43
- }
44
-
45
- // IE7 inline-block
46
- // ----------------
47
- @mixin 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
- @mixin ie7-restore-left-whitespace() {
59
- *margin-left: .3em;
60
-
61
- &:first-child {
62
- *margin-left: 0;
63
- }
64
- }
65
-
66
- @mixin ie7-restore-right-whitespace() {
67
- *margin-right: .3em;
68
- }
69
-
70
- // Sizing shortcuts
71
- // -------------------------
72
- @mixin size($height, $width) {
73
- width: $width;
74
- height: $height;
75
- }
76
- @mixin square($size) {
77
- @include size($size, $size);
78
- }
79
-
80
- // Placeholder text
81
- // -------------------------
82
- @mixin 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
- @mixin 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
- @mixin 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
- @mixin font-family-serif() {
119
- font-family: $serifFontFamily;
120
- }
121
- @mixin font-family-sans-serif() {
122
- font-family: $sansFontFamily;
123
- }
124
- @mixin font-family-monospace() {
125
- font-family: $monoFontFamily;
126
- }
127
- @mixin font-shorthand($size: $baseFontSize, $weight: normal, $lineHeight: $baseLineHeight) {
128
- font-size: $size;
129
- font-weight: $weight;
130
- line-height: $lineHeight;
131
- }
132
- @mixin font-serif($size: $baseFontSize, $weight: normal, $lineHeight: $baseLineHeight) {
133
- @include font-family-serif();
134
- @include font-shorthand($size, $weight, $lineHeight);
135
- }
136
- @mixin font-sans-serif($size: $baseFontSize, $weight: normal, $lineHeight: $baseLineHeight) {
137
- @include font-family-sans-serif();
138
- @include font-shorthand($size, $weight, $lineHeight);
139
- }
140
- @mixin font-monospace($size: $baseFontSize, $weight: normal, $lineHeight: $baseLineHeight) {
141
- @include font-family-monospace();
142
- @include font-shorthand($size, $weight, $lineHeight);
143
- }
144
-
145
-
146
- // FORMS
147
- // --------------------------------------------------
148
-
149
- // Block level inputs
150
- @mixin input-block-level {
151
- display: block;
152
- width: 100%;
153
- min-height: $inputHeight; // Make inputs at least the height of their button counterpart (base line-height + padding + border)
154
- @include box-sizing(border-box); // Makes inputs behave like true block-level elements
155
- }
156
-
157
-
158
-
159
- // Mixin for form field states
160
- @mixin formFieldState($textColor: #555, $borderColor: #ccc, $backgroundColor: #f5f5f5) {
161
- // Set the text color
162
- .control-label,
163
- .help-block,
164
- .help-inline {
165
- color: $textColor;
166
- }
167
- // Style inputs accordingly
168
- .checkbox,
169
- .radio,
170
- input,
171
- select,
172
- textarea {
173
- color: $textColor;
174
- }
175
- input,
176
- select,
177
- textarea {
178
- border-color: $borderColor;
179
- @include box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); // Redeclare so transitions work
180
- &:focus {
181
- border-color: darken($borderColor, 10%);
182
- @include box-shadow(inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px lighten($borderColor, 20%));
183
- }
184
- }
185
- // Give a small background color for input-prepend/-append
186
- .input-prepend .add-on,
187
- .input-append .add-on {
188
- color: $textColor;
189
- background-color: $backgroundColor;
190
- border-color: $textColor;
191
- }
192
- }
193
-
194
-
195
-
196
- // CSS3 PROPERTIES
197
- // --------------------------------------------------
198
-
199
- // Border Radius
200
- @mixin border-radius($radius) {
201
- -webkit-border-radius: $radius;
202
- -moz-border-radius: $radius;
203
- border-radius: $radius;
204
- }
205
-
206
- // Single Corner Border Radius
207
- @mixin border-top-left-radius($radius) {
208
- -webkit-border-top-left-radius: $radius;
209
- -moz-border-radius-topleft: $radius;
210
- border-top-left-radius: $radius;
211
- }
212
- @mixin border-top-right-radius($radius) {
213
- -webkit-border-top-right-radius: $radius;
214
- -moz-border-radius-topright: $radius;
215
- border-top-right-radius: $radius;
216
- }
217
- @mixin border-bottom-right-radius($radius) {
218
- -webkit-border-bottom-right-radius: $radius;
219
- -moz-border-radius-bottomright: $radius;
220
- border-bottom-right-radius: $radius;
221
- }
222
- @mixin border-bottom-left-radius($radius) {
223
- -webkit-border-bottom-left-radius: $radius;
224
- -moz-border-radius-bottomleft: $radius;
225
- border-bottom-left-radius: $radius;
226
- }
227
-
228
- // Single Side Border Radius
229
- @mixin border-top-radius($radius) {
230
- @include border-top-right-radius($radius);
231
- @include border-top-left-radius($radius);
232
- }
233
- @mixin border-right-radius($radius) {
234
- @include border-top-right-radius($radius);
235
- @include border-bottom-right-radius($radius);
236
- }
237
- @mixin border-bottom-radius($radius) {
238
- @include border-bottom-right-radius($radius);
239
- @include border-bottom-left-radius($radius);
240
- }
241
- @mixin border-left-radius($radius) {
242
- @include border-top-left-radius($radius);
243
- @include border-bottom-left-radius($radius);
244
- }
245
-
246
- // Drop shadows
247
- @mixin box-shadow($shadow...) {
248
- -webkit-box-shadow: $shadow;
249
- -moz-box-shadow: $shadow;
250
- box-shadow: $shadow;
251
- }
252
-
253
- // Transitions
254
- @mixin transition($transition...) {
255
- -webkit-transition: $transition;
256
- -moz-transition: $transition;
257
- -o-transition: $transition;
258
- transition: $transition;
259
- }
260
- @mixin transition-delay($transition-delay) {
261
- -webkit-transition-delay: $transition-delay;
262
- -moz-transition-delay: $transition-delay;
263
- -o-transition-delay: $transition-delay;
264
- transition-delay: $transition-delay;
265
- }
266
- @mixin transition-duration($transition-duration) {
267
- -webkit-transition-duration: $transition-duration;
268
- -moz-transition-duration: $transition-duration;
269
- -o-transition-duration: $transition-duration;
270
- transition-duration: $transition-duration;
271
- }
272
-
273
- // Transformations
274
- @mixin rotate($degrees) {
275
- -webkit-transform: rotate($degrees);
276
- -moz-transform: rotate($degrees);
277
- -ms-transform: rotate($degrees);
278
- -o-transform: rotate($degrees);
279
- transform: rotate($degrees);
280
- }
281
- @mixin scale($ratio) {
282
- -webkit-transform: scale($ratio);
283
- -moz-transform: scale($ratio);
284
- -ms-transform: scale($ratio);
285
- -o-transform: scale($ratio);
286
- transform: scale($ratio);
287
- }
288
- @mixin translate($x, $y) {
289
- -webkit-transform: translate($x, $y);
290
- -moz-transform: translate($x, $y);
291
- -ms-transform: translate($x, $y);
292
- -o-transform: translate($x, $y);
293
- transform: translate($x, $y);
294
- }
295
- @mixin skew($x, $y) {
296
- -webkit-transform: skew($x, $y);
297
- -moz-transform: skew($x, $y);
298
- -ms-transform: skewX($x) skewY($y); // See https://github.com/twitter/bootstrap/issues/4885
299
- -o-transform: skew($x, $y);
300
- transform: skew($x, $y);
301
- -webkit-backface-visibility: hidden; // See https://github.com/twitter/bootstrap/issues/5319
302
- }
303
- @mixin translate3d($x, $y, $z) {
304
- -webkit-transform: translate3d($x, $y, $z);
305
- -moz-transform: translate3d($x, $y, $z);
306
- -o-transform: translate3d($x, $y, $z);
307
- transform: translate3d($x, $y, $z);
308
- }
309
-
310
- // Backface visibility
311
- // Prevent browsers from flickering when using CSS 3D transforms.
312
- // Default value is `visible`, but can be changed to `hidden
313
- // See git pull https://github.com/dannykeane/bootstrap.git backface-visibility for examples
314
- @mixin backface-visibility($visibility){
315
- -webkit-backface-visibility: $visibility;
316
- -moz-backface-visibility: $visibility;
317
- backface-visibility: $visibility;
318
- }
319
-
320
- // Background clipping
321
- // Heads up: FF 3.6 and under need "padding" instead of "padding-box"
322
- @mixin background-clip($clip) {
323
- -webkit-background-clip: $clip;
324
- -moz-background-clip: $clip;
325
- background-clip: $clip;
326
- }
327
-
328
- // Background sizing
329
- @mixin background-size($size) {
330
- -webkit-background-size: $size;
331
- -moz-background-size: $size;
332
- -o-background-size: $size;
333
- background-size: $size;
334
- }
335
-
336
-
337
- // Box sizing
338
- @mixin box-sizing($boxmodel) {
339
- -webkit-box-sizing: $boxmodel;
340
- -moz-box-sizing: $boxmodel;
341
- box-sizing: $boxmodel;
342
- }
343
-
344
- // User select
345
- // For selecting text on the page
346
- @mixin user-select($select) {
347
- -webkit-user-select: $select;
348
- -moz-user-select: $select;
349
- -ms-user-select: $select;
350
- -o-user-select: $select;
351
- user-select: $select;
352
- }
353
-
354
- // Resize anything
355
- @mixin resizable($direction) {
356
- resize: $direction; // Options: horizontal, vertical, both
357
- overflow: auto; // Safari fix
358
- }
359
-
360
- // CSS3 Content Columns
361
- @mixin content-columns($columnCount, $columnGap: $gridGutterWidth) {
362
- -webkit-column-count: $columnCount;
363
- -moz-column-count: $columnCount;
364
- column-count: $columnCount;
365
- -webkit-column-gap: $columnGap;
366
- -moz-column-gap: $columnGap;
367
- column-gap: $columnGap;
368
- }
369
-
370
- // Optional hyphenation
371
- @mixin hyphens($mode: auto) {
372
- word-wrap: break-word;
373
- -webkit-hyphens: $mode;
374
- -moz-hyphens: $mode;
375
- -ms-hyphens: $mode;
376
- -o-hyphens: $mode;
377
- hyphens: $mode;
378
- }
379
-
380
- // Opacity
381
- @mixin opacity($opacity) {
382
- opacity: $opacity / 100;
383
- filter: alpha(opacity=$opacity);
384
- }
385
-
386
-
387
-
388
- // BACKGROUNDS
389
- // --------------------------------------------------
390
-
391
- // Add an alphatransparency value to any background or border color (via Elyse Holladay)
392
- @mixin translucent-background($color: $white, $alpha: 1) {
393
- background-color: hsla(hue($color), saturation($color), lightness($color), $alpha);
394
- }
395
-
396
- @mixin translucent-border($color: $white, $alpha: 1) {
397
- border-color: hsla(hue($color), saturation($color), lightness($color), $alpha);
398
- @include background-clip(padding-box);
399
- }
400
-
401
- // Gradient Bar Colors for buttons and alerts
402
- @mixin gradientBar($primaryColor, $secondaryColor, $textColor: #fff, $textShadow: 0 -1px 0 rgba(0,0,0,.25)) {
403
- color: $textColor;
404
- text-shadow: $textShadow;
405
- @include 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) fade-in(rgba(0,0,0,.1), 0.15);
408
- }
409
-
410
- // Gradients
411
- @mixin gradient-horizontal($startColor: #555, $endColor: #333) {
412
- background-color: $endColor;
413
- background-image: -moz-linear-gradient(left, $startColor, $endColor); // FF 3.6+
414
- background-image: -webkit-gradient(linear, 0 0, 100% 0, from($startColor), to($endColor)); // Safari 4+, Chrome 2+
415
- background-image: -webkit-linear-gradient(left, $startColor, $endColor); // Safari 5.1+, Chrome 10+
416
- background-image: -o-linear-gradient(left, $startColor, $endColor); // Opera 11.10
417
- background-image: linear-gradient(to right, $startColor, $endColor); // Standard, IE10
418
- background-repeat: repeat-x;
419
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($startColor)}', endColorstr='#{ie-hex-str($endColor)}', GradientType=1); // IE9 and down
420
- }
421
- @mixin gradient-vertical($startColor: #555, $endColor: #333) {
422
- background-color: mix($startColor, $endColor, 60%);
423
- background-image: -moz-linear-gradient(top, $startColor, $endColor); // FF 3.6+
424
- background-image: -webkit-gradient(linear, 0 0, 0 100%, from($startColor), to($endColor)); // Safari 4+, Chrome 2+
425
- background-image: -webkit-linear-gradient(top, $startColor, $endColor); // Safari 5.1+, Chrome 10+
426
- background-image: -o-linear-gradient(top, $startColor, $endColor); // Opera 11.10
427
- background-image: linear-gradient(to bottom, $startColor, $endColor); // Standard, IE10
428
- background-repeat: repeat-x;
429
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($startColor)}', endColorstr='#{ie-hex-str($endColor)}', GradientType=0); // IE9 and down
430
- }
431
- @mixin gradient-directional($startColor: #555, $endColor: #333, $deg: 45deg) {
432
- background-color: $endColor;
433
- background-repeat: repeat-x;
434
- background-image: -moz-linear-gradient($deg, $startColor, $endColor); // FF 3.6+
435
- background-image: -webkit-linear-gradient($deg, $startColor, $endColor); // Safari 5.1+, Chrome 10+
436
- background-image: -o-linear-gradient($deg, $startColor, $endColor); // Opera 11.10
437
- background-image: linear-gradient($deg, $startColor, $endColor); // Standard, IE10
438
- }
439
- @mixin gradient-vertical-three-colors($startColor: #00b3ee, $midColor: #7a43b6, $colorStop: 50%, $endColor: #c3325f) {
440
- background-color: mix($midColor, $endColor, 80%);
441
- background-image: -webkit-gradient(linear, 0 0, 0 100%, from($startColor), color-stop($colorStop, $midColor), to($endColor));
442
- background-image: -webkit-linear-gradient($startColor, $midColor $colorStop, $endColor);
443
- background-image: -moz-linear-gradient(top, $startColor, $midColor $colorStop, $endColor);
444
- background-image: -o-linear-gradient($startColor, $midColor $colorStop, $endColor);
445
- background-image: linear-gradient($startColor, $midColor $colorStop, $endColor);
446
- background-repeat: no-repeat;
447
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($startColor)}', endColorstr='#{ie-hex-str($endColor)}', GradientType=0); // IE9 and down, gets no color-stop at all for proper fallback
448
- }
449
- @mixin gradient-radial($innerColor: #555, $outerColor: #333) {
450
- background-color: $outerColor;
451
- background-image: -webkit-gradient(radial, center center, 0, center center, 460, from($innerColor), to($outerColor));
452
- background-image: -webkit-radial-gradient(circle, $innerColor, $outerColor);
453
- background-image: -moz-radial-gradient(circle, $innerColor, $outerColor);
454
- background-image: -o-radial-gradient(circle, $innerColor, $outerColor);
455
- background-repeat: no-repeat;
456
- }
457
- @mixin gradient-striped($color: #555, $angle: 45deg) {
458
- background-color: $color;
459
- 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));
460
- 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);
461
- 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);
462
- 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);
463
- 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);
464
- }
465
-
466
- // Reset filters for IE
467
- @mixin reset-filter() {
468
- filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
469
- }
470
-
471
-
472
-
473
- // COMPONENT MIXINS
474
- // --------------------------------------------------
475
-
476
- // Horizontal dividers
477
- // -------------------------
478
- // Dividers (basically an hr) within dropdowns and nav lists
479
- @mixin nav-divider($top: #e5e5e5, $bottom: $white) {
480
- // IE7 needs a set width since we gave a height. Restricting just
481
- // to IE7 to keep the 1px left/right space in other browsers.
482
- // It is unclear where IE is getting the extra space that we need
483
- // to negative-margin away, but so it goes.
484
- *width: 100%;
485
- height: 1px;
486
- margin: (($baseLineHeight / 2) - 1) 1px; // 8px 1px
487
- *margin: -5px 0 5px;
488
- overflow: hidden;
489
- background-color: $top;
490
- border-bottom: 1px solid $bottom;
491
- }
492
-
493
- // Button backgrounds
494
- // ------------------
495
- @mixin buttonBackground($startColor, $endColor, $textColor: #fff, $textShadow: 0 -1px 0 rgba(0,0,0,.25)) {
496
- // gradientBar will set the background to a pleasing blend of these, to support IE<=9
497
- @include gradientBar($startColor, $endColor, $textColor, $textShadow);
498
- *background-color: $endColor; /* Darken IE7 buttons by default so they stand out more given they won't have borders */
499
- @include reset-filter();
500
-
501
- // in these cases the gradient won't cover the background, so we override
502
- &:hover, &:focus, &:active, &.active, &.disabled, &[disabled] {
503
- color: $textColor;
504
- background-color: $endColor;
505
- *background-color: darken($endColor, 5%);
506
- }
507
-
508
- // IE 7 + 8 can't handle box-shadow to show active, so we darken a bit ourselves
509
- &:active,
510
- &.active {
511
- background-color: darken($endColor, 10%) \9;
512
- }
513
- }
514
-
515
- // Navbar vertical align
516
- // -------------------------
517
- // Vertically center elements in the navbar.
518
- // Example: an element has a height of 30px, so write out `.navbarVerticalAlign(30px);` to calculate the appropriate top margin.
519
- @mixin navbarVerticalAlign($elementHeight) {
520
- margin-top: ($navbarHeight - $elementHeight) / 2;
521
- }
522
-
523
-
524
-
525
- // Grid System
526
- // -----------
527
-
528
- // Centered container element
529
- @mixin container-fixed() {
530
- margin-right: auto;
531
- margin-left: auto;
532
- @include clearfix();
533
- }
534
-
535
- // Table columns
536
- @mixin tableColumns($columnSpan: 1) {
537
- float: none; // undo default grid column styles
538
- width: (($gridColumnWidth) * $columnSpan) + ($gridGutterWidth * ($columnSpan - 1)) - 16; // 16 is total padding on left and right of table cells
539
- margin-left: 0; // undo default grid column styles
540
- }
541
-
542
- // Make a Grid
543
- // Use .makeRow and .makeColumn to assign semantic layouts grid system behavior
544
- @mixin makeRow() {
545
- margin-left: $gridGutterWidth * -1;
546
- @include clearfix();
547
- }
548
- @mixin makeColumn($columns: 1, $offset: 0) {
549
- float: left;
550
- margin-left: ($gridColumnWidth * $offset) + ($gridGutterWidth * ($offset - 1)) + ($gridGutterWidth * 2);
551
- width: ($gridColumnWidth * $columns) + ($gridGutterWidth * ($columns - 1));
552
- }
553
-
554
- // The Grid
555
- @mixin grid-core($gridColumnWidth, $gridGutterWidth) {
556
- .row {
557
- margin-left: $gridGutterWidth * -1;
558
- @include clearfix();
559
- }
560
-
561
- [class*="span"] {
562
- float: left;
563
- min-height: 1px; // prevent collapsing columns
564
- margin-left: $gridGutterWidth;
565
- }
566
-
567
- // Set the container width, and override it for fixed navbars in media queries
568
- .container,
569
- .navbar-static-top .container,
570
- .navbar-fixed-top .container,
571
- .navbar-fixed-bottom .container {
572
- @include grid-core-span($gridColumns, $gridColumnWidth, $gridGutterWidth);
573
- }
574
-
575
- // generate .spanX and .offsetX
576
- @include grid-core-span-x($gridColumns, $gridColumnWidth, $gridGutterWidth);
577
- @include grid-core-offset-x($gridColumns, $gridColumnWidth, $gridGutterWidth);
578
- }
579
-
580
- @mixin grid-core-span-x($gridColumns, $gridColumnWidth, $gridGutterWidth) {
581
- @while $gridColumns > 0 {
582
- .span#{$gridColumns} { @include grid-core-span($gridColumns, $gridColumnWidth, $gridGutterWidth)}
583
- $gridColumns: $gridColumns - 1;
584
- }
585
- }
586
-
587
- @mixin grid-core-offset-x($gridColumns, $gridColumnWidth, $gridGutterWidth) {
588
- @while $gridColumns > 0 {
589
- .offset#{$gridColumns} { @include grid-core-offset($gridColumns, $gridColumnWidth, $gridGutterWidth); }
590
- $gridColumns: $gridColumns - 1;
591
- }
592
- }
593
-
594
- @mixin grid-core-span($columns, $gridColumnWidth, $gridGutterWidth) {
595
- width: ($gridColumnWidth * $columns) + ($gridGutterWidth * ($columns - 1));
596
- }
597
-
598
- @mixin grid-core-offset($columns, $gridColumnWidth, $gridGutterWidth) {
599
- margin-left: ($gridColumnWidth * $columns) + ($gridGutterWidth * ($columns + 1));
600
- }
601
-
602
-
603
-
604
- @mixin grid-fluid($fluidGridColumnWidth, $fluidGridGutterWidth) {
605
- .row-fluid {
606
- width: 100%;
607
- @include clearfix();
608
- [class*="span"] {
609
- @include input-block-level();
610
- float: left;
611
- margin-left: $fluidGridGutterWidth;
612
- *margin-left: $fluidGridGutterWidth - (.5 / $gridRowWidth * 100px * 1%);
613
- }
614
- [class*="span"]:first-child {
615
- margin-left: 0;
616
- }
617
-
618
- // Space grid-sized controls properly if multiple per line
619
- .controls-row [class*="span"] + [class*="span"] {
620
- margin-left: $fluidGridGutterWidth;
621
- }
622
-
623
- // generate .spanX and .offsetX
624
- @include grid-fluid-span-x($gridColumns, $fluidGridColumnWidth, $fluidGridGutterWidth);
625
- @include grid-fluid-offset-x($gridColumns, $fluidGridColumnWidth, $fluidGridGutterWidth);
626
- }
627
- }
628
-
629
- @mixin grid-fluid-span-x($gridColumns, $fluidGridColumnWidth, $fluidGridGutterWidth) {
630
- @while $gridColumns > 0 {
631
- .span#{$gridColumns} { @include grid-fluid-span($gridColumns, $fluidGridColumnWidth, $fluidGridGutterWidth); }
632
- $gridColumns: $gridColumns - 1;
633
- }
634
- }
635
-
636
- @mixin grid-fluid-offset-x($gridColumns, $fluidGridColumnWidth, $fluidGridGutterWidth) {
637
- @while $gridColumns > 0 {
638
- .offset#{$gridColumns} { @include grid-fluid-offset($gridColumns, $fluidGridColumnWidth, $fluidGridGutterWidth); }
639
- .offset#{$gridColumns}:first-child { @include grid-fluid-offset-first-child($gridColumns, $fluidGridColumnWidth, $fluidGridGutterWidth); }
640
- $gridColumns: $gridColumns - 1;
641
- }
642
- }
643
-
644
- @mixin grid-fluid-span($columns, $fluidGridColumnWidth, $fluidGridGutterWidth) {
645
- width: ($fluidGridColumnWidth * $columns) + ($fluidGridGutterWidth * ($columns - 1));
646
- *width: ($fluidGridColumnWidth * $columns) + ($fluidGridGutterWidth * ($columns - 1)) - (.5 / $gridRowWidth * 100px * 1%);
647
- }
648
-
649
- @mixin grid-fluid-offset($columns, $fluidGridColumnWidth, $fluidGridGutterWidth) {
650
- margin-left: ($fluidGridColumnWidth * $columns) + ($fluidGridGutterWidth * ($columns - 1)) + ($fluidGridGutterWidth * 2);
651
- *margin-left: ($fluidGridColumnWidth * $columns) + ($fluidGridGutterWidth * ($columns - 1)) - (.5 / $gridRowWidth * 100px * 1%) + ($fluidGridGutterWidth * 2) - (.5 / $gridRowWidth * 100px * 1%);
652
- }
653
-
654
- @mixin grid-fluid-offset-first-child($columns, $fluidGridColumnWidth, $fluidGridGutterWidth) {
655
- margin-left: ($fluidGridColumnWidth * $columns) + ($fluidGridGutterWidth * ($columns - 1)) + ($fluidGridGutterWidth);
656
- *margin-left: ($fluidGridColumnWidth * $columns) + ($fluidGridGutterWidth * ($columns - 1)) - (.5 / $gridRowWidth * 100px * 1%) + $fluidGridGutterWidth - (.5 / $gridRowWidth * 100px * 1%);
657
- }
658
-
659
-
660
-
661
- @mixin grid-input($gridColumnWidth, $gridGutterWidth) {
662
- input,
663
- textarea,
664
- .uneditable-input {
665
- margin-left: 0; // override margin-left from core grid system
666
- }
667
-
668
- // Space grid-sized controls properly if multiple per line
669
- .controls-row [class*="span"] + [class*="span"] {
670
- margin-left: $gridGutterWidth;
671
- }
672
-
673
- // generate .spanX
674
- @include grid-input-span-x($gridColumns, $gridColumnWidth, $gridGutterWidth);
675
- }
676
-
677
- @mixin grid-input-span-x($gridColumns, $gridColumnWidth, $gridGutterWidth) {
678
- @while $gridColumns > 0 {
679
- input.span#{$gridColumns},
680
- textarea.span#{$gridColumns},
681
- .uneditable-input.span#{$gridColumns} {
682
- @include grid-input-span($gridColumns, $gridColumnWidth, $gridGutterWidth);
683
- }
684
- $gridColumns: $gridColumns - 1;
685
- }
686
- }
687
-
688
- @mixin grid-input-span($columns, $gridColumnWidth, $gridGutterWidth) {
689
- width: (($gridColumnWidth) * $columns) + ($gridGutterWidth * ($columns - 1)) - 14;
690
- }