active_frontend 13.3.0 → 14.0.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (221) hide show
  1. checksums.yaml +4 -4
  2. data/.DS_Store +0 -0
  3. data/.fasterer.yml +19 -0
  4. data/.reek +27 -0
  5. data/.rubocop.yml +38 -0
  6. data/.scss-lint.yml +27 -0
  7. data/Rakefile +1 -1
  8. data/active_frontend.gemspec +21 -18
  9. data/app/.DS_Store +0 -0
  10. data/app/assets/.DS_Store +0 -0
  11. data/app/assets/fonts/.DS_Store +0 -0
  12. data/app/assets/fonts/dripicons/.DS_Store +0 -0
  13. data/app/assets/fonts/dripicons/dripicons.woff +0 -0
  14. data/app/assets/fonts/fakt-pro/.DS_Store +0 -0
  15. data/app/assets/fonts/fakt-pro/fakt-pro-bold.woff +0 -0
  16. data/app/assets/fonts/fakt-pro/fakt-pro-normal.woff +0 -0
  17. data/app/assets/fonts/fakt-pro/fakt-pro-semibold.woff +0 -0
  18. data/app/assets/fonts/fakt-pro/fakt-pro-semilight.woff +0 -0
  19. data/app/assets/fonts/fakt-soft-pro/.DS_Store +0 -0
  20. data/app/assets/fonts/fakt-soft-pro/fakt-soft-pro-bold.woff +0 -0
  21. data/app/assets/fonts/fakt-soft-pro/fakt-soft-pro-normal.woff +0 -0
  22. data/app/assets/fonts/fakt-soft-pro/fakt-soft-pro-semibold.woff +0 -0
  23. data/app/assets/fonts/fakt-soft-pro/fakt-soft-pro-semilight.woff +0 -0
  24. data/app/assets/images/.DS_Store +0 -0
  25. data/app/assets/images/.keep +0 -0
  26. data/app/assets/images/placeholders/.DS_Store +0 -0
  27. data/app/assets/images/placeholders/camera-large.png +0 -0
  28. data/app/assets/images/placeholders/camera-small.png +0 -0
  29. data/app/assets/images/placeholders/camera.png +0 -0
  30. data/app/assets/images/placeholders/document-large.png +0 -0
  31. data/app/assets/images/placeholders/document-small.png +0 -0
  32. data/app/assets/images/placeholders/document.png +0 -0
  33. data/app/assets/images/placeholders/photo-large.png +0 -0
  34. data/app/assets/images/placeholders/{picture-small.png → photo-small.png} +0 -0
  35. data/app/assets/images/placeholders/photo.png +0 -0
  36. data/app/assets/images/placeholders/store-large.png +0 -0
  37. data/app/assets/images/placeholders/store-small.png +0 -0
  38. data/app/assets/images/placeholders/store.png +0 -0
  39. data/app/assets/images/placeholders/user-large.png +0 -0
  40. data/app/assets/images/placeholders/user-small.png +0 -0
  41. data/app/assets/images/placeholders/user.png +0 -0
  42. data/app/helpers/active_frontend_helper.rb +22 -37
  43. data/lib/.DS_Store +0 -0
  44. data/lib/active_frontend.rb +3 -4
  45. data/lib/active_frontend/.DS_Store +0 -0
  46. data/lib/active_frontend/version.rb +1 -1
  47. data/lib/generators/active_frontend/install_generator.rb +3 -3
  48. data/lib/generators/active_frontend/templates/install.js +35 -30
  49. data/lib/generators/active_frontend/templates/install.scss +55 -58
  50. data/vendor/.DS_Store +0 -0
  51. data/vendor/assets/.DS_Store +0 -0
  52. data/vendor/assets/javascripts/.DS_Store +0 -0
  53. data/vendor/assets/javascripts/active_frontend.js +35 -30
  54. data/vendor/assets/javascripts/base/_affix.js +170 -0
  55. data/vendor/assets/javascripts/base/_alert.js +80 -0
  56. data/vendor/assets/javascripts/base/_animation.js +106 -0
  57. data/vendor/assets/javascripts/base/_button.js +123 -0
  58. data/vendor/assets/javascripts/base/_carousel.js +237 -0
  59. data/vendor/assets/javascripts/base/_collapse.js +200 -0
  60. data/vendor/assets/javascripts/base/_colorpicker.js +147 -0
  61. data/vendor/assets/javascripts/base/_datepicker.js +1411 -0
  62. data/vendor/assets/javascripts/base/_dropdown.js +154 -0
  63. data/vendor/assets/javascripts/base/_filepicker.js +235 -0
  64. data/vendor/assets/javascripts/base/_hoverdown.js +116 -0
  65. data/vendor/assets/javascripts/base/_layout.js +126 -0
  66. data/vendor/assets/javascripts/base/_list.js +103 -0
  67. data/vendor/assets/javascripts/{_modal.js → base/_modal.js} +170 -167
  68. data/vendor/assets/javascripts/base/_popover.js +101 -0
  69. data/vendor/assets/javascripts/base/_scrollspy.js +161 -0
  70. data/vendor/assets/javascripts/base/_switch.js +160 -0
  71. data/vendor/assets/javascripts/base/_tab.js +139 -0
  72. data/vendor/assets/javascripts/base/_table.js +224 -0
  73. data/vendor/assets/javascripts/base/_timeago.js +270 -0
  74. data/vendor/assets/javascripts/base/_timepicker.js +541 -0
  75. data/vendor/assets/javascripts/base/_tooltip.js +525 -0
  76. data/vendor/assets/javascripts/base/_tour.js +268 -0
  77. data/vendor/assets/javascripts/base/_transition.js +52 -0
  78. data/vendor/assets/javascripts/base/_typeahead.js +362 -0
  79. data/vendor/assets/javascripts/extensions/_calendar.js +4709 -0
  80. data/vendor/assets/javascripts/extensions/_chart.js +9371 -0
  81. data/vendor/assets/javascripts/extensions/_map.js +2153 -0
  82. data/vendor/assets/stylesheets/.DS_Store +0 -0
  83. data/vendor/assets/stylesheets/{_mixin.scss → _utility.scss} +96 -10
  84. data/vendor/assets/stylesheets/_variable.scss +201 -19
  85. data/vendor/assets/stylesheets/active_frontend.scss +55 -58
  86. data/vendor/assets/stylesheets/blocks/_anchor.scss +15 -0
  87. data/vendor/assets/stylesheets/blocks/_button.scss +278 -0
  88. data/vendor/assets/stylesheets/blocks/_code.scss +144 -0
  89. data/vendor/assets/stylesheets/blocks/_common.scss +127 -0
  90. data/vendor/assets/stylesheets/blocks/_form.scss +508 -0
  91. data/vendor/assets/stylesheets/blocks/_icon.scss +359 -0
  92. data/vendor/assets/stylesheets/blocks/_list.scss +76 -0
  93. data/vendor/assets/stylesheets/blocks/_multimedia.scss +62 -0
  94. data/vendor/assets/stylesheets/blocks/_reset.scss +179 -0
  95. data/vendor/assets/stylesheets/blocks/_table.scss +211 -0
  96. data/vendor/assets/stylesheets/blocks/_typography.scss +204 -0
  97. data/vendor/assets/stylesheets/components/_ad.scss +78 -0
  98. data/vendor/assets/stylesheets/components/_affix.scss +14 -0
  99. data/vendor/assets/stylesheets/components/_alert.scss +50 -0
  100. data/vendor/assets/stylesheets/components/_animation.scss +1670 -0
  101. data/vendor/assets/stylesheets/components/_breadcrumb.scss +17 -0
  102. data/vendor/assets/stylesheets/components/_calendar.scss +213 -0
  103. data/vendor/assets/stylesheets/components/_card.scss +30 -0
  104. data/vendor/assets/stylesheets/components/_carousel.scss +135 -0
  105. data/vendor/assets/stylesheets/components/_chart.scss +10 -0
  106. data/vendor/assets/stylesheets/components/_collapse.scss +17 -0
  107. data/vendor/assets/stylesheets/components/_colorpicker.scss +38 -0
  108. data/vendor/assets/stylesheets/components/_datepicker.scss +80 -0
  109. data/vendor/assets/stylesheets/components/_dropmenu.scss +151 -0
  110. data/vendor/assets/stylesheets/components/_footer.scss +11 -0
  111. data/vendor/assets/stylesheets/components/_grid.scss +144 -0
  112. data/vendor/assets/stylesheets/components/_header.scss +99 -0
  113. data/vendor/assets/stylesheets/components/_label_and_badge.scss +57 -0
  114. data/vendor/assets/stylesheets/components/_layout.scss +63 -0
  115. data/vendor/assets/stylesheets/components/_map.scss +14 -0
  116. data/vendor/assets/stylesheets/components/_milestone.scss +49 -0
  117. data/vendor/assets/stylesheets/components/_missive.scss +40 -0
  118. data/vendor/assets/stylesheets/components/_modal.scss +126 -0
  119. data/vendor/assets/stylesheets/components/_nav_and_tab.scss +202 -0
  120. data/vendor/assets/stylesheets/components/_navbar.scss +66 -0
  121. data/vendor/assets/stylesheets/components/_pagination.scss +79 -0
  122. data/vendor/assets/stylesheets/components/_placeholder.scss +23 -0
  123. data/vendor/assets/stylesheets/components/_popover.scss +167 -0
  124. data/vendor/assets/stylesheets/components/_progress.scss +62 -0
  125. data/vendor/assets/stylesheets/components/_sidebar.scss +74 -0
  126. data/vendor/assets/stylesheets/components/_spinner.scss +83 -0
  127. data/vendor/assets/stylesheets/components/_switch.scss +150 -0
  128. data/vendor/assets/stylesheets/components/_timepicker.scss +30 -0
  129. data/vendor/assets/stylesheets/components/_tooltip.scss +93 -0
  130. data/vendor/assets/stylesheets/components/_transition.scss +12 -0
  131. data/vendor/assets/stylesheets/components/_typeahead.scss +18 -0
  132. metadata +150 -94
  133. data/app/assets/fonts/gotham/gotham-bold.woff +0 -0
  134. data/app/assets/fonts/gotham/gotham-book.woff +0 -0
  135. data/app/assets/fonts/gotham/gotham-light.woff +0 -0
  136. data/app/assets/fonts/gotham/gotham-medium.woff +0 -0
  137. data/app/assets/fonts/gotham/gotham-rounded-bold.woff +0 -0
  138. data/app/assets/fonts/gotham/gotham-rounded-book.woff +0 -0
  139. data/app/assets/fonts/gotham/gotham-rounded-light.woff +0 -0
  140. data/app/assets/fonts/gotham/gotham-rounded-medium.woff +0 -0
  141. data/app/assets/images/placeholders/archive-large.png +0 -0
  142. data/app/assets/images/placeholders/archive-small.png +0 -0
  143. data/app/assets/images/placeholders/archive.png +0 -0
  144. data/app/assets/images/placeholders/picture-large.png +0 -0
  145. data/app/assets/images/placeholders/picture.png +0 -0
  146. data/vendor/assets/javascripts/_affix.js +0 -153
  147. data/vendor/assets/javascripts/_alert.js +0 -85
  148. data/vendor/assets/javascripts/_animation.js +0 -103
  149. data/vendor/assets/javascripts/_button.js +0 -107
  150. data/vendor/assets/javascripts/_carousel.js +0 -228
  151. data/vendor/assets/javascripts/_chart.js +0 -3742
  152. data/vendor/assets/javascripts/_collapse.js +0 -202
  153. data/vendor/assets/javascripts/_color_picker.js +0 -108
  154. data/vendor/assets/javascripts/_date_picker.js +0 -1650
  155. data/vendor/assets/javascripts/_dropdown.js +0 -156
  156. data/vendor/assets/javascripts/_file_input.js +0 -71
  157. data/vendor/assets/javascripts/_hoverdown.js +0 -109
  158. data/vendor/assets/javascripts/_inputmask.js +0 -341
  159. data/vendor/assets/javascripts/_loader.js +0 -361
  160. data/vendor/assets/javascripts/_map.js +0 -2401
  161. data/vendor/assets/javascripts/_popover.js +0 -99
  162. data/vendor/assets/javascripts/_scrollspy.js +0 -163
  163. data/vendor/assets/javascripts/_slider.js +0 -1572
  164. data/vendor/assets/javascripts/_sort.js +0 -1432
  165. data/vendor/assets/javascripts/_swoggle.js +0 -415
  166. data/vendor/assets/javascripts/_tab.js +0 -146
  167. data/vendor/assets/javascripts/_tablespy.js +0 -1883
  168. data/vendor/assets/javascripts/_time_ago.js +0 -206
  169. data/vendor/assets/javascripts/_time_picker.js +0 -1088
  170. data/vendor/assets/javascripts/_tooltip.js +0 -504
  171. data/vendor/assets/javascripts/_transition.js +0 -50
  172. data/vendor/assets/javascripts/_typeahead.js +0 -366
  173. data/vendor/assets/stylesheets/_ad.scss +0 -63
  174. data/vendor/assets/stylesheets/_affix.scss +0 -14
  175. data/vendor/assets/stylesheets/_alert.scss +0 -114
  176. data/vendor/assets/stylesheets/_animation.scss +0 -1370
  177. data/vendor/assets/stylesheets/_breadcrumb.scss +0 -100
  178. data/vendor/assets/stylesheets/_button.scss +0 -386
  179. data/vendor/assets/stylesheets/_canvas.scss +0 -182
  180. data/vendor/assets/stylesheets/_carousel.scss +0 -158
  181. data/vendor/assets/stylesheets/_chart.scss +0 -15
  182. data/vendor/assets/stylesheets/_code.scss +0 -150
  183. data/vendor/assets/stylesheets/_collapse.scss +0 -14
  184. data/vendor/assets/stylesheets/_color.scss +0 -55
  185. data/vendor/assets/stylesheets/_colorpicker.scss +0 -63
  186. data/vendor/assets/stylesheets/_datepicker.scss +0 -122
  187. data/vendor/assets/stylesheets/_dropdown.scss +0 -248
  188. data/vendor/assets/stylesheets/_footer.scss +0 -71
  189. data/vendor/assets/stylesheets/_form.scss +0 -661
  190. data/vendor/assets/stylesheets/_grid.scss +0 -184
  191. data/vendor/assets/stylesheets/_header.scss +0 -156
  192. data/vendor/assets/stylesheets/_icon.scss +0 -362
  193. data/vendor/assets/stylesheets/_image.scss +0 -33
  194. data/vendor/assets/stylesheets/_label_and_badge.scss +0 -104
  195. data/vendor/assets/stylesheets/_link.scss +0 -55
  196. data/vendor/assets/stylesheets/_list.scss +0 -122
  197. data/vendor/assets/stylesheets/_loader.scss +0 -71
  198. data/vendor/assets/stylesheets/_map.scss +0 -44
  199. data/vendor/assets/stylesheets/_missive.scss +0 -74
  200. data/vendor/assets/stylesheets/_modal.scss +0 -204
  201. data/vendor/assets/stylesheets/_nav_and_tab.scss +0 -230
  202. data/vendor/assets/stylesheets/_navbar.scss +0 -73
  203. data/vendor/assets/stylesheets/_pagination.scss +0 -79
  204. data/vendor/assets/stylesheets/_panel.scss +0 -80
  205. data/vendor/assets/stylesheets/_placeholder.scss +0 -63
  206. data/vendor/assets/stylesheets/_popover.scss +0 -128
  207. data/vendor/assets/stylesheets/_progress.scss +0 -86
  208. data/vendor/assets/stylesheets/_reset.scss +0 -140
  209. data/vendor/assets/stylesheets/_sidebar.scss +0 -148
  210. data/vendor/assets/stylesheets/_slider.scss +0 -151
  211. data/vendor/assets/stylesheets/_spinner.scss +0 -572
  212. data/vendor/assets/stylesheets/_subheader.scss +0 -112
  213. data/vendor/assets/stylesheets/_swoggle.scss +0 -120
  214. data/vendor/assets/stylesheets/_table.scss +0 -210
  215. data/vendor/assets/stylesheets/_timepicker.scss +0 -77
  216. data/vendor/assets/stylesheets/_toolbar.scss +0 -130
  217. data/vendor/assets/stylesheets/_tooltip.scss +0 -105
  218. data/vendor/assets/stylesheets/_transition.scss +0 -11
  219. data/vendor/assets/stylesheets/_trunk.scss +0 -147
  220. data/vendor/assets/stylesheets/_typeahead.scss +0 -18
  221. data/vendor/assets/stylesheets/_typography.scss +0 -233
