pickadate-rails 1.0.0

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 (49) hide show
  1. checksums.yaml +7 -0
  2. data/.gitignore +17 -0
  3. data/Gemfile +4 -0
  4. data/LICENSE.txt +22 -0
  5. data/README.md +61 -0
  6. data/Rakefile +26 -0
  7. data/lib/pickadate-rails.rb +7 -0
  8. data/lib/pickadate-rails/version.rb +3 -0
  9. data/pickadate-rails.gemspec +25 -0
  10. data/vendor/assets/javascripts/pickadate/picker.date.js +925 -0
  11. data/vendor/assets/javascripts/pickadate/picker.js +785 -0
  12. data/vendor/assets/javascripts/pickadate/picker.time.js +651 -0
  13. data/vendor/assets/javascripts/pickadate/translations/bg_BG.js +13 -0
  14. data/vendor/assets/javascripts/pickadate/translations/bs_BA.js +13 -0
  15. data/vendor/assets/javascripts/pickadate/translations/ca_ES.js +13 -0
  16. data/vendor/assets/javascripts/pickadate/translations/cs_CZ.js +13 -0
  17. data/vendor/assets/javascripts/pickadate/translations/da_DK.js +13 -0
  18. data/vendor/assets/javascripts/pickadate/translations/de_DE.js +13 -0
  19. data/vendor/assets/javascripts/pickadate/translations/el_GR.js +13 -0
  20. data/vendor/assets/javascripts/pickadate/translations/es_ES.js +13 -0
  21. data/vendor/assets/javascripts/pickadate/translations/et_EE.js +13 -0
  22. data/vendor/assets/javascripts/pickadate/translations/eu_ES.js +13 -0
  23. data/vendor/assets/javascripts/pickadate/translations/fi_FI.js +13 -0
  24. data/vendor/assets/javascripts/pickadate/translations/fr_FR.js +13 -0
  25. data/vendor/assets/javascripts/pickadate/translations/he_IL.js +12 -0
  26. data/vendor/assets/javascripts/pickadate/translations/hr_HR.js +13 -0
  27. data/vendor/assets/javascripts/pickadate/translations/hu_HU.js +13 -0
  28. data/vendor/assets/javascripts/pickadate/translations/id_ID.js +13 -0
  29. data/vendor/assets/javascripts/pickadate/translations/it_IT.js +13 -0
  30. data/vendor/assets/javascripts/pickadate/translations/nl_NL.js +13 -0
  31. data/vendor/assets/javascripts/pickadate/translations/no_NO.js +13 -0
  32. data/vendor/assets/javascripts/pickadate/translations/pl_PL.js +13 -0
  33. data/vendor/assets/javascripts/pickadate/translations/pt_BR.js +12 -0
  34. data/vendor/assets/javascripts/pickadate/translations/pt_PT.js +12 -0
  35. data/vendor/assets/javascripts/pickadate/translations/ro_RO.js +13 -0
  36. data/vendor/assets/javascripts/pickadate/translations/ru_RU.js +13 -0
  37. data/vendor/assets/javascripts/pickadate/translations/sk_SK.js +13 -0
  38. data/vendor/assets/javascripts/pickadate/translations/sv_SE.js +13 -0
  39. data/vendor/assets/javascripts/pickadate/translations/th_TH.js +12 -0
  40. data/vendor/assets/javascripts/pickadate/translations/tr_TR.js +13 -0
  41. data/vendor/assets/javascripts/pickadate/translations/uk_UA.js +13 -0
  42. data/vendor/assets/javascripts/pickadate/translations/zh_CN.js +13 -0
  43. data/vendor/assets/stylesheets/pickadate/classic.css +159 -0
  44. data/vendor/assets/stylesheets/pickadate/classic.date.css +332 -0
  45. data/vendor/assets/stylesheets/pickadate/classic.time.css +198 -0
  46. data/vendor/assets/stylesheets/pickadate/default.css +234 -0
  47. data/vendor/assets/stylesheets/pickadate/default.date.css +332 -0
  48. data/vendor/assets/stylesheets/pickadate/default.time.css +193 -0
  49. metadata +134 -0
