formstrap 0.1.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (180) hide show
  1. checksums.yaml +7 -0
  2. data/.DS_Store +0 -0
  3. data/.gitignore +33 -0
  4. data/CHANGELOG.md +1 -0
  5. data/CODE_OF_CONDUCT.md +84 -0
  6. data/Gemfile +28 -0
  7. data/LICENSE.txt +21 -0
  8. data/README.md +118 -0
  9. data/Rakefile +10 -0
  10. data/app/assets/config/headmin_manifest.js +2 -0
  11. data/app/assets/images/avatar.jpg +0 -0
  12. data/app/assets/images/document.docx +0 -0
  13. data/app/assets/images/document.pdf +0 -0
  14. data/app/assets/images/image.jpg +0 -0
  15. data/app/assets/images/spreadsheet.xls +0 -0
  16. data/app/assets/images/video.mp4 +0 -0
  17. data/app/assets/javascripts/formstrap/config/i18n.js +11 -0
  18. data/app/assets/javascripts/formstrap/controllers/autocomplete_controller.js +318 -0
  19. data/app/assets/javascripts/formstrap/controllers/date_range_controller.js +38 -0
  20. data/app/assets/javascripts/formstrap/controllers/dropzone_controller.js +31 -0
  21. data/app/assets/javascripts/formstrap/controllers/file_preview_controller.js +244 -0
  22. data/app/assets/javascripts/formstrap/controllers/flatpickr_controller.js +35 -0
  23. data/app/assets/javascripts/formstrap/controllers/infinite_scroller_controller.js +28 -0
  24. data/app/assets/javascripts/formstrap/controllers/media_controller.js +252 -0
  25. data/app/assets/javascripts/formstrap/controllers/media_modal_controller.js +147 -0
  26. data/app/assets/javascripts/formstrap/controllers/redactorx_controller.js +40 -0
  27. data/app/assets/javascripts/formstrap/controllers/repeater_controller.js +148 -0
  28. data/app/assets/javascripts/formstrap/controllers/select_controller.js +49 -0
  29. data/app/assets/javascripts/formstrap/controllers/textarea_controller.js +48 -0
  30. data/app/assets/javascripts/formstrap/index.js +32 -0
  31. data/app/assets/javascripts/formstrap.js +11515 -0
  32. data/app/assets/stylesheets/formstrap/forms/autocomplete.scss +27 -0
  33. data/app/assets/stylesheets/formstrap/forms/file.scss +83 -0
  34. data/app/assets/stylesheets/formstrap/forms/media.scss +10 -0
  35. data/app/assets/stylesheets/formstrap/forms/repeater.scss +62 -0
  36. data/app/assets/stylesheets/formstrap/forms/search.scss +12 -0
  37. data/app/assets/stylesheets/formstrap/forms.scss +12 -0
  38. data/app/assets/stylesheets/formstrap/general.scss +18 -0
  39. data/app/assets/stylesheets/formstrap/media/index.scss +9 -0
  40. data/app/assets/stylesheets/formstrap/media.scss +1 -0
  41. data/app/assets/stylesheets/formstrap/utilities/buttons.scss +27 -0
  42. data/app/assets/stylesheets/formstrap/utilities/dropzone.scss +72 -0
  43. data/app/assets/stylesheets/formstrap/utilities.scss +2 -0
  44. data/app/assets/stylesheets/formstrap/vendor/flatpickr.css +903 -0
  45. data/app/assets/stylesheets/formstrap/vendor/tom-select-bootstrap.scss +535 -0
  46. data/app/assets/stylesheets/formstrap.css +1559 -0
  47. data/app/assets/stylesheets/formstrap.scss +11 -0
  48. data/app/controllers/concerns/formstrap/pagination.rb +27 -0
  49. data/app/controllers/formstrap/media_controller.rb +68 -0
  50. data/app/controllers/formstrap_controller.rb +2 -0
  51. data/app/models/concerns/formstrap/autocompletable.rb +36 -0
  52. data/app/models/concerns/formstrap/hintable.rb +22 -0
  53. data/app/models/concerns/formstrap/input_groupable.rb +21 -0
  54. data/app/models/concerns/formstrap/labelable.rb +31 -0
  55. data/app/models/concerns/formstrap/listable.rb +26 -0
  56. data/app/models/concerns/formstrap/placeholderable.rb +11 -0
  57. data/app/models/concerns/formstrap/validatable.rb +38 -0
  58. data/app/models/concerns/formstrap/wrappable.rb +19 -0
  59. data/app/models/formstrap/.DS_Store +0 -0
  60. data/app/models/formstrap/association_view.rb +100 -0
  61. data/app/models/formstrap/blocks_view.rb +43 -0
  62. data/app/models/formstrap/checkbox_view.rb +50 -0
  63. data/app/models/formstrap/color_view.rb +45 -0
  64. data/app/models/formstrap/date_range_view.rb +23 -0
  65. data/app/models/formstrap/date_view.rb +43 -0
  66. data/app/models/formstrap/datetime_range_view.rb +23 -0
  67. data/app/models/formstrap/datetime_view.rb +43 -0
  68. data/app/models/formstrap/email_view.rb +46 -0
  69. data/app/models/formstrap/file_view.rb +106 -0
  70. data/app/models/formstrap/flatpickr_range_view.rb +89 -0
  71. data/app/models/formstrap/flatpickr_view.rb +27 -0
  72. data/app/models/formstrap/hidden_view.rb +8 -0
  73. data/app/models/formstrap/hint_view.rb +4 -0
  74. data/app/models/formstrap/input_group_view.rb +17 -0
  75. data/app/models/formstrap/label_view.rb +22 -0
  76. data/app/models/formstrap/media_item_view.rb +41 -0
  77. data/app/models/formstrap/media_view.rb +143 -0
  78. data/app/models/formstrap/number_view.rb +47 -0
  79. data/app/models/formstrap/password_view.rb +42 -0
  80. data/app/models/formstrap/redactorx_view.rb +57 -0
  81. data/app/models/formstrap/search_view.rb +46 -0
  82. data/app/models/formstrap/select_view.rb +61 -0
  83. data/app/models/formstrap/switch_view.rb +21 -0
  84. data/app/models/formstrap/text_view.rb +46 -0
  85. data/app/models/formstrap/textarea_view.rb +47 -0
  86. data/app/models/formstrap/url_view.rb +46 -0
  87. data/app/models/formstrap/wrapper_view.rb +17 -0
  88. data/app/models/formstrap/wysiwyg_view.rb +15 -0
  89. data/app/models/view_model.rb +62 -0
  90. data/app/views/formstrap/_association.html.erb +30 -0
  91. data/app/views/formstrap/_autocomplete.html.erb +11 -0
  92. data/app/views/formstrap/_blocks.html.erb +45 -0
  93. data/app/views/formstrap/_checkbox.html.erb +34 -0
  94. data/app/views/formstrap/_color.html.erb +32 -0
  95. data/app/views/formstrap/_datalist.html.erb +3 -0
  96. data/app/views/formstrap/_date.html.erb +41 -0
  97. data/app/views/formstrap/_date_range.html.erb +40 -0
  98. data/app/views/formstrap/_datetime.html.erb +41 -0
  99. data/app/views/formstrap/_datetime_range.html.erb +40 -0
  100. data/app/views/formstrap/_email.html.erb +43 -0
  101. data/app/views/formstrap/_errors.html.erb +19 -0
  102. data/app/views/formstrap/_file.html.erb +94 -0
  103. data/app/views/formstrap/_flatpickr.html.erb +33 -0
  104. data/app/views/formstrap/_flatpickr_range.html.erb +40 -0
  105. data/app/views/formstrap/_hidden.html.erb +23 -0
  106. data/app/views/formstrap/_hint.html.erb +21 -0
  107. data/app/views/formstrap/_input_group.html.erb +21 -0
  108. data/app/views/formstrap/_label.html.erb +22 -0
  109. data/app/views/formstrap/_media.html.erb +60 -0
  110. data/app/views/formstrap/_number.html.erb +41 -0
  111. data/app/views/formstrap/_password.html.erb +39 -0
  112. data/app/views/formstrap/_redactorx.html.erb +31 -0
  113. data/app/views/formstrap/_repeater.html.erb +128 -0
  114. data/app/views/formstrap/_search.html.erb +43 -0
  115. data/app/views/formstrap/_select.html.erb +43 -0
  116. data/app/views/formstrap/_switch.html.erb +29 -0
  117. data/app/views/formstrap/_text.html.erb +42 -0
  118. data/app/views/formstrap/_textarea.html.erb +39 -0
  119. data/app/views/formstrap/_to_ary.html.erb +0 -0
  120. data/app/views/formstrap/_url.html.erb +43 -0
  121. data/app/views/formstrap/_validation.html.erb +18 -0
  122. data/app/views/formstrap/_wrapper.html.erb +8 -0
  123. data/app/views/formstrap/_wysiwyg.html.erb +28 -0
  124. data/app/views/formstrap/autocomplete/_item.html.erb +3 -0
  125. data/app/views/formstrap/autocomplete/_list.html.erb +3 -0
  126. data/app/views/formstrap/blocks/_modal.html.erb +20 -0
  127. data/app/views/formstrap/fields/_base.html.erb +25 -0
  128. data/app/views/formstrap/fields/_file.html.erb +17 -0
  129. data/app/views/formstrap/fields/_files.html.erb +17 -0
  130. data/app/views/formstrap/fields/_group.html.erb +52 -0
  131. data/app/views/formstrap/fields/_list.html.erb +31 -0
  132. data/app/views/formstrap/fields/_text.html.erb +17 -0
  133. data/app/views/formstrap/media/_item.html.erb +38 -0
  134. data/app/views/formstrap/media/_media_item_modal.html.erb +77 -0
  135. data/app/views/formstrap/media/_modal.html.erb +40 -0
  136. data/app/views/formstrap/media/_thumbnail.html.erb +20 -0
  137. data/app/views/formstrap/media/_validation.html.erb +10 -0
  138. data/app/views/formstrap/media/create.turbo_stream.erb +5 -0
  139. data/app/views/formstrap/media/index.html.erb +3 -0
  140. data/app/views/formstrap/media/index.turbo_stream.erb +11 -0
  141. data/app/views/formstrap/media/show.html.erb +9 -0
  142. data/app/views/formstrap/media/thumbnail.html.erb +3 -0
  143. data/app/views/formstrap/media/update.turbo_stream.erb +3 -0
  144. data/app/views/formstrap/pagination/_infinite.html.erb +7 -0
  145. data/app/views/formstrap/repeater/_row.html.erb +53 -0
  146. data/app/views/formstrap/shared/_notifications.html.erb +20 -0
  147. data/app/views/formstrap/shared/_popup.html.erb +32 -0
  148. data/app/views/formstrap/shared/_thumbnail.html.erb +35 -0
  149. data/bin/console +14 -0
  150. data/bin/setup +8 -0
  151. data/config/importmap.rb +2 -0
  152. data/config/locales/activerecord/en.yml +12 -0
  153. data/config/locales/activerecord/nl.yml +13 -0
  154. data/config/locales/defaults/en.yml +215 -0
  155. data/config/locales/defaults/nl.yml +213 -0
  156. data/config/locales/devise/en.yml +65 -0
  157. data/config/locales/devise/nl.yml +85 -0
  158. data/config/locales/en.yml +6 -0
  159. data/config/locales/formstrap/forms/en.yml +39 -0
  160. data/config/locales/formstrap/forms/nl.yml +39 -0
  161. data/config/locales/formstrap/media/en.yml +24 -0
  162. data/config/locales/formstrap/media/nl.yml +24 -0
  163. data/config/locales/formstrap/thumbnail/en.yml +4 -0
  164. data/config/locales/formstrap/thumbnail/nl.yml +4 -0
  165. data/config/locales/nl.yml +6 -0
  166. data/config/routes.rb +11 -0
  167. data/esbuild-css.js +25 -0
  168. data/esbuild-js.js +11 -0
  169. data/formstrap.gemspec +37 -0
  170. data/formstrap.iml +34 -0
  171. data/lib/formstrap/engine.rb +27 -0
  172. data/lib/formstrap/form_builder.rb +177 -0
  173. data/lib/formstrap/form_helper.rb +19 -0
  174. data/lib/formstrap/version.rb +3 -0
  175. data/lib/formstrap.rb +6 -0
  176. data/package.json +54 -0
  177. data/src/js/formstrap.js +1 -0
  178. data/src/scss/formstrap.scss +1 -0
  179. data/yarn.lock +1998 -0
  180. metadata +224 -0