@@ -1,71 +0,0 @@
1
- /* Table of Contents
2
- ==================================================
3
- # Footer
4
- # Styles
5
- # Colors
6
- # Media Queries */
7
-
8
- /* # Footer
9
- ================================================== */
10
- .footer {
11
- background: $color-white;
12
- border-top: 1px solid $color-haze;
13
- box-sizing: border-box;
14
- color: $color-black;
15
- display: block;
16
- height: 30px;
17
- padding-top: 3px;
18
- min-width: 100%;
19
- width: 100%;
20
- }
21
- .footer-nav {
22
- list-style: none;
23
- margin: 0;
24
- padding: 0;
25
- }
26
- .footer-nav > li {
27
- float: left;
28
- font-size: 10px;
29
- font-weight: bold;
30
- margin: 0 5px;
31
- }
32
- .footer-nav > li:first-child { margin-left: 0; }
33
- .footer-nav > li:last-child { margin-right: 0; }
34
- .footer-nav > li > a:hover,
35
- .footer-nav > li > a.active,
36
- .footer-nav > li > a:active,
37
- .footer-nav > li > a:focus { color: $color-primary; }
38
-
39
- /* # Styles
40
- ================================================== */
41
- .footer-fixed {
42
- bottom: 0;
43
- position: fixed;
44
- min-width: inherit;
45
- width: inherit;
46
- z-index: 1030;
47
- }
48
-
49
- /* # Colors
50
- ================================================== */
51
- .footer-dark {
52
- background: $color-black;
53
- border-color: $color-dark-black;
54
- color: $color-white;
55
- }
56
- .footer-light {
57
- background: lighten($color-light-haze, 2%);
58
- border-color: $color-dark-haze;
59
- }
60
-
61
- /* # Media Queries
62
- ================================================== */
63
- @media
64
- only screen and (-webkit-min-device-pixel-ratio: 2),
65
- only screen and ( min--moz-device-pixel-ratio: 2),
66
- only screen and ( -o-min-device-pixel-ratio: 2/1),
67
- only screen and ( min-device-pixel-ratio: 2),
68
- only screen and ( min-resolution: 192dpi),
69
- only screen and ( min-resolution: 2dppx) {
70
- .footer { border-width: 0.5px; }
71
- }
@@ -1,661 +0,0 @@
1
- /* Table of Contents
2
- ==================================================
3
- # Form
4
- # Components
5
- # Styles
6
- # Sizes
7
- # Colors
8
- # Media Queries */
9
-
10
- /* # Form
11
- ================================================== */
12
- form { color: $color-black; }
13
- fieldset,
14
- legend { border: 0; }
15
- legend {
16
- border-bottom: 1px solid $color-haze;
17
- display: block;
18
- font-size: 16px;
19
- font-weight: bold;
20
- letter-spacing: 1px;
21
- line-height: 25px;
22
- margin-bottom: 20px;
23
- text-transform: uppercase;
24
- width: 100%;
25
- }
26
- label {
27
- display: block;
28
- font-size: 13px;
29
- font-weight: bold;
30
- line-height: 1;
31
- margin: 5px 0;
32
- }
33
- select,
34
- textarea,
35
- input[type="text"],
36
- input[type="password"],
37
- input[type="datetime"],
38
- input[type="datetime-local"],
39
- input[type="date"],
40
- input[type="month"],
41
- input[type="time"],
42
- input[type="week"],
43
- input[type="number"],
44
- input[type="email"],
45
- input[type="url"],
46
- input[type="search"],
47
- input[type="tel"],
48
- input[type="color"] {
49
- @include appearance(none);
50
- background: $color-white;
51
- border: 2px solid $color-light-haze;
52
- border-radius: 2px;
53
- box-sizing: border-box;
54
- color: inherit;
55
- display: block;
56
- -webkit-font-smoothing: antialiased;
57
- -moz-osx-font-smoothing: grayscale;
58
- font-size: 16px;
59
- font-style: normal;
60
- font-weight: normal;
61
- line-height: 1;
62
- margin-bottom: 5px;
63
- outline: 0;
64
- padding: 11px 0 10px 10px;
65
- text-indent: 0;
66
- @include transition(all 0.3s ease-in-out);
67
- width: 100%;
68
- vertical-align: middle;
69
- }
70
- button,
71
- input[type="file"],
72
- input[type="image"],
73
- input[type="submit"],
74
- input[type="reset"],
75
- input[type="button"],
76
- input[type="radio"],
77
- input[type="checkbox"] {
78
- line-height: 1;
79
- outline: 0;
80
- width: auto;
81
- }
82
- input[type="radio"],
83
- input[type="checkbox"] { margin: 5px 0 0; }
84
- select {
85
- padding-bottom: 12px;
86
- padding-top: 12px;
87
- }
88
- select[multiple],
89
- select[size] { height: auto; }
90
- textarea {
91
- height: 142px;
92
- line-height: 22px;
93
- margin-top: 2px;
94
- padding-right: 10px;
95
- }
96
- input:focus,
97
- textarea:focus,
98
- select:focus,
99
- input:focus:valid,
100
- textarea:focus:valid,
101
- select:focus:valid,
102
- input:focus:valid:focus,
103
- textarea:focus:valid:focus,
104
- select:focus:valid:focus { border-color: $color-green !important; }
105
- input:focus:invalid,
106
- textarea:focus:invalid,
107
- select:focus:invalid {
108
- border-color: $color-red !important;
109
- color: $color-red !important;
110
- }
111
- input:focus:invalid:focus,
112
- textarea:focus:invalid:focus,
113
- select:focus:invalid:focus { border-color: $color-red !important; }
114
- input[disabled],
115
- textarea[disabled],
116
- select[disabled] {
117
- background: lighten($color-light-haze, 2%);
118
- color: $color-light-gray;
119
- cursor: not-allowed;
120
- }
121
- ::-webkit-input-placeholder {
122
- color: $color-light-gray;
123
- line-height: 18px;
124
- }
125
- :-moz-placeholder {
126
- color: $color-light-gray;
127
- line-height: 18px;
128
- }
129
- ::-moz-placeholder {
130
- color: $color-light-gray;
131
- line-height: 18px;
132
- }
133
- :-ms-input-placeholder {
134
- color: $color-light-gray;
135
- line-height: 18px;
136
- }
137
-
138
- /* # Components
139
- ================================================== */
140
- .form-header {
141
- border-bottom: 1px solid $color-haze;
142
- margin-bottom: 30px;
143
- padding-bottom: 8px;
144
- }
145
- .form-header > h1,
146
- .form-header > h2,
147
- .form-header > h3,
148
- .form-header > h4,
149
- .form-header > h5,
150
- .form-header > h6 {
151
- line-height: 1;
152
- margin: 0;
153
- padding: 0;
154
- }
155
- .form-error-messages {
156
- background: $color-white;
157
- border-color: $color-haze;
158
- margin-bottom: 40px;
159
- }
160
- .form-error-messages > h1,
161
- .form-error-messages > h2,
162
- .form-error-messages > h3,
163
- .form-error-messages > h4,
164
- .form-error-messages > h5,
165
- .form-error-messages > h6 {
166
- background: lighten($color-light-haze, 2%);
167
- border: 1px solid;
168
- border-color: inherit !important;
169
- border-top-left-radius: 2px;
170
- border-top-right-radius: 2px;
171
- line-height: 1;
172
- margin: 0;
173
- padding: 12px 10px 10px 10px;
174
- }
175
- .form-error-messages > ul {
176
- border: 1px solid;
177
- border-color: inherit !important;
178
- border-top: 0;
179
- border-bottom-left-radius: 2px;
180
- border-bottom-right-radius: 2px;
181
- padding: 10px 0;
182
- }
183
- .form-error-messages > ul > li {
184
- display: block;
185
- padding: 0 10px;
186
- }
187
- .form-input-initial,
188
- .form-textarea-initial,
189
- .form-select-initial {
190
- display: inline-block;
191
- width: initial;
192
- }
193
- .form-textarea-small { height: 93px; }
194
- .form-textarea-large { height: 191px; }
195
- .form-input-group,
196
- .form-file-group {
197
- border-collapse: separate;
198
- border-spacing: 0;
199
- display: table;
200
- margin: 2px 0 5px 0;
201
- padding: 0;
202
- position: relative;
203
- width: 100%;
204
- }
205
- .form-input-group-addon,
206
- .form-input-group-input,
207
- .form-file-group-addon,
208
- .form-file-group-input,
209
- .form-file-group-text { display: table-cell; }
210
- .form-input-group-input,
211
- .form-file-group-input,
212
- .form-file-group-text {
213
- border-bottom-left-radius: 0 !important;
214
- border-top-left-radius: 0 !important;
215
- margin: 0 !important;
216
- }
217
- .form-file-group-input {
218
- height: 0 !important;
219
- padding: 0 !important;
220
- position: fixed;
221
- visibility: hidden;
222
- width: 0 !important;
223
- }
224
- .form-file-group-addon,
225
- .form-input-group-addon {
226
- border-bottom-left-radius: 2px;
227
- border-top-left-radius: 2px;
228
- box-sizing: border-box;
229
- font-size: 16px;
230
- font-style: normal;
231
- font-weight: normal;
232
- line-height: 1;
233
- padding: 0;
234
- text-align: center;
235
- white-space: nowrap;
236
- width: 1%;
237
- vertical-align: middle;
238
- }
239
- .form-input-group-addon,
240
- .form-file-group-button {
241
- background: $color-white;
242
- border: 2px solid $color-light-haze;
243
- border-right: 0;
244
- }
245
- .form-input-group-addon { padding: 0 13px; }
246
- .form-input-group-addon > label { margin-top: 7px !important; }
247
- .form-input-group-addon > i { font-size: 20px; }
248
- .form-file-group-button {
249
- border-bottom-right-radius: 0;
250
- border-top-right-radius: 0;
251
- margin: 0 -0.5px 0 0;
252
- padding: 12px 20px;
253
- }
254
- .form-file-group-button:hover,
255
- .form-file-group-button.active,
256
- .form-file-group-button:active,
257
- .form-file-group-button:focus { background: lighten($color-light-haze, 2%); }
258
- .form-input-group-addon > input[type="radio"],
259
- .form-input-group-addon > input[type="checkbox"] { margin: 0; }
260
- .form-floating-label {
261
- position: relative;
262
- vertical-align: top;
263
- }
264
- .form-floating-label label {
265
- font-size: 10px;
266
- font-style: normal;
267
- font-weight: 500;
268
- left: 12px;
269
- opacity: 0;
270
- position: absolute;
271
- @include transition(all 0.3s ease-in-out);
272
- top: 10px;
273
- }
274
- .form-floating-label input:focus,
275
- .form-floating-label input:focus:invalid,
276
- .form-floating-label textarea:focus,
277
- .form-floating-label textarea:focus:invalid,
278
- .form-floating-label select:focus,
279
- .form-floating-label select:focus:invalid { padding-top: 15px; }
280
- .form-floating-label input:focus,
281
- .form-floating-label input:focus:invalid { padding-bottom: 6px; }
282
- .form-floating-label select:focus,
283
- .form-floating-label select:focus:invalid { padding-bottom: 9px; }
284
- .form-floating-label input:focus + label,
285
- .form-floating-label input:focus:invalid + label,
286
- .form-floating-label textarea:focus + label,
287
- .form-floating-label textarea:focus:invalid + label,
288
- .form-floating-label select:focus + label,
289
- .form-floating-label select:focus:invalid + label, {
290
- opacity: 1;
291
- top: 0;
292
- }
293
- .form-floating-label input:focus + label,
294
- .form-floating-label textarea:focus + label,
295
- .form-floating-label select:focus + label { color: $color-green; }
296
- .form-floating-label input:focus:invalid + label,
297
- .form-floating-label textarea:focus:invalid + label,
298
- .form-floating-label select:focus:invalid + label { color: $color-red; }
299
- .form-help-block {
300
- color: $color-light-gray;
301
- display: block;
302
- font-size: 12px;
303
- font-style: italic;
304
- font-weight: normal;
305
- margin-bottom: 15px;
306
- }
307
- .form-select {
308
- display: block;
309
- position: relative;
310
- vertical-align: middle;
311
- width: 100%;
312
- }
313
- .form-select::before,
314
- .form-select::after {
315
- content: "";
316
- pointer-events: none;
317
- position: absolute;
318
- }
319
- .form-select::after {
320
- content: "\54";
321
- font-family: "dripicons";
322
- font-size: 20px;
323
- font-style: normal;
324
- font-weight: normal;
325
- height: 20px;
326
- line-height: 1;
327
- margin-top: -10px;
328
- right: 16px;
329
- top: 50%;
330
- }
331
- .form-select::before {
332
- background: $color-transparent;
333
- border: 1px solid $color-transparent;
334
- border-left: 0;
335
- border-bottom-right-radius: 2px;
336
- border-top-right-radius: 2px;
337
- bottom: 0;
338
- right: 0;
339
- top: 0;
340
- width: 41px;
341
- }
342
- .form-select > select { text-overflow: ""; }
343
- .form-btn-inline {
344
- margin: 2px 0 5px 0;
345
- padding-bottom: 14px;
346
- padding-top: 14px;
347
- }
348
- .form-checkbox-inline,
349
- .form-option-inline,
350
- .form-radio-inline { margin-top: 17px; }
351
- .form-swoggle-inline { margin-top: 13px; }
352
- .form-option {
353
- display: inline-block;
354
- margin-right: 5px;
355
- }
356
- .form-checkbox,
357
- .form-radio {
358
- background: $color-light-haze;
359
- border-radius: 2px;
360
- display: inline-block;
361
- height: 22px;
362
- position: relative;
363
- width: 22px;
364
- }
365
- .form-checkbox > label,
366
- .form-radio > label {
367
- background: $color-white;
368
- border-radius: 1px;
369
- cursor: pointer;
370
- height: 18px;
371
- left: 2px;
372
- position: absolute;
373
- top: -3px;
374
- width: 18px;
375
- }
376
- .form-checkbox > label:after,
377
- .form-radio > label:after {
378
- content: "";
379
- opacity: 0;
380
- position: absolute;
381
- @include transition(all 0.3s ease-in-out);
382
- }
383
- .form-checkbox > label:after {
384
- background: $color-transparent;
385
- border: 3px solid $color-green;
386
- border-right: 0;
387
- border-top: 0;
388
- height: 4px;
389
- left: 3px;
390
- @include transform(rotate(-45deg));
391
- top: 4px;
392
- width: 10px;
393
- }
394
- .form-radio > label:after {
395
- background: $color-green;
396
- height: 12px;
397
- left: 3px;
398
- top: 3px;
399
- width: 12px;
400
- }
401
- .form-radio,
402
- .form-radio > label,
403
- .form-radio > label:after { border-radius: 500px; }
404
- .form-checkbox > label:hover::after,
405
- .form-radio > label:hover::after { opacity: 0.3; }
406
- .form-checkbox > input[type="checkbox"],
407
- .form-radio > input[type="radio"] { visibility: hidden; }
408
- .form-checkbox > input[type="checkbox"]:checked + label:after,
409
- .form-radio > input[type="radio"]:checked + label:after { opacity: 1; }
410
- .form-datetime {
411
- display: inline-block;
412
- margin-left: 0;
413
- padding-right: 10px;
414
- width: initial;
415
- }
416
- .form-slider-label {
417
- font-size: 13px;
418
- font-style: normal;
419
- font-weight: bold;
420
- margin: 3px 0;
421
- }
422
- .form-footer {
423
- border-top: 1px solid $color-haze;
424
- font-size: 12px;
425
- line-height: 20px;
426
- list-style: none;
427
- margin: 30px 0 0 0;
428
- padding: 15px 0 0 0;
429
- }
430
-
431
- /* # Styles
432
- ================================================== */
433
- .form-edge,
434
- .form-inline { clear: both; }
435
- .form-inline button,
436
- .form-inline input,
437
- .form-inline select,
438
- .form-inline textarea,
439
- .form-inline .form-select,
440
- .form-inline .form-input-group,
441
- .form-inline .form-file-group { margin: 0 0 5px 0; }
442
- .form-edge button,
443
- .form-edge input,
444
- .form-edge select,
445
- .form-edge textarea,
446
- .form-edge .form-select,
447
- .form-edge .form-input-group,
448
- .form-edge .form-file-group {
449
- float: left;
450
- margin: 0 5px 0 0;
451
- width: 150px;
452
- }
453
- .form-edge button:last-child,
454
- .form-edge input:last-child,
455
- .form-edge select:last-child,
456
- .form-edge textarea:last-child,
457
- .form-edge .form-select:last-child,
458
- .form-edge .form-input-group:last-child,
459
- .form-edge .form-file-group:last-child { margin-right: 0; }
460
- .form-edge .form-select select {
461
- float: none;
462
- margin: 0;
463
- }
464
- .form-inline input[type="checkbox"],
465
- .form-inline input[type="radio"] { margin: 5px 0 0; }
466
- .form-inline .form-input-group-addon > input[type="checkbox"],
467
- .form-inline .form-input-group-addon > input[type="radio"] { margin: 0; }
468
- .form-edge button,
469
- .form-edge input[type="submit"],
470
- .form-edge input[type="reset"],
471
- .form-edge input[type="button"],
472
- .form-inline button,
473
- .form-inline input[type="submit"],
474
- .form-inline input[type="reset"],
475
- .form-inline input[type="button"] {
476
- font-size: 16px;
477
- padding-bottom: 12px;
478
- padding-top: 12px;
479
- width: initial;
480
- }
481
- .form-edge-link,
482
- .form-edge-icon {
483
- float: left;
484
- font-size: 16px;
485
- line-height: 1;
486
- margin: 14px 5px 0 0;
487
- }
488
- .form-edge-icon {
489
- font-size: 20px;
490
- margin-top: 11px;
491
- }
492
- .form-edge-input-large { width: 200px !important; }
493
- .form-edge-input-medium { width: 125px !important; }
494
- .form-edge-input-small { width: 100px !important; }
495
- .form-edge-input-mini { width: 75px !important; }
496
-
497
- /* # Sizes
498
- ================================================== */
499
- .form-condensed ::-webkit-input-placeholder { line-height: 13px; }
500
- .form-condensed :-moz-placeholder { line-height: 13px; }
501
- .form-condensed ::-moz-placeholder { line-height: 13px; }
502
- .form-condensed :-ms-input-placeholder { line-height: 13px; }
503
- .form-condensed .form-input-group-addon,
504
- .form-condensed .form-file-group-addon {
505
- font-size: 12px;
506
- padding-left: 10px;
507
- padding-right: 10px;
508
- }
509
- .form-condensed .form-input-group-addon i,
510
- .form-condensed .form-file-group-addon i { font-size: 15px; }
511
- .form-condensed input,
512
- .form-condensed textarea {
513
- font-size: 12px;
514
- padding-bottom: 7px;
515
- padding-top: 7px;
516
- }
517
- .form-condensed select {
518
- font-size: 12px;
519
- padding-bottom: 8px;
520
- padding-top: 8px;
521
- }
522
- .form-condensed button,
523
- .form-condensed input[type="submit"],
524
- .form-condensed input[type="reset"],
525
- .form-condensed input[type="button"] {
526
- font-size: 12px;
527
- line-height: 1;
528
- padding: 8px 15px;
529
- }
530
- .form-condensed > .form-edge-link {
531
- font-size: 12px;
532
- margin-top: 10px;
533
- }
534
- .form-condensed > .form-edge-icon {
535
- font-size: 16px;
536
- margin-top: 7px;
537
- }
538
- .form-condensed .form-select::after {
539
- font-size: 14px;
540
- height: 14px;
541
- margin-top: -7px;
542
- right: 12px;
543
- }
544
- .form-condensed .form-select::before { width: 31px; }
545
- .form-condensed .btn-icon {
546
- font-size: 14px !important;
547
- padding: 8px 0 6px 0 !important;
548
- min-width: 34px !important;
549
- }
550
-
551
- /* # Colors
552
- ================================================== */
553
- .form-dark,
554
- .form-dark .form-input-group-addon,
555
- .form-dark .form-file-group-button { color: $color-white; }
556
- .form-dark legend,
557
- .form-dark select,
558
- .form-dark textarea,
559
- .form-dark input[type="text"],
560
- .form-dark input[type="password"],
561
- .form-dark input[type="datetime"],
562
- .form-dark input[type="datetime-local"],
563
- .form-dark input[type="date"],
564
- .form-dark input[type="month"],
565
- .form-dark input[type="time"],
566
- .form-dark input[type="week"],
567
- .form-dark input[type="number"],
568
- .form-dark input[type="email"],
569
- .form-dark input[type="url"],
570
- .form-dark input[type="search"],
571
- .form-dark input[type="tel"],
572
- .form-dark input[type="color"],
573
- .form-dark .form-header,
574
- .form-dark .form-error-messages,
575
- .form-dark .form-input-group-addon,
576
- .form-dark .form-file-group-button,
577
- .form-dark .form-footer { border-color: $color-dark-black !important; }
578
- .form-dark select,
579
- .form-dark textarea,
580
- .form-dark input[type="text"],
581
- .form-dark input[type="password"],
582
- .form-dark input[type="datetime"],
583
- .form-dark input[type="datetime-local"],
584
- .form-dark input[type="date"],
585
- .form-dark input[type="month"],
586
- .form-dark input[type="time"],
587
- .form-dark input[type="week"],
588
- .form-dark input[type="number"],
589
- .form-dark input[type="email"],
590
- .form-dark input[type="url"],
591
- .form-dark input[type="search"],
592
- .form-dark input[type="tel"],
593
- .form-dark input[type="color"],
594
- .form-dark .form-error-messages > h1,
595
- .form-dark .form-error-messages > h2,
596
- .form-dark .form-error-messages > h3,
597
- .form-dark .form-error-messages > h4,
598
- .form-dark .form-error-messages > h5,
599
- .form-dark .form-error-messages > h6,
600
- .form-dark .form-checkbox > label,
601
- .form-dark .form-radio > label { background: $color-light-black; }
602
- .form-dark input[disabled],
603
- .form-dark textarea[disabled],
604
- .form-dark select[disabled],
605
- .form-dark .form-error-messages,
606
- .form-dark .form-input-group-addon,
607
- .form-dark .form-file-group-button { background: $color-black; }
608
- .form-dark .form-checkbox,
609
- .form-dark .form-radio { background: $color-dark-black; }
610
- .form-light legend,
611
- .form-light select,
612
- .form-light textarea,
613
- .form-light input[type="text"],
614
- .form-light input[type="password"],
615
- .form-light input[type="datetime"],
616
- .form-light input[type="datetime-local"],
617
- .form-light input[type="date"],
618
- .form-light input[type="month"],
619
- .form-light input[type="time"],
620
- .form-light input[type="week"],
621
- .form-light input[type="number"],
622
- .form-light input[type="email"],
623
- .form-light input[type="url"],
624
- .form-light input[type="search"],
625
- .form-light input[type="tel"],
626
- .form-light input[type="color"],
627
- .form-light .form-header,
628
- .form-light .form-error-messages,
629
- .form-light .form-input-group-addon,
630
- .form-light .form-file-group-button,
631
- .form-light .form-footer { border-color: $color-dark-haze !important; }
632
- .form-light input[disabled],
633
- .form-light textarea[disabled],
634
- .form-light select[disabled],
635
- .form-light .form-input-group-addon,
636
- .form-light .form-file-group-button { background: $color-haze; }
637
- .form-light .form-error-messages { background: $color-white; }
638
- .form-light .form-checkbox,
639
- .form-light .form-radio { background: $color-dark-haze; }
640
-
641
- /* # Media Queries
642
- ================================================== */
643
- @media
644
- only screen and (-webkit-min-device-pixel-ratio: 2),
645
- only screen and ( min--moz-device-pixel-ratio: 2),
646
- only screen and ( -o-min-device-pixel-ratio: 2/1),
647
- only screen and ( min-device-pixel-ratio: 2),
648
- only screen and ( min-resolution: 192dpi),
649
- only screen and ( min-resolution: 2dppx) {
650
- legend,
651
- .form-header,
652
- .form-error-messages > h1,
653
- .form-error-messages > h2,
654
- .form-error-messages > h3,
655
- .form-error-messages > h4,
656
- .form-error-messages > h5,
657
- .form-error-messages > h6,
658
- .form-error-messages > ul,
659
- .form-footer { border-width: 0.5px; }
660
- legend { letter-spacing: 0.5px; }
661
- }