@@ -0,0 +1,198 @@
1
+ /* ==========================================================================
2
+ $BASE-TIME-PICKER
3
+ ========================================================================== */
4
+ /* ==========================================================================
5
+ $VARIABLES
6
+ ========================================================================== */
7
+ /**
8
+ * Base colors
9
+ */
10
+ /**
11
+ * Backgrounds
12
+ */
13
+ /**
14
+ * Borders
15
+ */
16
+ /**
17
+ * Buttons
18
+ */
19
+ /**
20
+ * Picker base
21
+ */
22
+ /**
23
+ * Date picker options
24
+ */
25
+ /**
26
+ * Theme configurations
27
+ */
28
+ /* ==========================================================================
29
+ $MIXINS
30
+ ========================================================================== */
31
+ /**
32
+ * Common picker item states
33
+ */
34
+ /**
35
+ * Opacity
36
+ */
37
+ /**
38
+ * Vendor prefixes
39
+ */
40
+ /**
41
+ * The list of times.
42
+ */
43
+ .picker__list {
44
+ list-style: none;
45
+ padding: 0.75em 0 4.2em;
46
+ margin: 0;
47
+ }
48
+ /**
49
+ * The times on the clock.
50
+ */
51
+ .picker__list-item {
52
+ border-bottom: 1px solid #dddddd;
53
+ border-top: 1px solid #dddddd;
54
+ margin-bottom: -1px;
55
+ position: relative;
56
+ background: #ffffff;
57
+ padding: .75em 1.25em;
58
+ }
59
+ @media (min-height: 46.75em) {
60
+ .picker__list-item {
61
+ padding: .5em 1em;
62
+ }
63
+ }
64
+ /* Hovered time */
65
+ .picker__list-item:hover {
66
+ cursor: pointer;
67
+ color: #000000;
68
+ background: #b1dcfb;
69
+ border-color: #0089ec;
70
+ z-index: 10;
71
+ }
72
+ /* Selected time */
73
+ .picker__list-item--selected,
74
+ .picker__list-item--selected:hover {
75
+ border-color: #0089ec;
76
+ z-index: 10;
77
+ }
78
+ /* Highlighted time */
79
+ .picker__list-item--highlighted {
80
+ background: #b1dcfb;
81
+ }
82
+ /* Highlighted and hovered/focused time */
83
+ .picker__list-item--highlighted:hover,
84
+ .picker--focused .picker__list-item--highlighted {
85
+ background: #0089ec;
86
+ color: #ffffff;
87
+ }
88
+ /* Disabled time */
89
+ .picker__list-item--disabled,
90
+ .picker__list-item--disabled:hover {
91
+ background: #f5f5f5;
92
+ border-color: #f5f5f5;
93
+ color: #dddddd;
94
+ cursor: default;
95
+ border-color: #777777;
96
+ z-index: auto;
97
+ }
98
+ /**
99
+ * The clear button
100
+ */
101
+ .picker--time .picker__button--clear {
102
+ display: block;
103
+ width: 80%;
104
+ margin: 1em auto 0;
105
+ padding: 1em 1.25em;
106
+ background: none;
107
+ border: 0;
108
+ font-weight: 500;
109
+ font-size: .67em;
110
+ text-align: center;
111
+ text-transform: uppercase;
112
+ color: #666;
113
+ }
114
+ .picker--time .picker__button--clear:hover,
115
+ .picker--time .picker__button--clear:focus {
116
+ color: #000000;
117
+ background: #b1dcfb;
118
+ background: #ee2200;
119
+ border-color: #ee2200;
120
+ cursor: pointer;
121
+ color: #ffffff;
122
+ outline: none;
123
+ }
124
+ .picker--time .picker__button--clear:before {
125
+ top: -0.25em;
126
+ color: #666;
127
+ font-size: 1.25em;
128
+ font-weight: bold;
129
+ }
130
+ .picker--time .picker__button--clear:hover:before,
131
+ .picker--time .picker__button--clear:focus:before {
132
+ color: #ffffff;
133
+ }
134
+
135
+ /* ==========================================================================
136
+ $CLASSIC-TIME-PICKER
137
+ ========================================================================== */
138
+ /* ==========================================================================
139
+ $VARIABLES
140
+ ========================================================================== */
141
+ /**
142
+ * Base colors
143
+ */
144
+ /**
145
+ * Backgrounds
146
+ */
147
+ /**
148
+ * Borders
149
+ */
150
+ /**
151
+ * Buttons
152
+ */
153
+ /**
154
+ * Picker base
155
+ */
156
+ /**
157
+ * Date picker options
158
+ */
159
+ /**
160
+ * Theme configurations
161
+ */
162
+ /* ==========================================================================
163
+ $MIXINS
164
+ ========================================================================== */
165
+ /**
166
+ * Common picker item states
167
+ */
168
+ /**
169
+ * Opacity
170
+ */
171
+ /**
172
+ * Vendor prefixes
173
+ */
174
+ /**
175
+ * Note: the root picker element should __NOT__ be styled
176
+ * more than what’s here. Style the `.picker__holder` instead.
177
+ */
178
+ .picker--time {
179
+ min-width: 256px;
180
+ max-width: 320px;
181
+ }
182
+ /**
183
+ * The holder is the base of the picker.
184
+ */
185
+ .picker--time .picker__holder {
186
+ background: #f2f2f2;
187
+ }
188
+ @media (min-height: 40.125em) {
189
+ .picker--time .picker__holder {
190
+ font-size: .875em;
191
+ }
192
+ }
193
+ /**
194
+ * The box contains the list of times.
195
+ */
196
+ .picker--time .picker__box {
197
+ padding: 0;
198
+ }
@@ -0,0 +1,234 @@
1
+ /* ==========================================================================
2
+ $BASE-PICKER
3
+ ========================================================================== */
4
+ /* ==========================================================================
5
+ $VARIABLES
6
+ ========================================================================== */
7
+ /**
8
+ * Base colors
9
+ */
10
+ /**
11
+ * Backgrounds
12
+ */
13
+ /**
14
+ * Borders
15
+ */
16
+ /**
17
+ * Buttons
18
+ */
19
+ /**
20
+ * Picker base
21
+ */
22
+ /**
23
+ * Date picker options
24
+ */
25
+ /**
26
+ * Theme configurations
27
+ */
28
+ /* ==========================================================================
29
+ $MIXINS
30
+ ========================================================================== */
31
+ /**
32
+ * Common picker item states
33
+ */
34
+ /**
35
+ * Opacity
36
+ */
37
+ /**
38
+ * Vendor prefixes
39
+ */
40
+ /**
41
+ * Note: the root picker element should __NOT__ be styled
42
+ * more than what’s here. Style the `.picker__holder` instead.
43
+ */
44
+ .picker {
45
+ font-size: 16px;
46
+ text-align: left;
47
+ line-height: 1.2;
48
+ color: #000000;
49
+ position: absolute;
50
+ z-index: 10000;
51
+ }
52
+ /**
53
+ * When the picker is opened, the input element is “activated”.
54
+ */
55
+ .picker__input.picker__input--active {
56
+ border-color: #0089ec;
57
+ }
58
+ /**
59
+ * The holder is the only “scrollable” top-level container element.
60
+ */
61
+ .picker__holder {
62
+ width: 100%;
63
+ overflow-y: auto;
64
+ -webkit-overflow-scrolling: touch;
65
+ }
66
+
67
+ /*!
68
+ * Default mobile-first, responsive styling for pickadate.js
69
+ * Demo: http://amsul.github.io/pickadate.js/themes.htm#default
70
+ */
71
+ /* ==========================================================================
72
+ $VARIABLES
73
+ ========================================================================== */
74
+ /**
75
+ * Base colors
76
+ */
77
+ /**
78
+ * Backgrounds
79
+ */
80
+ /**
81
+ * Borders
82
+ */
83
+ /**
84
+ * Buttons
85
+ */
86
+ /**
87
+ * Picker base
88
+ */
89
+ /**
90
+ * Date picker options
91
+ */
92
+ /**
93
+ * Theme configurations
94
+ */
95
+ /* ==========================================================================
96
+ $MIXINS
97
+ ========================================================================== */
98
+ /**
99
+ * Common picker item states
100
+ */
101
+ /**
102
+ * Opacity
103
+ */
104
+ /**
105
+ * Vendor prefixes
106
+ */
107
+ /**
108
+ * Make the holder and frame fullscreen.
109
+ */
110
+ .picker__holder,
111
+ .picker__frame {
112
+ bottom: 0;
113
+ left: 0;
114
+ right: 0;
115
+ top: 100%;
116
+ }
117
+ /**
118
+ * The holder should overlay the entire screen.
119
+ */
120
+ .picker__holder {
121
+ position: fixed;
122
+ -webkit-transition: background 0.15s ease-out, top 0s 0.15s;
123
+ -moz-transition: background 0.15s ease-out, top 0s 0.15s;
124
+ transition: background 0.15s ease-out, top 0s 0.15s;
125
+ }
126
+ /**
127
+ * The frame that bounds the box contents of the picker.
128
+ */
129
+ .picker__frame {
130
+ position: absolute;
131
+ margin: 0 auto;
132
+ min-width: 256px;
133
+ max-width: 666px;
134
+ width: 100%;
135
+ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
136
+ filter: alpha(opacity=0);
137
+ -moz-opacity: 0;
138
+ opacity: 0;
139
+ -webkit-transition: all 0.15s ease-out;
140
+ -moz-transition: all 0.15s ease-out;
141
+ transition: all 0.15s ease-out;
142
+ }
143
+ @media (min-height: 33.875em) {
144
+ .picker__frame {
145
+ overflow: visible;
146
+ top: auto;
147
+ bottom: -100%;
148
+ max-height: 80%;
149
+ }
150
+ }
151
+ @media (min-height: 40.125em) {
152
+ .picker__frame {
153
+ margin-bottom: 7.5%;
154
+ }
155
+ }
156
+ /**
157
+ * The wrapper sets the stage to vertically align the box contents.
158
+ */
159
+ .picker__wrap {
160
+ display: table;
161
+ width: 100%;
162
+ height: 100%;
163
+ }
164
+ @media (min-height: 33.875em) {
165
+ .picker__wrap {
166
+ display: block;
167
+ }
168
+ }
169
+ /**
170
+ * The box contains all the picker contents.
171
+ */
172
+ .picker__box {
173
+ background: #ffffff;
174
+ display: table-cell;
175
+ vertical-align: middle;
176
+ }
177
+ @media (min-height: 26.5em) {
178
+ .picker__box {
179
+ font-size: 1.25em;
180
+ }
181
+ }
182
+ @media (min-height: 33.875em) {
183
+ .picker__box {
184
+ display: block;
185
+ font-size: 1.33em;
186
+ border: 1px solid #777777;
187
+ border-top-color: #898989;
188
+ border-bottom-width: 0;
189
+ -webkit-border-radius: 5px 5px 0 0;
190
+ -moz-border-radius: 5px 5px 0 0;
191
+ border-radius: 5px 5px 0 0;
192
+ -webkit-box-shadow: 0 12px 36px 16px rgba(0, 0, 0, 0.24);
193
+ -moz-box-shadow: 0 12px 36px 16px rgba(0, 0, 0, 0.24);
194
+ box-shadow: 0 12px 36px 16px rgba(0, 0, 0, 0.24);
195
+ }
196
+ }
197
+ @media (min-height: 40.125em) {
198
+ .picker__box {
199
+ font-size: 1.5em;
200
+ border-bottom-width: 1px;
201
+ -webkit-border-radius: 5px;
202
+ -moz-border-radius: 5px;
203
+ border-radius: 5px;
204
+ }
205
+ }
206
+ /**
207
+ * When the picker opens...
208
+ */
209
+ .picker--opened .picker__holder {
210
+ top: 0;
211
+ background: transparent;
212
+ -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#1E000000,endColorstr=#1E000000)";
213
+ zoom: 1;
214
+ background: rgba(0, 0, 0, 0.32);
215
+ -webkit-transition: background 0.15s ease-out;
216
+ -moz-transition: background 0.15s ease-out;
217
+ transition: background 0.15s ease-out;
218
+ }
219
+ .picker--opened .picker__frame {
220
+ top: 0;
221
+ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
222
+ filter: alpha(opacity=100);
223
+ -moz-opacity: 1;
224
+ opacity: 1;
225
+ }
226
+ @media (min-height: 33.875em) {
227
+ .picker--opened .picker__frame {
228
+ top: auto;
229
+ bottom: 0;
230
+ }
231
+ }
232
+ /**
233
+ * For `large` screens, transform into an inline picker.
234
+ */
@@ -0,0 +1,332 @@
1
+ /* ==========================================================================
2
+ $BASE-DATE-PICKER
3
+ ========================================================================== */
4
+ /* ==========================================================================
5
+ $VARIABLES
6
+ ========================================================================== */
7
+ /**
8
+ * Base colors
9
+ */
10
+ /**
11
+ * Backgrounds
12
+ */
13
+ /**
14
+ * Borders
15
+ */
16
+ /**
17
+ * Buttons
18
+ */
19
+ /**
20
+ * Picker base
21
+ */
22
+ /**
23
+ * Date picker options
24
+ */
25
+ /**
26
+ * Theme configurations
27
+ */
28
+ /* ==========================================================================
29
+ $MIXINS
30
+ ========================================================================== */
31
+ /**
32
+ * Common picker item states
33
+ */
34
+ /**
35
+ * Opacity
36
+ */
37
+ /**
38
+ * Vendor prefixes
39
+ */
40
+ /**
41
+ * The picker box.
42
+ */
43
+ .picker__box {
44
+ padding: 0 1em;
45
+ }
46
+ /**
47
+ * The header containing the month and year stuff.
48
+ */
49
+ .picker__header {
50
+ text-align: center;
51
+ position: relative;
52
+ margin-top: .75em;
53
+ }
54
+ /**
55
+ * The month and year labels.
56
+ */
57
+ .picker__month,
58
+ .picker__year {
59
+ font-weight: 500;
60
+ display: inline-block;
61
+ margin-left: .25em;
62
+ margin-right: .25em;
63
+ }
64
+ .picker__year {
65
+ color: #999999;
66
+ font-size: .8em;
67
+ font-style: italic;
68
+ }
69
+ /**
70
+ * The month and year selectors.
71
+ */
72
+ .picker__select--month,
73
+ .picker__select--year {
74
+ font-size: .8em;
75
+ border: 1px solid #b7b7b7;
76
+ height: 2.5em;
77
+ padding: .66em .25em;
78
+ margin-left: .25em;
79
+ margin-right: .25em;
80
+ margin-top: -0.5em;
81
+ }
82
+ .picker__select--month {
83
+ width: 35%;
84
+ }
85
+ .picker__select--year {
86
+ width: 22.5%;
87
+ }
88
+ .picker__select--month:focus,
89
+ .picker__select--year:focus {
90
+ border-color: #0089ec;
91
+ }
92
+ /**
93
+ * The month navigation buttons.
94
+ */
95
+ .picker__nav--prev,
96
+ .picker__nav--next {
97
+ position: absolute;
98
+ top: -0.33em;
99
+ padding: .5em 1.33em;
100
+ width: 1em;
101
+ height: 1em;
102
+ }
103
+ .picker__nav--prev {
104
+ left: -1em;
105
+ padding-right: 1.5em;
106
+ }
107
+ .picker__nav--next {
108
+ right: -1em;
109
+ padding-left: 1.5em;
110
+ }
111
+ .picker__nav--prev:before,
112
+ .picker__nav--next:before {
113
+ content: " ";
114
+ border-top: .5em solid transparent;
115
+ border-bottom: .5em solid transparent;
116
+ border-right: 0.75em solid #000000;
117
+ width: 0;
118
+ height: 0;
119
+ display: block;
120
+ margin: 0 auto;
121
+ }
122
+ .picker__nav--next:before {
123
+ border-right: 0;
124
+ border-left: 0.75em solid #000000;
125
+ }
126
+ .picker__nav--prev:hover,
127
+ .picker__nav--next:hover {
128
+ cursor: pointer;
129
+ color: #000000;
130
+ background: #b1dcfb;
131
+ }
132
+ .picker__nav--disabled,
133
+ .picker__nav--disabled:hover,
134
+ .picker__nav--disabled:before,
135
+ .picker__nav--disabled:before:hover {
136
+ cursor: default;
137
+ background: none;
138
+ border-right-color: #f5f5f5;
139
+ border-left-color: #f5f5f5;
140
+ }
141
+ /**
142
+ * The calendar table of dates
143
+ */
144
+ .picker__table {
145
+ text-align: center;
146
+ border-collapse: collapse;
147
+ border-spacing: 0;
148
+ table-layout: fixed;
149
+ font-size: inherit;
150
+ width: 100%;
151
+ margin-top: .75em;
152
+ margin-bottom: .5em;
153
+ }
154
+ @media (min-height: 33.875em) {
155
+ .picker__table {
156
+ margin-bottom: .75em;
157
+ }
158
+ }
159
+ .picker__table td {
160
+ margin: 0;
161
+ padding: 0;
162
+ }
163
+ /**
164
+ * The weekday labels
165
+ */
166
+ .picker__weekday {
167
+ width: 14.285714286%;
168
+ font-size: .75em;
169
+ padding-bottom: .25em;
170
+ color: #999999;
171
+ font-weight: 500;
172
+ /* Increase the spacing a tad */
173
+
174
+ }
175
+ @media (min-height: 33.875em) {
176
+ .picker__weekday {
177
+ padding-bottom: .5em;
178
+ }
179
+ }
180
+ /**
181
+ * The days on the calendar
182
+ */
183
+ .picker__day {
184
+ padding: .3125em 0;
185
+ font-weight: 200;
186
+ border: 1px solid transparent;
187
+ }
188
+ .picker__day--today {
189
+ color: #0089ec;
190
+ position: relative;
191
+ }
192
+ .picker__day--today:before {
193
+ content: " ";
194
+ position: absolute;
195
+ top: 2px;
196
+ right: 2px;
197
+ width: 0;
198
+ height: 0;
199
+ border-top: 0.5em solid #0059bc;
200
+ border-left: .5em solid transparent;
201
+ }
202
+ .picker__day--selected,
203
+ .picker__day--selected:hover {
204
+ border-color: #0089ec;
205
+ }
206
+ .picker__day--highlighted {
207
+ background: #b1dcfb;
208
+ }
209
+ .picker__day--disabled:before {
210
+ border-top-color: #aaaaaa;
211
+ }
212
+ .picker__day--outfocus {
213
+ color: #dddddd;
214
+ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=66)";
215
+ filter: alpha(opacity=66);
216
+ -moz-opacity: 0.66;
217
+ opacity: 0.66;
218
+ }
219
+ .picker__day--infocus:hover,
220
+ .picker__day--outfocus:hover {
221
+ cursor: pointer;
222
+ color: #000000;
223
+ background: #b1dcfb;
224
+ }
225
+ .picker__day--highlighted:hover,
226
+ .picker--focused .picker__day--highlighted {
227
+ background: #0089ec;
228
+ color: #ffffff;
229
+ }
230
+ .picker__day--disabled:hover,
231
+ .picker--focused .picker__day--disabled {
232
+ background: #f5f5f5;
233
+ border-color: #f5f5f5;
234
+ color: #dddddd;
235
+ cursor: default;
236
+ }
237
+ .picker__day--highlighted.picker__day--disabled:hover,
238
+ .picker--focused .picker__day--highlighted.picker__day--disabled {
239
+ background: #bbbbbb;
240
+ }
241
+ /**
242
+ * The footer containing the "today" and "clear" buttons.
243
+ */
244
+ .picker__footer {
245
+ text-align: center;
246
+ }
247
+ .picker__button--today,
248
+ .picker__button--clear {
249
+ border: 1px solid #ffffff;
250
+ background: #ffffff;
251
+ font-size: .8em;
252
+ padding: .66em 0;
253
+ font-weight: bold;
254
+ width: 50%;
255
+ display: inline-block;
256
+ vertical-align: bottom;
257
+ }
258
+ .picker__button--today:hover,
259
+ .picker__button--clear:hover {
260
+ cursor: pointer;
261
+ color: #000000;
262
+ background: #b1dcfb;
263
+ border-bottom-color: #b1dcfb;
264
+ }
265
+ .picker__button--today:focus,
266
+ .picker__button--clear:focus {
267
+ background: #b1dcfb;
268
+ border-color: #0089ec;
269
+ outline: none;
270
+ }
271
+ .picker__button--today:before,
272
+ .picker__button--clear:before {
273
+ position: relative;
274
+ display: inline-block;
275
+ height: 0;
276
+ }
277
+ .picker__button--today:before {
278
+ content: " ";
279
+ margin-right: .45em;
280
+ top: -0.05em;
281
+ width: 0;
282
+ border-top: 0.66em solid #0059bc;
283
+ border-left: .66em solid transparent;
284
+ }
285
+ .picker__button--clear:before {
286
+ content: "\D7";
287
+ margin-right: .35em;
288
+ top: -0.1em;
289
+ color: #ee2200;
290
+ vertical-align: top;
291
+ font-size: 1.1em;
292
+ }
293
+
294
+ /* ==========================================================================
295
+ $DEFAULT-DATE-PICKER
296
+ ========================================================================== */
297
+ /* ==========================================================================
298
+ $VARIABLES
299
+ ========================================================================== */
300
+ /**
301
+ * Base colors
302
+ */
303
+ /**
304
+ * Backgrounds
305
+ */
306
+ /**
307
+ * Borders
308
+ */
309
+ /**
310
+ * Buttons
311
+ */
312
+ /**
313
+ * Picker base
314
+ */
315
+ /**
316
+ * Date picker options
317
+ */
318
+ /**
319
+ * Theme configurations
320
+ */
321
+ /* ==========================================================================
322
+ $MIXINS
323
+ ========================================================================== */
324
+ /**
325
+ * Common picker item states
326
+ */
327
+ /**
328
+ * Opacity
329
+ */
330
+ /**
331
+ * Vendor prefixes
332
+ */