bootstrap 4.0.0.alpha1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (145) hide show
  1. checksums.yaml +7 -0
  2. data/.gitattributes +14 -0
  3. data/.gitignore +19 -0
  4. data/.travis.yml +16 -0
  5. data/CHANGELOG.md +7 -0
  6. data/Gemfile +13 -0
  7. data/LICENSE +21 -0
  8. data/README.md +143 -0
  9. data/Rakefile +75 -0
  10. data/assets/javascripts/bootstrap-sprockets.js +11 -0
  11. data/assets/javascripts/bootstrap.js +3560 -0
  12. data/assets/javascripts/bootstrap.min.js +220 -0
  13. data/assets/javascripts/bootstrap/alert.js +192 -0
  14. data/assets/javascripts/bootstrap/button.js +172 -0
  15. data/assets/javascripts/bootstrap/carousel.js +478 -0
  16. data/assets/javascripts/bootstrap/collapse.js +364 -0
  17. data/assets/javascripts/bootstrap/dropdown.js +293 -0
  18. data/assets/javascripts/bootstrap/modal.js +536 -0
  19. data/assets/javascripts/bootstrap/popover.js +201 -0
  20. data/assets/javascripts/bootstrap/scrollspy.js +320 -0
  21. data/assets/javascripts/bootstrap/tab.js +263 -0
  22. data/assets/javascripts/bootstrap/tooltip.js +619 -0
  23. data/assets/javascripts/bootstrap/util.js +157 -0
  24. data/assets/stylesheets/_bootstrap-flex.scss +8 -0
  25. data/assets/stylesheets/_bootstrap-grid.scss +62 -0
  26. data/assets/stylesheets/_bootstrap-reboot.scss +10 -0
  27. data/assets/stylesheets/_bootstrap.scss +55 -0
  28. data/assets/stylesheets/bootstrap/_alert.scss +65 -0
  29. data/assets/stylesheets/bootstrap/_animation.scss +27 -0
  30. data/assets/stylesheets/bootstrap/_breadcrumb.scss +23 -0
  31. data/assets/stylesheets/bootstrap/_button-group.scss +224 -0
  32. data/assets/stylesheets/bootstrap/_buttons.scss +174 -0
  33. data/assets/stylesheets/bootstrap/_card.scss +293 -0
  34. data/assets/stylesheets/bootstrap/_carousel.scss +252 -0
  35. data/assets/stylesheets/bootstrap/_close.scss +28 -0
  36. data/assets/stylesheets/bootstrap/_code.scss +58 -0
  37. data/assets/stylesheets/bootstrap/_custom-forms.scss +225 -0
  38. data/assets/stylesheets/bootstrap/_dropdown.scss +191 -0
  39. data/assets/stylesheets/bootstrap/_forms.scss +454 -0
  40. data/assets/stylesheets/bootstrap/_grid.scss +76 -0
  41. data/assets/stylesheets/bootstrap/_images.scss +28 -0
  42. data/assets/stylesheets/bootstrap/_input-group.scss +181 -0
  43. data/assets/stylesheets/bootstrap/_jumbotron.scss +22 -0
  44. data/assets/stylesheets/bootstrap/_labels.scss +75 -0
  45. data/assets/stylesheets/bootstrap/_list-group.scss +128 -0
  46. data/assets/stylesheets/bootstrap/_media.scss +90 -0
  47. data/assets/stylesheets/bootstrap/_mixins.scss +54 -0
  48. data/assets/stylesheets/bootstrap/_modal.scss +146 -0
  49. data/assets/stylesheets/bootstrap/_nav.scss +155 -0
  50. data/assets/stylesheets/bootstrap/_navbar.scss +230 -0
  51. data/assets/stylesheets/bootstrap/_normalize.scss +428 -0
  52. data/assets/stylesheets/bootstrap/_pager.scss +57 -0
  53. data/assets/stylesheets/bootstrap/_pagination.scss +82 -0
  54. data/assets/stylesheets/bootstrap/_popover.scss +140 -0
  55. data/assets/stylesheets/bootstrap/_print.scss +88 -0
  56. data/assets/stylesheets/bootstrap/_progress.scss +156 -0
  57. data/assets/stylesheets/bootstrap/_reboot.scss +298 -0
  58. data/assets/stylesheets/bootstrap/_responsive-embed.scss +38 -0
  59. data/assets/stylesheets/bootstrap/_tables.scss +193 -0
  60. data/assets/stylesheets/bootstrap/_tooltip.scss +85 -0
  61. data/assets/stylesheets/bootstrap/_type.scss +192 -0
  62. data/assets/stylesheets/bootstrap/_utilities-responsive.scss +49 -0
  63. data/assets/stylesheets/bootstrap/_utilities-spacing.scss +78 -0
  64. data/assets/stylesheets/bootstrap/_utilities.scss +117 -0
  65. data/assets/stylesheets/bootstrap/_variables.scss +632 -0
  66. data/assets/stylesheets/bootstrap/mixins/_alert.scss +14 -0
  67. data/assets/stylesheets/bootstrap/mixins/_background-variant.scss +13 -0
  68. data/assets/stylesheets/bootstrap/mixins/_border-radius.scss +35 -0
  69. data/assets/stylesheets/bootstrap/mixins/_breakpoints.scss +76 -0
  70. data/assets/stylesheets/bootstrap/mixins/_buttons.scss +100 -0
  71. data/assets/stylesheets/bootstrap/mixins/_center-block.scss +7 -0
  72. data/assets/stylesheets/bootstrap/mixins/_clearfix.scss +7 -0
  73. data/assets/stylesheets/bootstrap/mixins/_forms.scss +89 -0
  74. data/assets/stylesheets/bootstrap/mixins/_gradients.scss +43 -0
  75. data/assets/stylesheets/bootstrap/mixins/_grid-framework.scss +44 -0
  76. data/assets/stylesheets/bootstrap/mixins/_grid.scss +75 -0
  77. data/assets/stylesheets/bootstrap/mixins/_hover.scss +59 -0
  78. data/assets/stylesheets/bootstrap/mixins/_image.scss +33 -0
  79. data/assets/stylesheets/bootstrap/mixins/_label.scss +11 -0
  80. data/assets/stylesheets/bootstrap/mixins/_list-group.scss +30 -0
  81. data/assets/stylesheets/bootstrap/mixins/_lists.scss +7 -0
  82. data/assets/stylesheets/bootstrap/mixins/_nav-divider.scss +10 -0
  83. data/assets/stylesheets/bootstrap/mixins/_navbar-align.scss +9 -0
  84. data/assets/stylesheets/bootstrap/mixins/_pagination.scss +24 -0
  85. data/assets/stylesheets/bootstrap/mixins/_progress.scss +18 -0
  86. data/assets/stylesheets/bootstrap/mixins/_pulls.scss +6 -0
  87. data/assets/stylesheets/bootstrap/mixins/_reset-filter.scss +8 -0
  88. data/assets/stylesheets/bootstrap/mixins/_reset-text.scss +18 -0
  89. data/assets/stylesheets/bootstrap/mixins/_resize.scss +6 -0
  90. data/assets/stylesheets/bootstrap/mixins/_screen-reader.scss +32 -0
  91. data/assets/stylesheets/bootstrap/mixins/_size.scss +6 -0
  92. data/assets/stylesheets/bootstrap/mixins/_tab-focus.scss +9 -0
  93. data/assets/stylesheets/bootstrap/mixins/_table-row.scss +30 -0
  94. data/assets/stylesheets/bootstrap/mixins/_text-emphasis.scss +12 -0
  95. data/assets/stylesheets/bootstrap/mixins/_text-hide.scss +8 -0
  96. data/assets/stylesheets/bootstrap/mixins/_text-truncate.scss +8 -0
  97. data/bootstrap.gemspec +36 -0
  98. data/lib/bootstrap.rb +76 -0
  99. data/lib/bootstrap/engine.rb +11 -0
  100. data/lib/bootstrap/version.rb +4 -0
  101. data/tasks/updater.rb +67 -0
  102. data/tasks/updater/js.rb +37 -0
  103. data/tasks/updater/logger.rb +57 -0
  104. data/tasks/updater/network.rb +101 -0
  105. data/tasks/updater/scss.rb +34 -0
  106. data/templates/project/_bootstrap-variables.scss +633 -0
  107. data/templates/project/manifest.rb +18 -0
  108. data/templates/project/styles.scss +10 -0
  109. data/test/compass_test.rb +9 -0
  110. data/test/dummy_rails/README.rdoc +3 -0
  111. data/test/dummy_rails/Rakefile +6 -0
  112. data/test/dummy_rails/app/assets/images/.keep +0 -0
  113. data/test/dummy_rails/app/assets/javascripts/application.js +7 -0
  114. data/test/dummy_rails/app/assets/stylesheets/application.sass +1 -0
  115. data/test/dummy_rails/app/controllers/application_controller.rb +5 -0
  116. data/test/dummy_rails/app/controllers/pages_controller.rb +4 -0
  117. data/test/dummy_rails/app/helpers/application_helper.rb +2 -0
  118. data/test/dummy_rails/app/views/layouts/application.html.erb +14 -0
  119. data/test/dummy_rails/app/views/pages/root.html.slim +58 -0
  120. data/test/dummy_rails/config.ru +4 -0
  121. data/test/dummy_rails/config/application.rb +34 -0
  122. data/test/dummy_rails/config/boot.rb +5 -0
  123. data/test/dummy_rails/config/environment.rb +5 -0
  124. data/test/dummy_rails/config/environments/development.rb +23 -0
  125. data/test/dummy_rails/config/environments/production.rb +82 -0
  126. data/test/dummy_rails/config/environments/test.rb +38 -0
  127. data/test/dummy_rails/config/initializers/backtrace_silencers.rb +7 -0
  128. data/test/dummy_rails/config/initializers/filter_parameter_logging.rb +4 -0
  129. data/test/dummy_rails/config/initializers/inflections.rb +16 -0
  130. data/test/dummy_rails/config/initializers/mime_types.rb +5 -0
  131. data/test/dummy_rails/config/initializers/secret_token.rb +18 -0
  132. data/test/dummy_rails/config/initializers/session_store.rb +3 -0
  133. data/test/dummy_rails/config/initializers/wrap_parameters.rb +14 -0
  134. data/test/dummy_rails/config/locales/en.yml +3 -0
  135. data/test/dummy_rails/config/locales/es.yml +3 -0
  136. data/test/dummy_rails/config/routes.rb +3 -0
  137. data/test/dummy_rails/log/.keep +0 -0
  138. data/test/gemfiles/rails_4_2.gemfile +11 -0
  139. data/test/gemfiles/rails_head.gemfile +19 -0
  140. data/test/rails_test.rb +19 -0
  141. data/test/support/dummy_rails_integration.rb +22 -0
  142. data/test/support/reporting.rb +27 -0
  143. data/test/test_helper.rb +35 -0
  144. data/test/test_helper_rails.rb +6 -0
  145. metadata +433 -0