@@ -0,0 +1,903 @@
1
+ .flatpickr-calendar {
2
+ background: transparent;
3
+ opacity: 0;
4
+ display: none;
5
+ text-align: center;
6
+ visibility: hidden;
7
+ padding: 0;
8
+ -webkit-animation: none;
9
+ animation: none;
10
+ direction: ltr;
11
+ border: 0;
12
+ font-size: 14px;
13
+ line-height: 24px;
14
+ border-radius: 5px;
15
+ position: absolute;
16
+ width: 307.875px;
17
+ -webkit-box-sizing: border-box;
18
+ box-sizing: border-box;
19
+ -ms-touch-action: manipulation;
20
+ touch-action: manipulation;
21
+ background: #fff;
22
+ -webkit-box-shadow: 1px 0 0 #e6e6e6, -1px 0 0 #e6e6e6, 0 1px 0 #e6e6e6, 0 -1px 0 #e6e6e6, 0 3px 13px rgba(0, 0, 0, 0.08);
23
+ box-shadow: 1px 0 0 #e6e6e6, -1px 0 0 #e6e6e6, 0 1px 0 #e6e6e6, 0 -1px 0 #e6e6e6, 0 3px 13px rgba(0, 0, 0, 0.08);
24
+ }
25
+
26
+ .flatpickr-calendar.open,
27
+ .flatpickr-calendar.inline {
28
+ opacity: 1;
29
+ max-height: 640px;
30
+ visibility: visible;
31
+ }
32
+
33
+ .flatpickr-calendar.open {
34
+ display: inline-block;
35
+ z-index: 99999;
36
+ }
37
+
38
+ .flatpickr-calendar.animate.open {
39
+ -webkit-animation: fpFadeInDown 300ms cubic-bezier(0.23, 1, 0.32, 1);
40
+ animation: fpFadeInDown 300ms cubic-bezier(0.23, 1, 0.32, 1);
41
+ }
42
+
43
+ .flatpickr-calendar.inline {
44
+ display: block;
45
+ position: relative;
46
+ top: 2px;
47
+ }
48
+
49
+ .flatpickr-calendar.static {
50
+ position: absolute;
51
+ top: calc(100% + 2px);
52
+ }
53
+
54
+ .flatpickr-calendar.static.open {
55
+ z-index: 999;
56
+ display: block;
57
+ }
58
+
59
+ .flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+1) .flatpickr-day.inRange:nth-child(7n+7) {
60
+ -webkit-box-shadow: none !important;
61
+ box-shadow: none !important;
62
+ }
63
+
64
+ .flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+2) .flatpickr-day.inRange:nth-child(7n+1) {
65
+ -webkit-box-shadow: -2px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;
66
+ box-shadow: -2px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;
67
+ }
68
+
69
+ .flatpickr-calendar .hasWeeks .dayContainer,
70
+ .flatpickr-calendar .hasTime .dayContainer {
71
+ border-bottom: 0;
72
+ border-bottom-right-radius: 0;
73
+ border-bottom-left-radius: 0;
74
+ }
75
+
76
+ .flatpickr-calendar .hasWeeks .dayContainer {
77
+ border-left: 0;
78
+ }
79
+
80
+ .flatpickr-calendar.hasTime .flatpickr-time {
81
+ height: 40px;
82
+ border-top: 1px solid #e6e6e6;
83
+ }
84
+
85
+ .flatpickr-calendar.noCalendar.hasTime .flatpickr-time {
86
+ height: auto;
87
+ }
88
+
89
+ .flatpickr-calendar:before,
90
+ .flatpickr-calendar:after {
91
+ position: absolute;
92
+ display: block;
93
+ pointer-events: none;
94
+ border: solid transparent;
95
+ content: '';
96
+ height: 0;
97
+ width: 0;
98
+ left: 22px;
99
+ }
100
+
101
+ .flatpickr-calendar.rightMost:before,
102
+ .flatpickr-calendar.arrowRight:before,
103
+ .flatpickr-calendar.rightMost:after,
104
+ .flatpickr-calendar.arrowRight:after {
105
+ left: auto;
106
+ right: 22px;
107
+ }
108
+
109
+ .flatpickr-calendar.arrowCenter:before,
110
+ .flatpickr-calendar.arrowCenter:after {
111
+ left: 50%;
112
+ right: 50%;
113
+ }
114
+
115
+ .flatpickr-calendar:before {
116
+ border-width: 5px;
117
+ margin: 0 -5px;
118
+ }
119
+
120
+ .flatpickr-calendar:after {
121
+ border-width: 4px;
122
+ margin: 0 -4px;
123
+ }
124
+
125
+ .flatpickr-calendar.arrowTop:before,
126
+ .flatpickr-calendar.arrowTop:after {
127
+ bottom: 100%;
128
+ }
129
+
130
+ .flatpickr-calendar.arrowTop:before {
131
+ border-bottom-color: #e6e6e6;
132
+ }
133
+
134
+ .flatpickr-calendar.arrowTop:after {
135
+ border-bottom-color: #fff;
136
+ }
137
+
138
+ .flatpickr-calendar.arrowBottom:before,
139
+ .flatpickr-calendar.arrowBottom:after {
140
+ top: 100%;
141
+ }
142
+
143
+ .flatpickr-calendar.arrowBottom:before {
144
+ border-top-color: #e6e6e6;
145
+ }
146
+
147
+ .flatpickr-calendar.arrowBottom:after {
148
+ border-top-color: #fff;
149
+ }
150
+
151
+ .flatpickr-calendar:focus {
152
+ outline: 0;
153
+ }
154
+
155
+ .flatpickr-wrapper {
156
+ position: relative;
157
+ display: inline-block;
158
+ }
159
+
160
+ .flatpickr-months {
161
+ display: -webkit-box;
162
+ display: -webkit-flex;
163
+ display: -ms-flexbox;
164
+ display: flex;
165
+ }
166
+
167
+ .flatpickr-months .flatpickr-month {
168
+ background: transparent;
169
+ color: rgba(0, 0, 0, 0.9);
170
+ fill: rgba(0, 0, 0, 0.9);
171
+ height: 34px;
172
+ line-height: 1;
173
+ text-align: center;
174
+ position: relative;
175
+ -webkit-user-select: none;
176
+ -moz-user-select: none;
177
+ -ms-user-select: none;
178
+ user-select: none;
179
+ overflow: hidden;
180
+ -webkit-box-flex: 1;
181
+ -webkit-flex: 1;
182
+ -ms-flex: 1;
183
+ flex: 1;
184
+ }
185
+
186
+ .flatpickr-months .flatpickr-prev-month,
187
+ .flatpickr-months .flatpickr-next-month {
188
+ text-decoration: none;
189
+ cursor: pointer;
190
+ position: absolute;
191
+ top: 0;
192
+ height: 34px;
193
+ padding: 10px;
194
+ z-index: 3;
195
+ color: rgba(0, 0, 0, 0.9);
196
+ fill: rgba(0, 0, 0, 0.9);
197
+ }
198
+
199
+ .flatpickr-months .flatpickr-prev-month.flatpickr-disabled,
200
+ .flatpickr-months .flatpickr-next-month.flatpickr-disabled {
201
+ display: none;
202
+ }
203
+
204
+ .flatpickr-months .flatpickr-prev-month i,
205
+ .flatpickr-months .flatpickr-next-month i {
206
+ position: relative;
207
+ }
208
+
209
+ .flatpickr-months .flatpickr-prev-month.flatpickr-prev-month,
210
+ .flatpickr-months .flatpickr-next-month.flatpickr-prev-month {
211
+ /*
212
+ /*rtl:begin:ignore*/
213
+ /*
214
+ */
215
+ left: 0;
216
+ /*
217
+ /*rtl:end:ignore*/
218
+ /*
219
+ */
220
+ }
221
+
222
+ /*
223
+ /*rtl:begin:ignore*/
224
+ /*
225
+ /*rtl:end:ignore*/
226
+ .flatpickr-months .flatpickr-prev-month.flatpickr-next-month,
227
+ .flatpickr-months .flatpickr-next-month.flatpickr-next-month {
228
+ /*
229
+ /*rtl:begin:ignore*/
230
+ /*
231
+ */
232
+ right: 0;
233
+ /*
234
+ /*rtl:end:ignore*/
235
+ /*
236
+ */
237
+ }
238
+
239
+ /*
240
+ /*rtl:begin:ignore*/
241
+ /*
242
+ /*rtl:end:ignore*/
243
+ .flatpickr-months .flatpickr-prev-month:hover,
244
+ .flatpickr-months .flatpickr-next-month:hover {
245
+ color: #959ea9;
246
+ }
247
+
248
+ .flatpickr-months .flatpickr-prev-month:hover svg,
249
+ .flatpickr-months .flatpickr-next-month:hover svg {
250
+ fill: #f64747;
251
+ }
252
+
253
+ .flatpickr-months .flatpickr-prev-month svg,
254
+ .flatpickr-months .flatpickr-next-month svg {
255
+ width: 14px;
256
+ height: 14px;
257
+ }
258
+
259
+ .flatpickr-months .flatpickr-prev-month svg path,
260
+ .flatpickr-months .flatpickr-next-month svg path {
261
+ -webkit-transition: fill 0.1s;
262
+ transition: fill 0.1s;
263
+ fill: inherit;
264
+ }
265
+
266
+ .numInputWrapper {
267
+ position: relative;
268
+ height: auto;
269
+ }
270
+
271
+ .numInputWrapper input,
272
+ .numInputWrapper span {
273
+ display: inline-block;
274
+ }
275
+
276
+ .numInputWrapper input {
277
+ width: 100%;
278
+ }
279
+
280
+ .numInputWrapper input::-ms-clear {
281
+ display: none;
282
+ }
283
+
284
+ .numInputWrapper input::-webkit-outer-spin-button,
285
+ .numInputWrapper input::-webkit-inner-spin-button {
286
+ margin: 0;
287
+ -webkit-appearance: none;
288
+ }
289
+
290
+ .numInputWrapper span {
291
+ position: absolute;
292
+ right: 0;
293
+ width: 14px;
294
+ padding: 0 4px 0 2px;
295
+ height: 50%;
296
+ line-height: 50%;
297
+ opacity: 0;
298
+ cursor: pointer;
299
+ border: 1px solid rgba(57, 57, 57, 0.15);
300
+ -webkit-box-sizing: border-box;
301
+ box-sizing: border-box;
302
+ }
303
+
304
+ .numInputWrapper span:hover {
305
+ background: rgba(0, 0, 0, 0.1);
306
+ }
307
+
308
+ .numInputWrapper span:active {
309
+ background: rgba(0, 0, 0, 0.2);
310
+ }
311
+
312
+ .numInputWrapper span:after {
313
+ display: block;
314
+ content: "";
315
+ position: absolute;
316
+ }
317
+
318
+ .numInputWrapper span.arrowUp {
319
+ top: 0;
320
+ border-bottom: 0;
321
+ }
322
+
323
+ .numInputWrapper span.arrowUp:after {
324
+ border-left: 4px solid transparent;
325
+ border-right: 4px solid transparent;
326
+ border-bottom: 4px solid rgba(57, 57, 57, 0.6);
327
+ top: 26%;
328
+ }
329
+
330
+ .numInputWrapper span.arrowDown {
331
+ top: 50%;
332
+ }
333
+
334
+ .numInputWrapper span.arrowDown:after {
335
+ border-left: 4px solid transparent;
336
+ border-right: 4px solid transparent;
337
+ border-top: 4px solid rgba(57, 57, 57, 0.6);
338
+ top: 40%;
339
+ }
340
+
341
+ .numInputWrapper span svg {
342
+ width: inherit;
343
+ height: auto;
344
+ }
345
+
346
+ .numInputWrapper span svg path {
347
+ fill: rgba(0, 0, 0, 0.5);
348
+ }
349
+
350
+ .numInputWrapper:hover {
351
+ background: rgba(0, 0, 0, 0.05);
352
+ }
353
+
354
+ .numInputWrapper:hover span {
355
+ opacity: 1;
356
+ }
357
+
358
+ .flatpickr-current-month {
359
+ font-size: 135%;
360
+ line-height: inherit;
361
+ font-weight: 300;
362
+ color: inherit;
363
+ position: absolute;
364
+ width: 75%;
365
+ left: 12.5%;
366
+ padding: 7.48px 0 0 0;
367
+ line-height: 1;
368
+ height: 34px;
369
+ display: inline-block;
370
+ text-align: center;
371
+ -webkit-transform: translate3d(0px, 0px, 0px);
372
+ transform: translate3d(0px, 0px, 0px);
373
+ }
374
+
375
+ .flatpickr-current-month span.cur-month {
376
+ font-family: inherit;
377
+ font-weight: 700;
378
+ color: inherit;
379
+ display: inline-block;
380
+ margin-left: 0.5ch;
381
+ padding: 0;
382
+ }
383
+
384
+ .flatpickr-current-month span.cur-month:hover {
385
+ background: rgba(0, 0, 0, 0.05);
386
+ }
387
+
388
+ .flatpickr-current-month .numInputWrapper {
389
+ width: 6ch;
390
+ width: 7ch \0;
391
+ display: inline-block;
392
+ }
393
+
394
+ .flatpickr-current-month .numInputWrapper span.arrowUp:after {
395
+ border-bottom-color: rgba(0, 0, 0, 0.9);
396
+ }
397
+
398
+ .flatpickr-current-month .numInputWrapper span.arrowDown:after {
399
+ border-top-color: rgba(0, 0, 0, 0.9);
400
+ }
401
+
402
+ .flatpickr-current-month input.cur-year {
403
+ background: transparent;
404
+ -webkit-box-sizing: border-box;
405
+ box-sizing: border-box;
406
+ color: inherit;
407
+ cursor: text;
408
+ padding: 0 0 0 0.5ch;
409
+ margin: 0;
410
+ display: inline-block;
411
+ font-size: inherit;
412
+ font-family: inherit;
413
+ font-weight: 300;
414
+ line-height: inherit;
415
+ height: auto;
416
+ border: 0;
417
+ border-radius: 0;
418
+ vertical-align: initial;
419
+ -webkit-appearance: textfield;
420
+ -moz-appearance: textfield;
421
+ appearance: textfield;
422
+ }
423
+
424
+ .flatpickr-current-month input.cur-year:focus {
425
+ outline: 0;
426
+ }
427
+
428
+ .flatpickr-current-month input.cur-year[disabled],
429
+ .flatpickr-current-month input.cur-year[disabled]:hover {
430
+ font-size: 100%;
431
+ color: rgba(0, 0, 0, 0.5);
432
+ background: transparent;
433
+ pointer-events: none;
434
+ }
435
+
436
+ .flatpickr-current-month .flatpickr-monthDropdown-months {
437
+ appearance: menulist;
438
+ background: transparent;
439
+ border: none;
440
+ border-radius: 0;
441
+ box-sizing: border-box;
442
+ color: inherit;
443
+ cursor: pointer;
444
+ font-size: inherit;
445
+ font-family: inherit;
446
+ font-weight: 300;
447
+ height: auto;
448
+ line-height: inherit;
449
+ margin: -1px 0 0 0;
450
+ outline: none;
451
+ padding: 0 0 0 0.5ch;
452
+ position: relative;
453
+ vertical-align: initial;
454
+ -webkit-box-sizing: border-box;
455
+ -webkit-appearance: menulist;
456
+ -moz-appearance: menulist;
457
+ width: auto;
458
+ }
459
+
460
+ .flatpickr-current-month .flatpickr-monthDropdown-months:focus,
461
+ .flatpickr-current-month .flatpickr-monthDropdown-months:active {
462
+ outline: none;
463
+ }
464
+
465
+ .flatpickr-current-month .flatpickr-monthDropdown-months:hover {
466
+ background: rgba(0, 0, 0, 0.05);
467
+ }
468
+
469
+ .flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month {
470
+ background-color: transparent;
471
+ outline: none;
472
+ padding: 0;
473
+ }
474
+
475
+ .flatpickr-weekdays {
476
+ background: transparent;
477
+ text-align: center;
478
+ overflow: hidden;
479
+ width: 100%;
480
+ display: -webkit-box;
481
+ display: -webkit-flex;
482
+ display: -ms-flexbox;
483
+ display: flex;
484
+ -webkit-box-align: center;
485
+ -webkit-align-items: center;
486
+ -ms-flex-align: center;
487
+ align-items: center;
488
+ height: 28px;
489
+ }
490
+
491
+ .flatpickr-weekdays .flatpickr-weekdaycontainer {
492
+ display: -webkit-box;
493
+ display: -webkit-flex;
494
+ display: -ms-flexbox;
495
+ display: flex;
496
+ -webkit-box-flex: 1;
497
+ -webkit-flex: 1;
498
+ -ms-flex: 1;
499
+ flex: 1;
500
+ }
501
+
502
+ span.flatpickr-weekday {
503
+ cursor: default;
504
+ font-size: 90%;
505
+ background: transparent;
506
+ color: rgba(0, 0, 0, 0.54);
507
+ line-height: 1;
508
+ margin: 0;
509
+ text-align: center;
510
+ display: block;
511
+ -webkit-box-flex: 1;
512
+ -webkit-flex: 1;
513
+ -ms-flex: 1;
514
+ flex: 1;
515
+ font-weight: bolder;
516
+ }
517
+
518
+ .dayContainer,
519
+ .flatpickr-weeks {
520
+ padding: 1px 0 0 0;
521
+ }
522
+
523
+ .flatpickr-days {
524
+ position: relative;
525
+ overflow: hidden;
526
+ display: -webkit-box;
527
+ display: -webkit-flex;
528
+ display: -ms-flexbox;
529
+ display: flex;
530
+ -webkit-box-align: start;
531
+ -webkit-align-items: flex-start;
532
+ -ms-flex-align: start;
533
+ align-items: flex-start;
534
+ width: 307.875px;
535
+ }
536
+
537
+ .flatpickr-days:focus {
538
+ outline: 0;
539
+ }
540
+
541
+ .dayContainer {
542
+ padding: 0;
543
+ outline: 0;
544
+ text-align: left;
545
+ width: 307.875px;
546
+ min-width: 307.875px;
547
+ max-width: 307.875px;
548
+ -webkit-box-sizing: border-box;
549
+ box-sizing: border-box;
550
+ display: inline-block;
551
+ display: -ms-flexbox;
552
+ display: -webkit-box;
553
+ display: -webkit-flex;
554
+ display: flex;
555
+ -webkit-flex-wrap: wrap;
556
+ flex-wrap: wrap;
557
+ -ms-flex-wrap: wrap;
558
+ -ms-flex-pack: justify;
559
+ -webkit-justify-content: space-around;
560
+ justify-content: space-around;
561
+ -webkit-transform: translate3d(0px, 0px, 0px);
562
+ transform: translate3d(0px, 0px, 0px);
563
+ opacity: 1;
564
+ }
565
+
566
+ .dayContainer + .dayContainer {
567
+ -webkit-box-shadow: -1px 0 0 #e6e6e6;
568
+ box-shadow: -1px 0 0 #e6e6e6;
569
+ }
570
+
571
+ .flatpickr-day {
572
+ background: none;
573
+ border: 1px solid transparent;
574
+ border-radius: 150px;
575
+ -webkit-box-sizing: border-box;
576
+ box-sizing: border-box;
577
+ color: #393939;
578
+ cursor: pointer;
579
+ font-weight: 400;
580
+ width: 14.2857143%;
581
+ -webkit-flex-basis: 14.2857143%;
582
+ -ms-flex-preferred-size: 14.2857143%;
583
+ flex-basis: 14.2857143%;
584
+ max-width: 39px;
585
+ height: 39px;
586
+ line-height: 39px;
587
+ margin: 0;
588
+ display: inline-block;
589
+ position: relative;
590
+ -webkit-box-pack: center;
591
+ -webkit-justify-content: center;
592
+ -ms-flex-pack: center;
593
+ justify-content: center;
594
+ text-align: center;
595
+ }
596
+
597
+ .flatpickr-day.inRange,
598
+ .flatpickr-day.prevMonthDay.inRange,
599
+ .flatpickr-day.nextMonthDay.inRange,
600
+ .flatpickr-day.today.inRange,
601
+ .flatpickr-day.prevMonthDay.today.inRange,
602
+ .flatpickr-day.nextMonthDay.today.inRange,
603
+ .flatpickr-day:hover,
604
+ .flatpickr-day.prevMonthDay:hover,
605
+ .flatpickr-day.nextMonthDay:hover,
606
+ .flatpickr-day:focus,
607
+ .flatpickr-day.prevMonthDay:focus,
608
+ .flatpickr-day.nextMonthDay:focus {
609
+ cursor: pointer;
610
+ outline: 0;
611
+ background: #e6e6e6;
612
+ border-color: #e6e6e6;
613
+ }
614
+
615
+ .flatpickr-day.today {
616
+ border-color: #959ea9;
617
+ }
618
+
619
+ .flatpickr-day.today:hover,
620
+ .flatpickr-day.today:focus {
621
+ border-color: #959ea9;
622
+ background: #959ea9;
623
+ color: #fff;
624
+ }
625
+
626
+ .flatpickr-day.selected,
627
+ .flatpickr-day.startRange,
628
+ .flatpickr-day.endRange,
629
+ .flatpickr-day.selected.inRange,
630
+ .flatpickr-day.startRange.inRange,
631
+ .flatpickr-day.endRange.inRange,
632
+ .flatpickr-day.selected:focus,
633
+ .flatpickr-day.startRange:focus,
634
+ .flatpickr-day.endRange:focus,
635
+ .flatpickr-day.selected:hover,
636
+ .flatpickr-day.startRange:hover,
637
+ .flatpickr-day.endRange:hover,
638
+ .flatpickr-day.selected.prevMonthDay,
639
+ .flatpickr-day.startRange.prevMonthDay,
640
+ .flatpickr-day.endRange.prevMonthDay,
641
+ .flatpickr-day.selected.nextMonthDay,
642
+ .flatpickr-day.startRange.nextMonthDay,
643
+ .flatpickr-day.endRange.nextMonthDay {
644
+ background: #569ff7;
645
+ -webkit-box-shadow: none;
646
+ box-shadow: none;
647
+ color: #fff;
648
+ border-color: #569ff7;
649
+ }
650
+
651
+ .flatpickr-day.selected.startRange,
652
+ .flatpickr-day.startRange.startRange,
653
+ .flatpickr-day.endRange.startRange {
654
+ border-radius: 50px 0 0 50px;
655
+ }
656
+
657
+ .flatpickr-day.selected.endRange,
658
+ .flatpickr-day.startRange.endRange,
659
+ .flatpickr-day.endRange.endRange {
660
+ border-radius: 0 50px 50px 0;
661
+ }
662
+
663
+ .flatpickr-day.selected.startRange + .endRange:not(:nth-child(7n+1)),
664
+ .flatpickr-day.startRange.startRange + .endRange:not(:nth-child(7n+1)),
665
+ .flatpickr-day.endRange.startRange + .endRange:not(:nth-child(7n+1)) {
666
+ -webkit-box-shadow: -10px 0 0 #569ff7;
667
+ box-shadow: -10px 0 0 #569ff7;
668
+ }
669
+
670
+ .flatpickr-day.selected.startRange.endRange,
671
+ .flatpickr-day.startRange.startRange.endRange,
672
+ .flatpickr-day.endRange.startRange.endRange {
673
+ border-radius: 50px;
674
+ }
675
+
676
+ .flatpickr-day.inRange {
677
+ border-radius: 0;
678
+ -webkit-box-shadow: -5px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;
679
+ box-shadow: -5px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;
680
+ }
681
+
682
+ .flatpickr-day.flatpickr-disabled,
683
+ .flatpickr-day.flatpickr-disabled:hover,
684
+ .flatpickr-day.prevMonthDay,
685
+ .flatpickr-day.nextMonthDay,
686
+ .flatpickr-day.notAllowed,
687
+ .flatpickr-day.notAllowed.prevMonthDay,
688
+ .flatpickr-day.notAllowed.nextMonthDay {
689
+ color: rgba(57, 57, 57, 0.3);
690
+ background: transparent;
691
+ border-color: transparent;
692
+ cursor: default;
693
+ }
694
+
695
+ .flatpickr-day.flatpickr-disabled,
696
+ .flatpickr-day.flatpickr-disabled:hover {
697
+ cursor: not-allowed;
698
+ color: rgba(57, 57, 57, 0.1);
699
+ }
700
+
701
+ .flatpickr-day.week.selected {
702
+ border-radius: 0;
703
+ -webkit-box-shadow: -5px 0 0 #569ff7, 5px 0 0 #569ff7;
704
+ box-shadow: -5px 0 0 #569ff7, 5px 0 0 #569ff7;
705
+ }
706
+
707
+ .flatpickr-day.hidden {
708
+ visibility: hidden;
709
+ }
710
+
711
+ .rangeMode .flatpickr-day {
712
+ margin-top: 1px;
713
+ }
714
+
715
+ .flatpickr-weekwrapper {
716
+ float: left;
717
+ }
718
+
719
+ .flatpickr-weekwrapper .flatpickr-weeks {
720
+ padding: 0 12px;
721
+ -webkit-box-shadow: 1px 0 0 #e6e6e6;
722
+ box-shadow: 1px 0 0 #e6e6e6;
723
+ }
724
+
725
+ .flatpickr-weekwrapper .flatpickr-weekday {
726
+ float: none;
727
+ width: 100%;
728
+ line-height: 28px;
729
+ }
730
+
731
+ .flatpickr-weekwrapper span.flatpickr-day,
732
+ .flatpickr-weekwrapper span.flatpickr-day:hover {
733
+ display: block;
734
+ width: 100%;
735
+ max-width: none;
736
+ color: rgba(57, 57, 57, 0.3);
737
+ background: transparent;
738
+ cursor: default;
739
+ border: none;
740
+ }
741
+
742
+ .flatpickr-innerContainer {
743
+ display: block;
744
+ display: -webkit-box;
745
+ display: -webkit-flex;
746
+ display: -ms-flexbox;
747
+ display: flex;
748
+ -webkit-box-sizing: border-box;
749
+ box-sizing: border-box;
750
+ overflow: hidden;
751
+ }
752
+
753
+ .flatpickr-rContainer {
754
+ display: inline-block;
755
+ padding: 0;
756
+ -webkit-box-sizing: border-box;
757
+ box-sizing: border-box;
758
+ }
759
+
760
+ .flatpickr-time {
761
+ text-align: center;
762
+ outline: 0;
763
+ display: block;
764
+ height: 0;
765
+ line-height: 40px;
766
+ max-height: 40px;
767
+ -webkit-box-sizing: border-box;
768
+ box-sizing: border-box;
769
+ overflow: hidden;
770
+ display: -webkit-box;
771
+ display: -webkit-flex;
772
+ display: -ms-flexbox;
773
+ display: flex;
774
+ }
775
+
776
+ .flatpickr-time:after {
777
+ content: "";
778
+ display: table;
779
+ clear: both;
780
+ }
781
+
782
+ .flatpickr-time .numInputWrapper {
783
+ -webkit-box-flex: 1;
784
+ -webkit-flex: 1;
785
+ -ms-flex: 1;
786
+ flex: 1;
787
+ width: 40%;
788
+ height: 40px;
789
+ float: left;
790
+ }
791
+
792
+ .flatpickr-time .numInputWrapper span.arrowUp:after {
793
+ border-bottom-color: #393939;
794
+ }
795
+
796
+ .flatpickr-time .numInputWrapper span.arrowDown:after {
797
+ border-top-color: #393939;
798
+ }
799
+
800
+ .flatpickr-time.hasSeconds .numInputWrapper {
801
+ width: 26%;
802
+ }
803
+
804
+ .flatpickr-time.time24hr .numInputWrapper {
805
+ width: 49%;
806
+ }
807
+
808
+ .flatpickr-time input {
809
+ background: transparent;
810
+ -webkit-box-shadow: none;
811
+ box-shadow: none;
812
+ border: 0;
813
+ border-radius: 0;
814
+ text-align: center;
815
+ margin: 0;
816
+ padding: 0;
817
+ height: inherit;
818
+ line-height: inherit;
819
+ color: #393939;
820
+ font-size: 14px;
821
+ position: relative;
822
+ -webkit-box-sizing: border-box;
823
+ box-sizing: border-box;
824
+ -webkit-appearance: textfield;
825
+ -moz-appearance: textfield;
826
+ appearance: textfield;
827
+ }
828
+
829
+ .flatpickr-time input.flatpickr-hour {
830
+ font-weight: bold;
831
+ }
832
+
833
+ .flatpickr-time input.flatpickr-minute,
834
+ .flatpickr-time input.flatpickr-second {
835
+ font-weight: 400;
836
+ }
837
+
838
+ .flatpickr-time input:focus {
839
+ outline: 0;
840
+ border: 0;
841
+ }
842
+
843
+ .flatpickr-time .flatpickr-time-separator,
844
+ .flatpickr-time .flatpickr-am-pm {
845
+ height: inherit;
846
+ float: left;
847
+ line-height: inherit;
848
+ color: #393939;
849
+ font-weight: bold;
850
+ width: 2%;
851
+ -webkit-user-select: none;
852
+ -moz-user-select: none;
853
+ -ms-user-select: none;
854
+ user-select: none;
855
+ -webkit-align-self: center;
856
+ -ms-flex-item-align: center;
857
+ align-self: center;
858
+ }
859
+
860
+ .flatpickr-time .flatpickr-am-pm {
861
+ outline: 0;
862
+ width: 18%;
863
+ cursor: pointer;
864
+ text-align: center;
865
+ font-weight: 400;
866
+ }
867
+
868
+ .flatpickr-time input:hover,
869
+ .flatpickr-time .flatpickr-am-pm:hover,
870
+ .flatpickr-time input:focus,
871
+ .flatpickr-time .flatpickr-am-pm:focus {
872
+ background: #eee;
873
+ }
874
+
875
+ .flatpickr-input[readonly] {
876
+ cursor: pointer;
877
+ }
878
+
879
+ @-webkit-keyframes fpFadeInDown {
880
+ from {
881
+ opacity: 0;
882
+ -webkit-transform: translate3d(0, -20px, 0);
883
+ transform: translate3d(0, -20px, 0);
884
+ }
885
+ to {
886
+ opacity: 1;
887
+ -webkit-transform: translate3d(0, 0, 0);
888
+ transform: translate3d(0, 0, 0);
889
+ }
890
+ }
891
+
892
+ @keyframes fpFadeInDown {
893
+ from {
894
+ opacity: 0;
895
+ -webkit-transform: translate3d(0, -20px, 0);
896
+ transform: translate3d(0, -20px, 0);
897
+ }
898
+ to {
899
+ opacity: 1;
900
+ -webkit-transform: translate3d(0, 0, 0);
901
+ transform: translate3d(0, 0, 0);
902
+ }
903
+ }