@portnet/ui 0.1.42 → 0.1.44

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.
@@ -1,384 +0,0 @@
1
- "use strict";
2
-
3
- require("core-js/modules/es.weak-map.js");
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports.default = void 0;
8
- require("core-js/modules/es.parse-int.js");
9
- require("core-js/modules/es.regexp.exec.js");
10
- require("core-js/modules/es.regexp.test.js");
11
- require("core-js/modules/es.regexp.to-string.js");
12
- require("core-js/modules/esnext.iterator.map.js");
13
- require("core-js/modules/web.dom-collections.iterator.js");
14
- var _AccessTime = _interopRequireDefault(require("@mui/icons-material/AccessTime"));
15
- var _CalendarMonth = _interopRequireDefault(require("@mui/icons-material/CalendarMonth"));
16
- var _material = require("@mui/material");
17
- var _InputAdornment = _interopRequireDefault(require("@mui/material/InputAdornment"));
18
- var _reactDatepicker = _interopRequireWildcard(require("@trendmicro/react-datepicker"));
19
- var _formik = require("formik");
20
- var _moment = _interopRequireDefault(require("moment"));
21
- var _react = _interopRequireWildcard(require("react"));
22
- var _PuiButton = _interopRequireDefault(require("../buttons/PuiButton"));
23
- var _PuiTextField = _interopRequireDefault(require("../inputs/PuiTextField"));
24
- require("./custom-datepicker.css");
25
- var _jsxRuntime = require("react/jsx-runtime");
26
- function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
27
- function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
28
- function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
29
- const DateTimePickerField = _ref => {
30
- let {
31
- label,
32
- name,
33
- format = "DD/MM/YYYY HH:mm:ss",
34
- onChange,
35
- minDate,
36
- maxDate,
37
- value,
38
- required = false,
39
- error = false,
40
- helperText = null
41
- } = _ref;
42
- const [anchorEl, setAnchorEl] = (0, _react.useState)(null);
43
- const [timeAnchorEl, setTimeAnchorEl] = (0, _react.useState)(null);
44
- const [renderedValue, setRenderedValue] = (0, _react.useState)(null);
45
- const [field] = (0, _formik.useField)(name);
46
- const [selectedDate, setSelectedDate] = (0, _react.useState)(value ? (0, _moment.default)(value, format === "DD/MM/YYYY HH:mm" ? "YYYY-MM-DD HH:mm" : "YYYY-MM-DD HH:mm:ss", true).isValid() ? (0, _moment.default)(value).format("YYYY-MM-DD") : (0, _moment.default)().format("YYYY-MM-DD") : (0, _moment.default)().format("YYYY-MM-DD"));
47
- const [selectedTime, setSelectedTime] = (0, _react.useState)(value ? (0, _moment.default)(value, format === "DD/MM/YYYY HH:mm" ? "YYYY-MM-DD HH:mm" : "YYYY-MM-DD HH:mm:ss", true).isValid() ? format === "DD/MM/YYYY HH:mm" ? (0, _moment.default)(value).format("HH:mm") : (0, _moment.default)(value).format("HH:mm:ss") : format === "DD/MM/YYYY HH:mm" ? (0, _moment.default)(value).format("HH:mm") : (0, _moment.default)(value).format("HH:mm:ss") : format === "DD/MM/YYYY HH:mm" ? (0, _moment.default)(value).format("HH:mm") : (0, _moment.default)(value).format("HH:mm:ss"));
48
- const [selectedHour, setSelectedHour] = (0, _react.useState)((0, _moment.default)(selectedTime, format === "DD/MM/YYYY HH:mm" ? "HH:mm" : "HH:mm:ss").format("HH"));
49
- const [selectedMinute, setSelectedMinute] = (0, _react.useState)((0, _moment.default)(selectedTime, format === "DD/MM/YYYY HH:mm" ? "HH:mm" : "HH:mm:ss").format("mm"));
50
- const [selectedSecond, setSelectedSecond] = (0, _react.useState)((0, _moment.default)(selectedTime, format === "DD/MM/YYYY HH:mm" ? "HH:mm" : "HH:mm:ss").format("ss"));
51
- const openDatePopover = Boolean(anchorEl);
52
- const openTimePopover = Boolean(timeAnchorEl);
53
- (0, _react.useEffect)(() => {
54
- if (value) {
55
- const parsedDate = (0, _moment.default)(value);
56
- const datePart = parsedDate.format(format.split(" ")[0]);
57
- const timePart = parsedDate.format(format === "DD/MM/YYYY HH:mm:ss" ? "HH:mm:ss" : "HH:mm");
58
- setRenderedValue("".concat(datePart, " ").concat(timePart));
59
- }
60
- }, [value, format]);
61
- const handleDateTimeClick = event => setAnchorEl(event.currentTarget);
62
- const handleTimeClick = event => {
63
- setTimeAnchorEl(event.currentTarget);
64
- };
65
- const handleDateClose = () => setAnchorEl(null);
66
- const handleTimeClose = () => setTimeAnchorEl(null);
67
- const updateCombinedDateTime = (newDate, newTime) => {
68
- const combinedDateTime = (0, _moment.default)("".concat(newDate, " ").concat(newTime), format === "DD/MM/YYYY HH:mm:ss" ? "YYYY-MM-DD HH:mm:ss" : "YYYY-MM-DD HH:mm", true).toISOString();
69
- if ((0, _moment.default)(combinedDateTime).isValid()) {
70
- const formattedDate = (0, _moment.default)(combinedDateTime).format(format);
71
- setRenderedValue(formattedDate);
72
- onChange(combinedDateTime);
73
- }
74
- };
75
- const handleDateChange = date => {
76
- setSelectedDate(date);
77
- updateCombinedDateTime(date, selectedTime);
78
- };
79
- const handleHourChange = event => {
80
- const newHour = event.target.value;
81
- setSelectedHour(newHour);
82
- let newTime = "".concat(newHour, ":").concat(selectedMinute);
83
- if (format === "DD/MM/YYYY HH:mm:ss") {
84
- newTime = "".concat(newHour, ":").concat(selectedMinute, ":").concat(selectedSecond);
85
- }
86
- setSelectedTime(newTime);
87
- updateCombinedDateTime(selectedDate, newTime);
88
- };
89
- const handleMinuteChange = event => {
90
- const newMinute = event.target.value;
91
- setSelectedMinute(newMinute);
92
- let newTime = "".concat(selectedHour, ":").concat(newMinute);
93
- if (format === "DD/MM/YYYY HH:mm:ss") {
94
- newTime = "".concat(selectedHour, ":").concat(newMinute, ":").concat(selectedSecond);
95
- }
96
- setSelectedTime(newTime);
97
- updateCombinedDateTime(selectedDate, newTime);
98
- };
99
- const handleSecondChange = event => {
100
- const newSecond = event.target.value;
101
- setSelectedSecond(newSecond);
102
- let newTime = "".concat(selectedHour, ":").concat(selectedMinute, ":").concat(newSecond);
103
- setSelectedTime(newTime);
104
- updateCombinedDateTime(selectedDate, newTime);
105
- };
106
- return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
107
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiTextField.default, {
108
- name: name,
109
- label: label,
110
- value: renderedValue,
111
- onClick: handleDateTimeClick,
112
- readOnly: true,
113
- error: error,
114
- helperText: helperText,
115
- required: required,
116
- InputProps: {
117
- endAdornment: /*#__PURE__*/(0, _jsxRuntime.jsx)(_InputAdornment.default, {
118
- position: "end",
119
- style: {
120
- marginLeft: -10,
121
- marginTop: "-0.1px"
122
- },
123
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_CalendarMonth.default, {
124
- fontSize: "small"
125
- })
126
- })
127
- }
128
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Popover, {
129
- open: openDatePopover,
130
- anchorEl: anchorEl,
131
- onClose: handleDateClose,
132
- anchorOrigin: {
133
- vertical: "bottom",
134
- horizontal: "left"
135
- },
136
- style: {
137
- width: "310px"
138
- },
139
- children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
140
- style: {
141
- padding: 16
142
- },
143
- children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
144
- sx: {
145
- display: "flex",
146
- alignItems: "center",
147
- justifyContent: "space-around"
148
- },
149
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactDatepicker.DateInput, {
150
- value: selectedDate,
151
- onChange: date => handleDateChange(date)
152
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TextField, {
153
- value: selectedTime,
154
- onChange: event => {
155
- const inputValue = event.target.value;
156
- const allowedChars = format === "DD/MM/YYYY HH:mm" ? /^[0-9:]{0,5}$/ : /^[0-9:]{0,8}$/;
157
- if (allowedChars.test(inputValue)) {
158
- setSelectedTime(inputValue);
159
- }
160
- },
161
- onBlur: () => {
162
- const timeParts = selectedTime.split(":");
163
- const isFullFormat = format === "DD/MM/YYYY HH:mm:ss";
164
- let [validatedHour, validatedMinute, validatedSecond] = ["00", "00", isFullFormat ? "00" : undefined];
165
- if (timeParts.length > 0) {
166
- validatedHour = Math.min(23, parseInt(timeParts[0] || "0", 10)).toString().padStart(2, "0");
167
- }
168
- if (timeParts.length > 1) {
169
- validatedMinute = Math.min(59, parseInt(timeParts[1] || "0", 10)).toString().padStart(2, "0");
170
- }
171
- if (isFullFormat && timeParts.length > 2) {
172
- validatedSecond = Math.min(59, parseInt(timeParts[2] || "0", 10)).toString().padStart(2, "0");
173
- }
174
- const updatedTime = isFullFormat ? "".concat(validatedHour, ":").concat(validatedMinute, ":").concat(validatedSecond) : "".concat(validatedHour, ":").concat(validatedMinute);
175
- setSelectedTime(updatedTime);
176
- updateCombinedDateTime(selectedDate, updatedTime);
177
- },
178
- sx: {
179
- "& .MuiInputBase-root": {
180
- width: "100%",
181
- fontSize: 12.5
182
- },
183
- "& .MuiOutlinedInput-input": {
184
- padding: "4px",
185
- height: "23.5px"
186
- }
187
- },
188
- InputProps: {
189
- startAdornment: /*#__PURE__*/(0, _jsxRuntime.jsx)(_InputAdornment.default, {
190
- onClick: handleTimeClick,
191
- position: "start",
192
- style: {
193
- marginLeft: -10,
194
- cursor: "pointer"
195
- },
196
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_AccessTime.default, {
197
- fontSize: "small"
198
- })
199
- })
200
- }
201
- })]
202
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactDatepicker.default, {
203
- date: selectedDate,
204
- onSelect: date => handleDateChange(date),
205
- minDate: minDate,
206
- maxDate: maxDate
207
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
208
- sx: {
209
- textAlign: "right",
210
- padding: 1
211
- },
212
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiButton.default, {
213
- onClick: handleDateClose,
214
- children: "Choisir"
215
- })
216
- })]
217
- })
218
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Popover, {
219
- open: openTimePopover,
220
- anchorEl: timeAnchorEl,
221
- onClose: handleTimeClose,
222
- anchorOrigin: {
223
- vertical: "bottom",
224
- horizontal: "left"
225
- },
226
- style: {
227
- marginTop: 16,
228
- marginLeft: -4
229
- },
230
- children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
231
- style: {
232
- padding: 4,
233
- display: "flex",
234
- justifyContent: "center",
235
- width: "120px",
236
- height: "25px"
237
- },
238
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Select, {
239
- value: selectedHour,
240
- onChange: handleHourChange,
241
- sx: {
242
- padding: 0,
243
- width: 40,
244
- "& .MuiSelect-select": {
245
- padding: "4px",
246
- fontSize: 12.5
247
- },
248
- "& .MuiSvgIcon-root": {
249
- width: "14px"
250
- }
251
- },
252
- MenuProps: {
253
- PaperProps: {
254
- sx: {
255
- maxHeight: "200px",
256
- width: "20px",
257
- "& ul": {
258
- overflowY: "auto",
259
- scrollbarWidth: "thin",
260
- "&::-webkit-scrollbar": {
261
- width: "6px",
262
- backgroundColor: "#f0f0f0"
263
- },
264
- "&::-webkit-scrollbar-thumb": {
265
- backgroundColor: "#888",
266
- borderRadius: "4px"
267
- },
268
- "&::-webkit-scrollbar-thumb:hover": {
269
- backgroundColor: "#555"
270
- }
271
- }
272
- }
273
- }
274
- },
275
- children: [...Array(24).keys()].map(hour => /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.MenuItem, {
276
- value: hour.toString().padStart(2, "0"),
277
- style: {
278
- fontSize: 12.5,
279
- right: 12
280
- },
281
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
282
- children: hour.toString().padStart(2, "0")
283
- })
284
- }, hour))
285
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Select, {
286
- value: selectedMinute,
287
- onChange: handleMinuteChange,
288
- sx: {
289
- padding: 0,
290
- width: 40,
291
- "& .MuiSelect-select": {
292
- padding: "4px",
293
- fontSize: 12.5
294
- },
295
- "& .MuiSvgIcon-root": {
296
- width: "14px"
297
- }
298
- },
299
- MenuProps: {
300
- PaperProps: {
301
- sx: {
302
- maxHeight: "200px",
303
- width: "20px",
304
- "& ul": {
305
- overflowY: "auto",
306
- scrollbarWidth: "thin",
307
- "&::-webkit-scrollbar": {
308
- width: "6px",
309
- backgroundColor: "#f0f0f0"
310
- },
311
- "&::-webkit-scrollbar-thumb": {
312
- backgroundColor: "#888",
313
- borderRadius: "4px"
314
- },
315
- "&::-webkit-scrollbar-thumb:hover": {
316
- backgroundColor: "#555"
317
- }
318
- }
319
- }
320
- }
321
- },
322
- children: [...Array(60).keys()].map(minute => /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.MenuItem, {
323
- value: minute.toString().padStart(2, "0"),
324
- style: {
325
- fontSize: 12.5,
326
- right: 12
327
- },
328
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
329
- children: minute.toString().padStart(2, "0")
330
- })
331
- }, minute))
332
- }), format === "DD/MM/YYYY HH:mm:ss" && /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Select, {
333
- value: selectedSecond,
334
- onChange: handleSecondChange,
335
- sx: {
336
- padding: 0,
337
- width: 40,
338
- "& .MuiSelect-select": {
339
- padding: "4px",
340
- fontSize: 12.5
341
- },
342
- "& .MuiSvgIcon-root": {
343
- width: "14px"
344
- }
345
- },
346
- MenuProps: {
347
- PaperProps: {
348
- sx: {
349
- maxHeight: "200px",
350
- width: "20px",
351
- "& ul": {
352
- overflowY: "auto",
353
- scrollbarWidth: "thin",
354
- "&::-webkit-scrollbar": {
355
- width: "6px",
356
- backgroundColor: "#f0f0f0"
357
- },
358
- "&::-webkit-scrollbar-thumb": {
359
- backgroundColor: "#888",
360
- borderRadius: "4px"
361
- },
362
- "&::-webkit-scrollbar-thumb:hover": {
363
- backgroundColor: "#555"
364
- }
365
- }
366
- }
367
- }
368
- },
369
- children: [...Array(60).keys()].map(minute => /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.MenuItem, {
370
- value: minute.toString().padStart(2, "0"),
371
- style: {
372
- fontSize: 12.5,
373
- right: 12
374
- },
375
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
376
- children: minute.toString().padStart(2, "0")
377
- })
378
- }, minute))
379
- })]
380
- })
381
- })]
382
- });
383
- };
384
- var _default = exports.default = DateTimePickerField;
@@ -1,227 +0,0 @@
1
- .datepicker---date-picker-container---1kNBY {
2
- -webkit-box-sizing: border-box;
3
- -moz-box-sizing: border-box;
4
- box-sizing: border-box;
5
- line-height: 20px;
6
- border: none;
7
- border-radius: 0;
8
- -webkit-box-shadow: none;
9
- box-shadow: none;
10
- padding: 0 5px;
11
- position: relative;
12
- display: inline-block;
13
- }
14
- .datepicker---date-picker-container---1kNBY *,
15
- .datepicker---date-picker-container---1kNBY *:before,
16
- .datepicker---date-picker-container---1kNBY *:after {
17
- -webkit-box-sizing: inherit;
18
- -moz-box-sizing: inherit;
19
- box-sizing: inherit;
20
- }
21
- .datepicker---date-picker-container---1kNBY .react-datepicker__header {
22
- text-align: center;
23
- background-color: #fff;
24
- border: none;
25
- position: relative;
26
- padding: 0;
27
- }
28
- .datepicker---date-picker-container---1kNBY .react-datepicker__month {
29
- margin: 0;
30
- text-align: center;
31
- }
32
- .datepicker---date-picker-container---1kNBY .react-datepicker__current-month {
33
- color: #222;
34
- font-family: "Roboto", sans-serif !important;
35
- font-weight: bold;
36
- font-size: 13px;
37
- height: 20px;
38
- margin: 8px 0;
39
- }
40
- .datepicker---date-picker-container---1kNBY .react-datepicker__navigation {
41
- background: none;
42
- line-height: 20px;
43
- text-align: center;
44
- cursor: pointer;
45
- position: absolute;
46
- top: 3px;
47
- padding: 5px;
48
- border: none;
49
- z-index: 1;
50
- outline: 0;
51
- width: 30px;
52
- height: 30px;
53
- background-color: transparent;
54
- background-position: center center;
55
- background-repeat: no-repeat;
56
- }
57
- .datepicker---date-picker-container---1kNBY
58
- .react-datepicker__navigation:hover {
59
- border-radius: 3px;
60
- background-color: #eee;
61
- }
62
- .datepicker---date-picker-container---1kNBY
63
- .react-datepicker__navigation--previous {
64
- left: 8px;
65
- background-image: url(data:image/svg+xml;base64,PCEtLSBHZW5lcmF0ZWQgYnkgVHJlbmQgTWljcm8gU3R5bGUgUG9ydGFsIC0tPg0KPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2IiB2aWV3Qm94PSIwIDAgMTYgMTYiPg0KICA8dGl0bGU+YW5nbGUtbGVmdDwvdGl0bGU+DQogIDxwYXRoIGZpbGw9InJnYigzNCwzNCwzNCkiIGQ9Ik05LjUwMSAxMi41MDZsLTQuNDk5LTQuNTA2IDQuNDg4LTQuNDk0IDEgMS0zLjQ5IDMuNDk0IDMuNTAxIDMuNTA2eiI+PC9wYXRoPg0KPC9zdmc+);
66
- }
67
- .datepicker---date-picker-container---1kNBY
68
- .react-datepicker__navigation--next {
69
- right: 8px;
70
- background-image: url(data:image/svg+xml;base64,PCEtLSBHZW5lcmF0ZWQgYnkgVHJlbmQgTWljcm8gU3R5bGUgUG9ydGFsIC0tPg0KPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2IiB2aWV3Qm94PSIwIDAgMTYgMTYiPg0KICA8dGl0bGU+YW5nbGUtcmlnaHQ8L3RpdGxlPg0KICA8cGF0aCBmaWxsPSJyZ2IoMzQsMzQsMzQpIiBkPSJNNi41MDEgMTIuNWwtMS0xIDMuNTAxLTMuNTA2LTMuNDktMy40OTQgMS0xIDQuNDg4IDQuNDk0eiI+PC9wYXRoPg0KPC9zdmc+);
71
- }
72
- .datepicker---date-picker-container---1kNBY .react-datepicker__day,
73
- .datepicker---date-picker-container---1kNBY .react-datepicker__day-name {
74
- color: #222;
75
- display: inline-block;
76
- text-align: center;
77
- width: 30px;
78
- line-height: 20px;
79
- border: 0;
80
- padding: 5px;
81
- margin: 2px;
82
- }
83
- .datepicker---date-picker-container---1kNBY .react-datepicker__day {
84
- cursor: pointer;
85
- font-size: 13px;
86
- font-family: "Roboto", sans-serif !important;
87
- }
88
- .datepicker---date-picker-container---1kNBY .react-datepicker__day:hover {
89
- background: #eee;
90
- cursor: pointer;
91
- border-radius: 50%;
92
- }
93
- .datepicker---date-picker-container---1kNBY
94
- .react-datepicker__day.react-datepicker__day--disabled,
95
- .datepicker---date-picker-container---1kNBY
96
- .react-datepicker__day:hover.react-datepicker__day--disabled {
97
- background: inherit;
98
- cursor: default;
99
- color: #bbb;
100
- }
101
- .datepicker---date-picker-container---1kNBY .react-datepicker__day-name {
102
- padding-top: 9px;
103
- font-size: 12px;
104
- font-weight: bold;
105
- font-family: "Roboto", sans-serif !important;
106
- }
107
- .datepicker---date-picker-container---1kNBY .react-datepicker__day-names {
108
- white-space: nowrap;
109
- }
110
- .datepicker---date-picker-container---1kNBY
111
- .react-datepicker__day--outside-month {
112
- color: #bbb;
113
- }
114
- .datepicker---date-picker-container---1kNBY .react-datepicker__day--today {
115
- color: #888 !important;
116
- }
117
-
118
- .datepicker---date-picker-container---1kNBY
119
- .react-datepicker__day--today.react-datepicker__day--selected {
120
- color: #fff !important;
121
- }
122
-
123
- .datepicker---date-picker-container---1kNBY .react-datepicker__day--selected {
124
- color: #fff;
125
- font-weight: bold;
126
- font-family: "Roboto", sans-serif !important;
127
- background-color: #232f66 !important;
128
- border-radius: 50%;
129
- }
130
- .datepicker---date-picker-container---1kNBY
131
- .react-datepicker__day--selected:hover {
132
- background-color: #232f66 !important;
133
- }
134
- @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
135
- .datepicker---date-input---1vOyn > input {
136
- height: 32px;
137
- }
138
- }
139
- .datepicker---date-input-container---2zD9B {
140
- -webkit-box-sizing: border-box;
141
- -moz-box-sizing: border-box;
142
- box-sizing: border-box;
143
- line-height: 20px;
144
- position: relative;
145
- }
146
- .datepicker---date-input-container---2zD9B *,
147
- .datepicker---date-input-container---2zD9B *:before,
148
- .datepicker---date-input-container---2zD9B *:after {
149
- -webkit-box-sizing: inherit;
150
- -moz-box-sizing: inherit;
151
- box-sizing: inherit;
152
- }
153
- .datepicker---date-input---1vOyn {
154
- width: 120px;
155
- }
156
- .datepicker---date-input---1vOyn > input {
157
- display: block;
158
- width: 100%;
159
- height: auto;
160
- line-height: inherit;
161
- padding: 5px 12px;
162
- padding-left: 30px;
163
- font-size: 13px;
164
- font-family: "Roboto", sans-serif !important;
165
- color: #222;
166
- border: 1px solid #ccc;
167
- border-radius: 3px;
168
- outline: none;
169
- }
170
- .datepicker---date-input---1vOyn > input:focus {
171
- border-color: #232f66 !important;
172
- }
173
- .datepicker---date-input-icon---1UeQu {
174
- position: absolute;
175
- left: 9px;
176
- top: 8px;
177
- color: #666;
178
- width: 14px;
179
- height: 14px;
180
- }
181
- @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
182
- .datepicker---time-input---2ICRB > input {
183
- height: 32px;
184
- }
185
- }
186
- .datepicker---time-input-container---s4Ikh {
187
- -webkit-box-sizing: border-box;
188
- -moz-box-sizing: border-box;
189
- box-sizing: border-box;
190
- line-height: 20px;
191
- position: relative;
192
- }
193
- .datepicker---time-input-container---s4Ikh *,
194
- .datepicker---time-input-container---s4Ikh *:before,
195
- .datepicker---time-input-container---s4Ikh *:after {
196
- -webkit-box-sizing: inherit;
197
- -moz-box-sizing: inherit;
198
- box-sizing: inherit;
199
- }
200
- .datepicker---time-input---2ICRB {
201
- width: 120px;
202
- }
203
- .datepicker---time-input---2ICRB > input {
204
- display: block;
205
- width: 100%;
206
- height: auto;
207
- line-height: inherit;
208
- padding: 5px 12px;
209
- padding-left: 30px;
210
- font-size: 13px;
211
- font-family: "Roboto", sans-serif !important;
212
- color: #222;
213
- border: 1px solid #ccc;
214
- border-radius: 3px;
215
- outline: none;
216
- }
217
- .datepicker---time-input---2ICRB > input:focus {
218
- border-color: #232f66 !important;
219
- }
220
- .datepicker---time-input-icon---3TeZ8 {
221
- position: absolute;
222
- left: 9px;
223
- top: 8px;
224
- color: #666;
225
- width: 14px;
226
- height: 14px;
227
- }