@@ -0,0 +1,252 @@
1
+ // Wrapper for the slide container and indicators
2
+ .carousel {
3
+ position: relative;
4
+ }
5
+
6
+ .carousel-inner {
7
+ position: relative;
8
+ width: 100%;
9
+ overflow: hidden;
10
+
11
+ > .carousel-item {
12
+ position: relative;
13
+ display: none;
14
+ transition: .6s ease-in-out left;
15
+
16
+ // Account for jankitude on images
17
+ > img,
18
+ > a > img {
19
+ @extend .img-fluid;
20
+ line-height: 1;
21
+ }
22
+
23
+ // WebKit CSS3 transforms for supported devices
24
+ @media all and (transform-3d), (-webkit-transform-3d) {
25
+ transition: transform .6s ease-in-out;
26
+ backface-visibility: hidden;
27
+ perspective: 1000px;
28
+
29
+ &.next,
30
+ &.active.right {
31
+ left: 0;
32
+ transform: translate3d(100%, 0, 0);
33
+ }
34
+ &.prev,
35
+ &.active.left {
36
+ left: 0;
37
+ transform: translate3d(-100%, 0, 0);
38
+ }
39
+ &.next.left,
40
+ &.prev.right,
41
+ &.active {
42
+ left: 0;
43
+ transform: translate3d(0, 0, 0);
44
+ }
45
+ }
46
+ }
47
+
48
+ > .active,
49
+ > .next,
50
+ > .prev {
51
+ display: block;
52
+ }
53
+
54
+ > .active {
55
+ left: 0;
56
+ }
57
+
58
+ > .next,
59
+ > .prev {
60
+ position: absolute;
61
+ top: 0;
62
+ width: 100%;
63
+ }
64
+
65
+ > .next {
66
+ left: 100%;
67
+ }
68
+ > .prev {
69
+ left: -100%;
70
+ }
71
+ > .next.left,
72
+ > .prev.right {
73
+ left: 0;
74
+ }
75
+
76
+ > .active.left {
77
+ left: -100%;
78
+ }
79
+ > .active.right {
80
+ left: 100%;
81
+ }
82
+ }
83
+
84
+
85
+ //
86
+ // Left/right controls for nav
87
+ //
88
+
89
+ .carousel-control {
90
+ position: absolute;
91
+ top: 0;
92
+ bottom: 0;
93
+ left: 0;
94
+ width: $carousel-control-width;
95
+ font-size: $carousel-control-font-size;
96
+ color: $carousel-control-color;
97
+ text-align: center;
98
+ text-shadow: $carousel-text-shadow;
99
+ opacity: $carousel-control-opacity;
100
+ // We can't have this transition here because WebKit cancels the carousel
101
+ // animation if you trip this while in the middle of another animation.
102
+
103
+ // Set gradients for backgrounds
104
+ &.left {
105
+ @include gradient-horizontal($start-color: rgba(0,0,0,.5), $end-color: rgba(0,0,0,.0001));
106
+ }
107
+ &.right {
108
+ right: 0;
109
+ left: auto;
110
+ @include gradient-horizontal($start-color: rgba(0,0,0,.0001), $end-color: rgba(0,0,0,.5));
111
+ }
112
+
113
+ // Hover/focus state
114
+ @include hover-focus {
115
+ color: $carousel-control-color;
116
+ text-decoration: none;
117
+ outline: 0;
118
+ opacity: .9;
119
+ }
120
+
121
+ // Toggles
122
+ .icon-prev,
123
+ .icon-next {
124
+ position: absolute;
125
+ top: 50%;
126
+ z-index: 5;
127
+ display: inline-block;
128
+ width: 20px;
129
+ height: 20px;
130
+ margin-top: -10px;
131
+ font-family: serif;
132
+ line-height: 1;
133
+ }
134
+ .icon-prev {
135
+ left: 50%;
136
+ margin-left: -10px;
137
+ }
138
+ .icon-next {
139
+ right: 50%;
140
+ margin-right: -10px;
141
+ }
142
+
143
+ .icon-prev {
144
+ &::before {
145
+ content: "\2039";// SINGLE LEFT-POINTING ANGLE QUOTATION MARK (U+2039)
146
+ }
147
+ }
148
+ .icon-next {
149
+ &::before {
150
+ content: "\203a";// SINGLE RIGHT-POINTING ANGLE QUOTATION MARK (U+203A)
151
+ }
152
+ }
153
+ }
154
+
155
+
156
+ // Optional indicator pips
157
+ //
158
+ // Add an unordered list with the following class and add a list item for each
159
+ // slide your carousel holds.
160
+
161
+ .carousel-indicators {
162
+ position: absolute;
163
+ bottom: 10px;
164
+ left: 50%;
165
+ z-index: 15;
166
+ width: 60%;
167
+ padding-left: 0;
168
+ margin-left: -30%;
169
+ text-align: center;
170
+ list-style: none;
171
+
172
+ li {
173
+ display: inline-block;
174
+ width: 10px;
175
+ height: 10px;
176
+ margin: 1px;
177
+ text-indent: -999px;
178
+ cursor: pointer;
179
+ // IE9 hack for event handling
180
+ //
181
+ // Internet Explorer 9 does not support clicks on elements without a set
182
+ // `background-color`. We cannot use `filter` since that's not viewed as a
183
+ // background color by the browser. Thus, a hack is needed.
184
+ background-color: rgba(0,0,0,0); // IE9
185
+ border: 1px solid $carousel-indicator-border-color;
186
+ border-radius: 10px;
187
+ }
188
+ .active {
189
+ width: 12px;
190
+ height: 12px;
191
+ margin: 0;
192
+ background-color: $carousel-indicator-active-bg;
193
+ }
194
+ }
195
+
196
+
197
+ // Optional captions
198
+ //
199
+ // Hidden by default for smaller viewports.
200
+
201
+ .carousel-caption {
202
+ position: absolute;
203
+ right: 15%;
204
+ bottom: 20px;
205
+ left: 15%;
206
+ z-index: 10;
207
+ padding-top: 20px;
208
+ padding-bottom: 20px;
209
+ color: $carousel-caption-color;
210
+ text-align: center;
211
+ text-shadow: $carousel-text-shadow;
212
+
213
+ .btn {
214
+ text-shadow: none; // No shadow for button elements in carousel-caption
215
+ }
216
+ }
217
+
218
+
219
+ //
220
+ // Responsive variations
221
+ //
222
+
223
+ @include media-breakpoint-up(sm) {
224
+ // Scale up the controls a smidge
225
+ .carousel-control {
226
+ .icon-prev,
227
+ .icon-next {
228
+ width: 30px;
229
+ height: 30px;
230
+ margin-top: -15px;
231
+ font-size: 30px;
232
+ }
233
+ .icon-prev {
234
+ margin-left: -15px;
235
+ }
236
+ .icon-next {
237
+ margin-right: -15px;
238
+ }
239
+ }
240
+
241
+ // Show and left align the captions
242
+ .carousel-caption {
243
+ right: 20%;
244
+ left: 20%;
245
+ padding-bottom: 30px;
246
+ }
247
+
248
+ // Move up the indicators
249
+ .carousel-indicators {
250
+ bottom: 20px;
251
+ }
252
+ }
@@ -0,0 +1,28 @@
1
+ .close {
2
+ float: right;
3
+ font-size: ($font-size-base * 1.5);
4
+ font-weight: $close-font-weight;
5
+ line-height: 1;
6
+ color: $close-color;
7
+ text-shadow: $close-text-shadow;
8
+ opacity: .2;
9
+
10
+ @include hover-focus {
11
+ color: $close-color;
12
+ text-decoration: none;
13
+ cursor: pointer;
14
+ opacity: .5;
15
+ }
16
+ }
17
+
18
+ // Additional properties for button version
19
+ // iOS requires the button element instead of an anchor tag.
20
+ // If you want the anchor version, it requires `href="#"`.
21
+ // See https://developer.mozilla.org/en-US/docs/Web/Events/click#Safari_Mobile
22
+ button.close {
23
+ padding: 0;
24
+ cursor: pointer;
25
+ background: transparent;
26
+ border: 0;
27
+ -webkit-appearance: none;
28
+ }
@@ -0,0 +1,58 @@
1
+ // Inline and block code styles
2
+ code,
3
+ kbd,
4
+ pre,
5
+ samp {
6
+ font-family: $font-family-monospace;
7
+ }
8
+
9
+ // Inline code
10
+ code {
11
+ padding: .2rem .4rem;
12
+ font-size: 90%;
13
+ color: $code-color;
14
+ background-color: $code-bg;
15
+ @include border-radius($border-radius);
16
+ }
17
+
18
+ // User input typically entered via keyboard
19
+ kbd {
20
+ padding: .2rem .4rem;
21
+ font-size: 90%;
22
+ color: $kbd-color;
23
+ background-color: $kbd-bg;
24
+ @include border-radius($border-radius-sm);
25
+ @include box-shadow(inset 0 -.1rem 0 rgba(0,0,0,.25));
26
+
27
+ kbd {
28
+ padding: 0;
29
+ font-size: 100%;
30
+ font-weight: bold;
31
+ @include box-shadow(none);
32
+ }
33
+ }
34
+
35
+ // Blocks of code
36
+ pre {
37
+ display: block;
38
+ margin-top: 0;
39
+ margin-bottom: 1rem;
40
+ font-size: 90%;
41
+ line-height: $line-height;
42
+ color: $pre-color;
43
+
44
+ // Account for some code outputs that place code tags in pre tags
45
+ code {
46
+ padding: 0;
47
+ font-size: inherit;
48
+ color: inherit;
49
+ background-color: transparent;
50
+ border-radius: 0;
51
+ }
52
+ }
53
+
54
+ // Enable scrollable blocks of code
55
+ .pre-scrollable {
56
+ max-height: $pre-scrollable-max-height;
57
+ overflow-y: scroll;
58
+ }
@@ -0,0 +1,225 @@
1
+ // Embedded icons from Open Iconic.
2
+ // Released under MIT and copyright 2014 Waybury.
3
+ // http://useiconic.com/open
4
+
5
+
6
+ // Checkboxes and radios
7
+ //
8
+ // Base class takes care of all the key behavioral aspects.
9
+
10
+ .c-input {
11
+ position: relative;
12
+ display: inline;
13
+ padding-left: 1.5rem;
14
+ color: #555;
15
+ cursor: pointer;
16
+
17
+ > input {
18
+ position: absolute;
19
+ z-index: -1; // Put the input behind the label so it doesn't overlay text
20
+ opacity: 0;
21
+
22
+ &:checked ~ .c-indicator {
23
+ color: #fff;
24
+ background-color: #0074d9;
25
+ @include box-shadow(none);
26
+ }
27
+
28
+ &:focus ~ .c-indicator {
29
+ // the mixin is not used here to make sure there is feedback
30
+ box-shadow: 0 0 0 .075rem #fff, 0 0 0 .2rem #0074d9;
31
+ }
32
+
33
+ &:active ~ .c-indicator {
34
+ color: #fff;
35
+ background-color: #84c6ff;
36
+ @include box-shadow(none);
37
+ }
38
+ }
39
+
40
+ + .c-input {
41
+ margin-left: 1rem;
42
+ }
43
+ }
44
+
45
+ // Custom indicator
46
+ //
47
+ // Generates a shadow element to create our makeshift checkbox/radio background.
48
+
49
+ .c-indicator {
50
+ position: absolute;
51
+ top: 0;
52
+ left: 0;
53
+ display: block;
54
+ width: 1rem;
55
+ height: 1rem;
56
+ font-size: 65%;
57
+ line-height: 1rem;
58
+ color: #eee;
59
+ text-align: center;
60
+ user-select: none;
61
+ background-color: #eee;
62
+ background-repeat: no-repeat;
63
+ background-position: center center;
64
+ background-size: 50% 50%;
65
+ @include box-shadow(inset 0 .125rem .125rem rgba(0,0,0,.1));
66
+ }
67
+
68
+ // Checkboxes
69
+ //
70
+ // Tweak just a few things for checkboxes.
71
+
72
+ .c-checkbox {
73
+ .c-indicator {
74
+ border-radius: .25rem;
75
+ }
76
+
77
+ input:checked ~ .c-indicator {
78
+ background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNy4xLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgOCA4IiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCA4IDgiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPHBhdGggZmlsbD0iI0ZGRkZGRiIgZD0iTTYuNCwxTDUuNywxLjdMMi45LDQuNUwyLjEsMy43TDEuNCwzTDAsNC40bDAuNywwLjdsMS41LDEuNWwwLjcsMC43bDAuNy0wLjdsMy41LTMuNWwwLjctMC43TDYuNCwxTDYuNCwxeiINCgkvPg0KPC9zdmc+DQo=);
79
+ }
80
+
81
+ input:indeterminate ~ .c-indicator {
82
+ background-color: #0074d9;
83
+ background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNy4xLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iOHB4IiBoZWlnaHQ9IjhweCIgdmlld0JveD0iMCAwIDggOCIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgOCA4IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwYXRoIGZpbGw9IiNGRkZGRkYiIGQ9Ik0wLDN2Mmg4VjNIMHoiLz4NCjwvc3ZnPg0K);
84
+ @include box-shadow(none);
85
+ }
86
+ }
87
+
88
+ // Radios
89
+ //
90
+ // Tweak just a few things for radios.
91
+
92
+ .c-radio {
93
+ .c-indicator {
94
+ border-radius: 50%;
95
+ }
96
+
97
+ input:checked ~ .c-indicator {
98
+ background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNy4xLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgOCA4IiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCA4IDgiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPHBhdGggZmlsbD0iI0ZGRkZGRiIgZD0iTTQsMUMyLjMsMSwxLDIuMywxLDRzMS4zLDMsMywzczMtMS4zLDMtM1M1LjcsMSw0LDF6Ii8+DQo8L3N2Zz4NCg==);
99
+ }
100
+ }
101
+
102
+
103
+ // Layout options
104
+ //
105
+ // By default radios and checkboxes are `inline-block` with no additional spacing
106
+ // set. Use these optional classes to tweak the layout.
107
+
108
+ .c-inputs-stacked {
109
+ .c-input {
110
+ display: inline;
111
+
112
+ &::after {
113
+ display: block;
114
+ margin-bottom: .25rem;
115
+ content: "";
116
+ }
117
+
118
+ + .c-input {
119
+ margin-left: 0;
120
+ }
121
+ }
122
+ }
123
+
124
+
125
+ // Select
126
+ //
127
+ // Replaces the browser default select with a custom one, mostly pulled from
128
+ // http://primercss.io.
129
+ //
130
+ // Includes IE9-specific hacks (noted by ` \9`).
131
+
132
+ .c-select {
133
+ display: inline-block;
134
+ max-width: 100%;
135
+ padding: .375rem 1.75rem .375rem .75rem;
136
+ padding-right: .75rem \9;
137
+ vertical-align: middle;
138
+ background: #fff url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAUCAMAAACzvE1FAAAADFBMVEUzMzMzMzMzMzMzMzMKAG/3AAAAA3RSTlMAf4C/aSLHAAAAPElEQVR42q3NMQ4AIAgEQTn//2cLdRKppSGzBYwzVXvznNWs8C58CiussPJj8h6NwgorrKRdTvuV9v16Afn0AYFOB7aYAAAAAElFTkSuQmCC) no-repeat right .75rem center;
139
+ background-image: none \9;
140
+ background-size: 8px 10px;
141
+ border: 1px solid $input-border;
142
+ // Use vendor prefixes as `appearance` isn't part of the CSS spec.
143
+ -moz-appearance: none;
144
+ -webkit-appearance: none;
145
+
146
+ &:focus {
147
+ border-color: #51a7e8;
148
+ outline: none;
149
+ @include box-shadow(inset 0 1px 2px rgba(0, 0, 0, 0.075), 0 0 5px rgba(81, 167, 232, 0.5));
150
+ }
151
+
152
+ // Hides the default caret in IE11
153
+ &::-ms-expand {
154
+ opacity: 0;
155
+ }
156
+ }
157
+
158
+ .c-select-sm {
159
+ padding-top: 3px;
160
+ padding-bottom: 3px;
161
+ font-size: 12px;
162
+
163
+ &:not([multiple]) {
164
+ height: 26px;
165
+ min-height: 26px;
166
+ }
167
+ }
168
+
169
+
170
+ // File
171
+ //
172
+ // Custom file input.
173
+
174
+ .file {
175
+ position: relative;
176
+ display: inline-block;
177
+ height: 2.5rem;
178
+ cursor: pointer;
179
+ }
180
+ .file input {
181
+ min-width: 14rem;
182
+ margin: 0;
183
+ filter: alpha(opacity = 0);
184
+ opacity: 0;
185
+ }
186
+ .file-custom {
187
+ position: absolute;
188
+ top: 0;
189
+ right: 0;
190
+ left: 0;
191
+ z-index: 5;
192
+ height: 2.5rem;
193
+ padding: .5rem 1rem;
194
+ line-height: 1.5;
195
+ color: #555;
196
+ user-select: none;
197
+ background-color: #fff;
198
+ border: .075rem solid #ddd;
199
+ border-radius: .25rem;
200
+ @include box-shadow(inset 0 .2rem .4rem rgba(0,0,0,.05));
201
+ }
202
+ .file-custom::after {
203
+ content: "Choose file...";
204
+ }
205
+ .file-custom::before {
206
+ position: absolute;
207
+ top: -.075rem;
208
+ right: -.075rem;
209
+ bottom: -.075rem;
210
+ z-index: 6;
211
+ display: block;
212
+ height: 2.5rem;
213
+ padding: .5rem 1rem;
214
+ line-height: 1.5;
215
+ color: #555;
216
+ content: "Browse";
217
+ background-color: #eee;
218
+ border: .075rem solid #ddd;
219
+ border-radius: 0 .25rem .25rem 0;
220
+ }
221
+
222
+ // Focus state
223
+ .file input:focus ~ .file-custom {
224
+ @include box-shadow(0 0 0 .075rem #fff, 0 0 0 .2rem #0074d9);
225
+ }