@mailstep/design-system 0.8.31-beta.2 → 0.8.31-beta.4
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.
- package/package.json +1 -1
- package/ui/Elements/DatePicker/Datetime/components/DateRepeater.js +1 -1
- package/ui/Elements/DatePicker/Datetime/components/Timepicker.js +2 -2
- package/ui/Elements/DatePicker/styles.js +1 -1
- package/ui/ThemeProvider/themes/default.js +2 -1
- package/ui/index.es.js +6448 -6440
- package/ui/index.umd.js +365 -363
package/package.json
CHANGED
|
@@ -27,5 +27,5 @@ export var DateRepeater = function (_a) {
|
|
|
27
27
|
}
|
|
28
28
|
onChangeOthers === null || onChangeOthers === void 0 ? void 0 : onChangeOthers(__assign(__assign({}, others), { dateTypeRepeater: dateTypeRepeater }));
|
|
29
29
|
}, [onChangeOthers, reset, others]);
|
|
30
|
-
return (_jsx(x.div, { borderTop: "1px solid", borderColor: "lightGray2", mt: "8px", pt: "8px", mb: "8px", children: _jsxs(FooterRow, { children: [_jsxs(x.div, { display: "flex", alignItems: "center", flex: "1", children: [_jsx(Icon, { icon: "calendar" }), _jsx(FooterRowLabel, { children: i18n._({ id: 'dataGrid.repeat', message: 'Repeat' }) })] }), _jsxs(x.select, { textAlign: "right", onChange: handleChange, value: others === null || others === void 0 ? void 0 : others.dateTypeRepeater,
|
|
30
|
+
return (_jsx(x.div, { borderTop: "1px solid", borderColor: "lightGray2", mt: "8px", pt: "8px", mb: "8px", children: _jsxs(FooterRow, { children: [_jsxs(x.div, { display: "flex", alignItems: "center", flex: "1", children: [_jsx(Icon, { icon: "calendar" }), _jsx(FooterRowLabel, { children: i18n._({ id: 'dataGrid.repeat', message: 'Repeat' }) })] }), _jsxs(x.select, { textAlign: "right", onChange: handleChange, value: others === null || others === void 0 ? void 0 : others.dateTypeRepeater, backgroundColor: "transparent", color: "#22394E", cursor: "pointer", border: "none", children: [_jsx("option", { value: "", children: i18n._({ id: 'dataGrid.noRepeat', message: 'No repeat' }) }), _jsx("option", { value: DatePickerRepeat.EVERY_TODAY, children: DatePickerRepeatTrans[DatePickerRepeat.EVERY_TODAY] }), _jsx("option", { value: DatePickerRepeat.EVERY_YESTERDAY, children: DatePickerRepeatTrans[DatePickerRepeat.EVERY_YESTERDAY] })] })] }) }));
|
|
31
31
|
};
|
|
@@ -12,8 +12,8 @@ import { FooterRow } from './FooterRow';
|
|
|
12
12
|
import { FooterRowLabel } from './FooterRowLabel';
|
|
13
13
|
var Btn = styled.button(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n transform: rotate(90deg);\n font-size: 18px;\n margin: -4px 0;\n background-color: transparent !important;\n border: none;\n color: ", ";\n &:disabled:hover {\n color: ", ";\n cursor: default;\n }\n &:hover {\n color: ", ";\n background-color: transparent !important;\n }\n"], ["\n transform: rotate(90deg);\n font-size: 18px;\n margin: -4px 0;\n background-color: transparent !important;\n border: none;\n color: ", ";\n &:disabled:hover {\n color: ", ";\n cursor: default;\n }\n &:hover {\n color: ", ";\n background-color: transparent !important;\n }\n"])), th('colors.lightGray4'), th('colors.lightGray4'), th('colors.red2'));
|
|
14
14
|
var TimeWrapper = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n display: flex;\n align-items: baseline;\n justify-content: center;\n border: 1px solid ", ";\n border-radius: 6px;\n padding: 0 4px;\n margin: 0 4px;\n"], ["\n display: flex;\n align-items: baseline;\n justify-content: center;\n border: 1px solid ", ";\n border-radius: 6px;\n padding: 0 4px;\n margin: 0 4px;\n"])), th('colors.lightGray2'));
|
|
15
|
-
var Hours = styled.input(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n font-size: 14px;\n font-weight: 600;\n width: 17px;\n margin: 0;\n padding: 0;\n border: none;\n outline: none;\n background-color:
|
|
16
|
-
var Minutes = styled.input(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n font-weight: 600;\n font-size: 14px;\n width: 18px;\n margin: 0;\n padding: 0;\n border: none;\n outline: none;\n background-color:
|
|
15
|
+
var Hours = styled.input(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n font-size: 14px;\n font-weight: 600;\n width: 17px;\n margin: 0;\n padding: 0;\n border: none;\n outline: none;\n background-color: transparent;\n color: #22394E;\n &:disabled {\n opacity: 0.5;\n }\n"], ["\n font-size: 14px;\n font-weight: 600;\n width: 17px;\n margin: 0;\n padding: 0;\n border: none;\n outline: none;\n background-color: transparent;\n color: #22394E;\n &:disabled {\n opacity: 0.5;\n }\n"])));
|
|
16
|
+
var Minutes = styled.input(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n font-weight: 600;\n font-size: 14px;\n width: 18px;\n margin: 0;\n padding: 0;\n border: none;\n outline: none;\n background-color: transparent;\n color: #22394E;\n &:disabled {\n opacity: 0.5;\n }\n"], ["\n font-weight: 600;\n font-size: 14px;\n width: 18px;\n margin: 0;\n padding: 0;\n border: none;\n outline: none;\n background-color: transparent;\n color: #22394E;\n &:disabled {\n opacity: 0.5;\n }\n"])));
|
|
17
17
|
var regExp = '^[0-9]*$';
|
|
18
18
|
export var Timepicker = function (_a) {
|
|
19
19
|
var _b, _c, _d, _e;
|
|
@@ -4,5 +4,5 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cook
|
|
|
4
4
|
};
|
|
5
5
|
import styled, { x } from '@xstyled/styled-components';
|
|
6
6
|
import { th } from '@xstyled/system';
|
|
7
|
-
export var DatePickerBase = styled(x.div)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n .rdt {\n position: relative;\n }\n .rdtPicker {\n display: none;\n position: absolute;\n z-index: 1;\n min-width: 250px;\n color: ", ";\n background: ", ";\n border: 1px solid rgba(0, 0, 0, 0.15);\n border-radius: 10px;\n box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);\n padding: 0.5rem 1.2rem;\n margin: 0.125rem 0rem;\n }\n .rdtOpen .rdtPicker {\n display: block;\n }\n .rdtStatic .rdtPicker {\n position: static;\n }\n\n .rdtPicker .rdtTimeToggle {\n padding-top: 1rem;\n padding-bottom: 1rem;\n text-align: center;\n font-size: 1.25rem;\n }\n .rdtPicker table {\n width: 100%;\n margin: 0;\n border-collapse: collapse;\n }\n .rdtPicker td,\n .rdtPicker th {\n text-align: center;\n height: 30px;\n }\n .rdtPicker td {\n padding: 0 0.8rem;\n }\n .rdtPicker .rdtCounter .rdtBtn:hover,\n .rdtPicker .rdtYear:hover,\n .rdtPicker .rdtMonth:hover,\n .rdtPicker .rdtDay:hover,\n .rdtPicker .rdtHour:hover,\n .rdtPicker .rdtMinute:hover,\n .rdtPicker .rdtSecond:hover,\n .rdtPicker .rdtTimeToggle:hover,\n .rdtPicker .rdtSwitch:hover {\n background: #f8f9fa;\n cursor: pointer;\n }\n .rdtPicker .rdtOld,\n .rdtPicker .rdtNew {\n color: rgba(33, 37, 41, 0.3);\n }\n .rdtPicker .rdtToday {\n position: relative;\n }\n .rdtPicker .rdtToday:before {\n content: '';\n display: inline-block;\n border-left: 7px solid transparent;\n border-bottom: 7px solid ", ";\n position: absolute;\n bottom: 4px;\n right: 4px;\n }\n .rdtPicker th {\n border-bottom: 1px solid #e9ecef;\n }\n .rdtPicker .dow {\n width: 14.2857%;\n border-bottom: none;\n cursor: default;\n font-weight: 600;\n }\n .rdtPicker .rdtPrev,\n .rdtPicker .rdtSwitch,\n .rdtPicker .rdtNext {\n font-weight: 600;\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\n }\n\n .rdtPicker .rdtNext,\n .rdtPicker .rdtPrev {\n width: 36px;\n font-size: 1.4rem;\n vertical-align: top;\n color: ", ";\n }\n .rdtPicker .rdtCounter .rdtBtn {\n font-size: 1rem;\n display: block;\n user-select: none;\n }\n .rdtPicker th.rdtDisabled,\n .rdtPicker th.rdtDisabled:hover {\n background: none;\n color: #6c757d;\n cursor: not-allowed;\n }\n .rdtPicker thead tr:first-child th {\n cursor: pointer;\n }\n .rdtPicker thead:first-child {\n line-height: 20px;\n }\n .rdtPicker thead tr:first-child th:hover {\n background: #f8f9fa;\n }\n .rdtPicker .rdtTimeToggle {\n border-top: 1px solid #e9ecef;\n }\n .rdtPicker button {\n border: none;\n background: none;\n cursor: pointer;\n }\n .rdtPicker button:hover {\n background-color: #f8f9fa;\n }\n .rdtPicker thead button {\n width: 100%;\n height: 100%;\n }\n .rdtPicker .rdtDays {\n min-width: 250px;\n }\n .rdtPicker .rdtMonth,\n .rdtPicker .rdtYear {\n height: 50px;\n width: 25%;\n cursor: pointer;\n }\n .rdtPicker .rdtMonth:hover,\n .rdtPicker .rdtYear:hover {\n color: #16181b;\n background: #f8f9fa;\n }\n .rdtPicker .rdtActiveSecond {\n background: ", " !important;\n color: ", " !important;\n border-radius: 0.5rem;\n font-weight: 600;\n text-decoration: none !important;\n }\n .rdtPicker .rdtLabel {\n cursor: default !important;\n background: transparent !important;\n font-weight: 600;\n text-align: right;\n }\n\n .rdtPicker .rdtActive {\n background-color: ", " !important;\n color: ", ";\n border-radius: 0.5rem;\n font-weight: 600;\n }\n .rdtPicker .rdtActive:hover {\n background-color: ", ";\n color: ", ";\n font-weight: 600;\n }\n .rdtPicker .rdtActive .rdtToday:before {\n border-bottom-color: ", ";\n }\n .rdtPicker .rdtDisabled,\n .rdtPicker .rdtDisabled:hover {\n background: none;\n color: #6c757d;\n text-decoration: line-through;\n cursor: not-allowed;\n }\n .rdtPicker .rdtDays {\n display: inline-block;\n }\n .rdtPicker .rdtCounters {\n display: inline-block;\n }\n .rdtPicker .rdtCounters > div {\n float: left;\n }\n\n .rdtPicker .rdtActiveRange {\n background: ", ";\n }\n\n .rdtPicker .rdtCounters > div :first-child {\n visibility: hidden;\n transform: rotate(-90deg);\n }\n .rdtPicker .rdtCounters > div :last-child {\n visibility: hidden;\n transform: rotate(90deg);\n }\n .rdtPicker .rdtCounters > div > span:before {\n left: 5px;\n visibility: visible;\n position: relative;\n content: '\u203A';\n font-size: 2rem;\n font-weight: 900;\n color: ", ";\n padding: 0 10px;\n }\n .rdtPicker .rdtCounter {\n width: 40px;\n }\n .rdtPicker .rdtCounter .rdtBtn {\n line-height: 40px;\n cursor: pointer;\n }\n .rdtPicker .rdtCounter .rdtBtn:hover {\n background: #f8f9fa;\n }\n .rdtPicker .rdtCounter .rdtCount {\n line-height: 20px;\n font-size: 1.25rem;\n }\n .rdtPicker .rdtCounterSeparator {\n line-height: 100px;\n }\n"], ["\n .rdt {\n position: relative;\n }\n .rdtPicker {\n display: none;\n position: absolute;\n z-index: 1;\n min-width: 250px;\n color: ", ";\n background: ", ";\n border: 1px solid rgba(0, 0, 0, 0.15);\n border-radius: 10px;\n box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);\n padding: 0.5rem 1.2rem;\n margin: 0.125rem 0rem;\n }\n .rdtOpen .rdtPicker {\n display: block;\n }\n .rdtStatic .rdtPicker {\n position: static;\n }\n\n .rdtPicker .rdtTimeToggle {\n padding-top: 1rem;\n padding-bottom: 1rem;\n text-align: center;\n font-size: 1.25rem;\n }\n .rdtPicker table {\n width: 100%;\n margin: 0;\n border-collapse: collapse;\n }\n .rdtPicker td,\n .rdtPicker th {\n text-align: center;\n height: 30px;\n }\n .rdtPicker td {\n padding: 0 0.8rem;\n }\n .rdtPicker .rdtCounter .rdtBtn:hover,\n .rdtPicker .rdtYear:hover,\n .rdtPicker .rdtMonth:hover,\n .rdtPicker .rdtDay:hover,\n .rdtPicker .rdtHour:hover,\n .rdtPicker .rdtMinute:hover,\n .rdtPicker .rdtSecond:hover,\n .rdtPicker .rdtTimeToggle:hover,\n .rdtPicker .rdtSwitch:hover {\n background: #f8f9fa;\n cursor: pointer;\n }\n .rdtPicker .rdtOld,\n .rdtPicker .rdtNew {\n color: rgba(33, 37, 41, 0.3);\n }\n .rdtPicker .rdtToday {\n position: relative;\n }\n .rdtPicker .rdtToday:before {\n content: '';\n display: inline-block;\n border-left: 7px solid transparent;\n border-bottom: 7px solid ", ";\n position: absolute;\n bottom: 4px;\n right: 4px;\n }\n .rdtPicker th {\n border-bottom: 1px solid #e9ecef;\n }\n .rdtPicker .dow {\n width: 14.2857%;\n border-bottom: none;\n cursor: default;\n font-weight: 600;\n }\n .rdtPicker .rdtPrev,\n .rdtPicker .rdtSwitch,\n .rdtPicker .rdtNext {\n font-weight: 600;\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\n }\n\n .rdtPicker .rdtNext,\n .rdtPicker .rdtPrev {\n width: 36px;\n font-size: 1.4rem;\n vertical-align: top;\n color: ", ";\n }\n .rdtPicker .rdtCounter .rdtBtn {\n font-size: 1rem;\n display: block;\n user-select: none;\n }\n .rdtPicker th.rdtDisabled,\n .rdtPicker th.rdtDisabled:hover {\n background: none;\n color: #6c757d;\n cursor: not-allowed;\n }\n .rdtPicker thead tr:first-child th {\n cursor: pointer;\n }\n .rdtPicker thead:first-child {\n line-height: 20px;\n }\n .rdtPicker thead tr:first-child th:hover {\n background: #f8f9fa;\n }\n .rdtPicker .rdtTimeToggle {\n border-top: 1px solid #e9ecef;\n }\n .rdtPicker button {\n border: none;\n background: none;\n cursor: pointer;\n }\n .rdtPicker button:hover {\n background-color: #f8f9fa;\n }\n .rdtPicker thead button {\n width: 100%;\n height: 100%;\n }\n .rdtPicker .rdtDays {\n min-width: 250px;\n }\n .rdtPicker .rdtMonth,\n .rdtPicker .rdtYear {\n height: 50px;\n width: 25%;\n cursor: pointer;\n }\n .rdtPicker .rdtMonth:hover,\n .rdtPicker .rdtYear:hover {\n color: #16181b;\n background: #f8f9fa;\n }\n .rdtPicker .rdtActiveSecond {\n background: ", " !important;\n color: ", " !important;\n border-radius: 0.5rem;\n font-weight: 600;\n text-decoration: none !important;\n }\n .rdtPicker .rdtLabel {\n cursor: default !important;\n background: transparent !important;\n font-weight: 600;\n text-align: right;\n }\n\n .rdtPicker .rdtActive {\n background-color: ", " !important;\n color: ", ";\n border-radius: 0.5rem;\n font-weight: 600;\n }\n .rdtPicker .rdtActive:hover {\n background-color: ", ";\n color: ", ";\n font-weight: 600;\n }\n .rdtPicker .rdtActive .rdtToday:before {\n border-bottom-color: ", ";\n }\n .rdtPicker .rdtDisabled,\n .rdtPicker .rdtDisabled:hover {\n background: none;\n color: #6c757d;\n text-decoration: line-through;\n cursor: not-allowed;\n }\n .rdtPicker .rdtDays {\n display: inline-block;\n }\n .rdtPicker .rdtCounters {\n display: inline-block;\n }\n .rdtPicker .rdtCounters > div {\n float: left;\n }\n\n .rdtPicker .rdtActiveRange {\n background: ", ";\n }\n\n .rdtPicker .rdtCounters > div :first-child {\n visibility: hidden;\n transform: rotate(-90deg);\n }\n .rdtPicker .rdtCounters > div :last-child {\n visibility: hidden;\n transform: rotate(90deg);\n }\n .rdtPicker .rdtCounters > div > span:before {\n left: 5px;\n visibility: visible;\n position: relative;\n content: '\u203A';\n font-size: 2rem;\n font-weight: 900;\n color: ", ";\n padding: 0 10px;\n }\n .rdtPicker .rdtCounter {\n width: 40px;\n }\n .rdtPicker .rdtCounter .rdtBtn {\n line-height: 40px;\n cursor: pointer;\n }\n .rdtPicker .rdtCounter .rdtBtn:hover {\n background: #f8f9fa;\n }\n .rdtPicker .rdtCounter .rdtCount {\n line-height: 20px;\n font-size: 1.25rem;\n }\n .rdtPicker .rdtCounterSeparator {\n line-height: 100px;\n }\n"])), th('colors.blue2'), th('colors.white'), th('colors.red2'), th('colors.red2'), th('colors.red1'), th('colors.white'), th('colors.red2'), th('colors.white'), th('colors.red2'), th('colors.white'), th('colors.white'), th('colors.lightGray2'), th('colors.red2'));
|
|
7
|
+
export var DatePickerBase = styled(x.div)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n .rdt {\n position: relative;\n }\n .rdtPicker {\n display: none;\n position: absolute;\n z-index: 1;\n min-width: 250px;\n color: #22394E;\n background: #ffffff;\n border: 1px solid rgba(0, 0, 0, 0.15);\n border-radius: 10px;\n box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);\n padding: 0.5rem 1.2rem;\n margin: 0.125rem 0rem;\n }\n .rdtOpen .rdtPicker {\n display: block;\n }\n .rdtStatic .rdtPicker {\n position: static;\n }\n\n .rdtPicker .rdtTimeToggle {\n padding-top: 1rem;\n padding-bottom: 1rem;\n text-align: center;\n font-size: 1.25rem;\n }\n .rdtPicker table {\n width: 100%;\n margin: 0;\n border-collapse: collapse;\n }\n .rdtPicker td,\n .rdtPicker th {\n text-align: center;\n height: 30px;\n }\n .rdtPicker td {\n padding: 0 0.8rem;\n }\n .rdtPicker .rdtCounter .rdtBtn:hover,\n .rdtPicker .rdtYear:hover,\n .rdtPicker .rdtMonth:hover,\n .rdtPicker .rdtDay:hover,\n .rdtPicker .rdtHour:hover,\n .rdtPicker .rdtMinute:hover,\n .rdtPicker .rdtSecond:hover,\n .rdtPicker .rdtTimeToggle:hover,\n .rdtPicker .rdtSwitch:hover {\n background: #f8f9fa;\n cursor: pointer;\n }\n .rdtPicker .rdtOld,\n .rdtPicker .rdtNew {\n color: rgba(33, 37, 41, 0.3);\n }\n .rdtPicker .rdtToday {\n position: relative;\n }\n .rdtPicker .rdtToday:before {\n content: '';\n display: inline-block;\n border-left: 7px solid transparent;\n border-bottom: 7px solid ", ";\n position: absolute;\n bottom: 4px;\n right: 4px;\n }\n .rdtPicker th {\n border-bottom: 1px solid #e9ecef;\n }\n .rdtPicker .dow {\n width: 14.2857%;\n border-bottom: none;\n cursor: default;\n font-weight: 600;\n }\n .rdtPicker .rdtPrev,\n .rdtPicker .rdtSwitch,\n .rdtPicker .rdtNext {\n font-weight: 600;\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\n }\n\n .rdtPicker .rdtNext,\n .rdtPicker .rdtPrev {\n width: 36px;\n font-size: 1.4rem;\n vertical-align: top;\n color: ", ";\n }\n .rdtPicker .rdtCounter .rdtBtn {\n font-size: 1rem;\n display: block;\n user-select: none;\n }\n .rdtPicker th.rdtDisabled,\n .rdtPicker th.rdtDisabled:hover {\n background: none;\n color: #6c757d;\n cursor: not-allowed;\n }\n .rdtPicker thead tr:first-child th {\n cursor: pointer;\n }\n .rdtPicker thead:first-child {\n line-height: 20px;\n }\n .rdtPicker thead tr:first-child th:hover {\n background: #f8f9fa;\n }\n .rdtPicker .rdtTimeToggle {\n border-top: 1px solid #e9ecef;\n }\n .rdtPicker button {\n border: none;\n background: none;\n cursor: pointer;\n }\n .rdtPicker button:hover {\n background-color: #f8f9fa;\n }\n .rdtPicker thead button {\n width: 100%;\n height: 100%;\n }\n .rdtPicker .rdtDays {\n min-width: 250px;\n }\n .rdtPicker .rdtMonth,\n .rdtPicker .rdtYear {\n height: 50px;\n width: 25%;\n cursor: pointer;\n }\n .rdtPicker .rdtMonth:hover,\n .rdtPicker .rdtYear:hover {\n color: #16181b;\n background: #f8f9fa;\n }\n .rdtPicker .rdtActiveSecond {\n background: ", " !important;\n color: ", " !important;\n border-radius: 0.5rem;\n font-weight: 600;\n text-decoration: none !important;\n }\n .rdtPicker .rdtLabel {\n cursor: default !important;\n background: transparent !important;\n font-weight: 600;\n text-align: right;\n }\n\n .rdtPicker .rdtActive {\n background-color: ", " !important;\n color: ", ";\n border-radius: 0.5rem;\n font-weight: 600;\n }\n .rdtPicker .rdtActive:hover {\n background-color: ", ";\n color: ", ";\n font-weight: 600;\n }\n .rdtPicker .rdtActive .rdtToday:before {\n border-bottom-color: ", ";\n }\n .rdtPicker .rdtDisabled,\n .rdtPicker .rdtDisabled:hover {\n background: none;\n color: #6c757d;\n text-decoration: line-through;\n cursor: not-allowed;\n }\n .rdtPicker .rdtDays {\n display: inline-block;\n }\n .rdtPicker .rdtCounters {\n display: inline-block;\n }\n .rdtPicker .rdtCounters > div {\n float: left;\n }\n\n .rdtPicker .rdtActiveRange {\n background: #EFF3F8;\n }\n\n .rdtPicker .rdtCounters > div :first-child {\n visibility: hidden;\n transform: rotate(-90deg);\n }\n .rdtPicker .rdtCounters > div :last-child {\n visibility: hidden;\n transform: rotate(90deg);\n }\n .rdtPicker .rdtCounters > div > span:before {\n left: 5px;\n visibility: visible;\n position: relative;\n content: '\u203A';\n font-size: 2rem;\n font-weight: 900;\n color: ", ";\n padding: 0 10px;\n }\n .rdtPicker .rdtCounter {\n width: 40px;\n }\n .rdtPicker .rdtCounter .rdtBtn {\n line-height: 40px;\n cursor: pointer;\n }\n .rdtPicker .rdtCounter .rdtBtn:hover {\n background: #f8f9fa;\n }\n .rdtPicker .rdtCounter .rdtCount {\n line-height: 20px;\n font-size: 1.25rem;\n }\n .rdtPicker .rdtCounterSeparator {\n line-height: 100px;\n }\n"], ["\n .rdt {\n position: relative;\n }\n .rdtPicker {\n display: none;\n position: absolute;\n z-index: 1;\n min-width: 250px;\n color: #22394E;\n background: #ffffff;\n border: 1px solid rgba(0, 0, 0, 0.15);\n border-radius: 10px;\n box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);\n padding: 0.5rem 1.2rem;\n margin: 0.125rem 0rem;\n }\n .rdtOpen .rdtPicker {\n display: block;\n }\n .rdtStatic .rdtPicker {\n position: static;\n }\n\n .rdtPicker .rdtTimeToggle {\n padding-top: 1rem;\n padding-bottom: 1rem;\n text-align: center;\n font-size: 1.25rem;\n }\n .rdtPicker table {\n width: 100%;\n margin: 0;\n border-collapse: collapse;\n }\n .rdtPicker td,\n .rdtPicker th {\n text-align: center;\n height: 30px;\n }\n .rdtPicker td {\n padding: 0 0.8rem;\n }\n .rdtPicker .rdtCounter .rdtBtn:hover,\n .rdtPicker .rdtYear:hover,\n .rdtPicker .rdtMonth:hover,\n .rdtPicker .rdtDay:hover,\n .rdtPicker .rdtHour:hover,\n .rdtPicker .rdtMinute:hover,\n .rdtPicker .rdtSecond:hover,\n .rdtPicker .rdtTimeToggle:hover,\n .rdtPicker .rdtSwitch:hover {\n background: #f8f9fa;\n cursor: pointer;\n }\n .rdtPicker .rdtOld,\n .rdtPicker .rdtNew {\n color: rgba(33, 37, 41, 0.3);\n }\n .rdtPicker .rdtToday {\n position: relative;\n }\n .rdtPicker .rdtToday:before {\n content: '';\n display: inline-block;\n border-left: 7px solid transparent;\n border-bottom: 7px solid ", ";\n position: absolute;\n bottom: 4px;\n right: 4px;\n }\n .rdtPicker th {\n border-bottom: 1px solid #e9ecef;\n }\n .rdtPicker .dow {\n width: 14.2857%;\n border-bottom: none;\n cursor: default;\n font-weight: 600;\n }\n .rdtPicker .rdtPrev,\n .rdtPicker .rdtSwitch,\n .rdtPicker .rdtNext {\n font-weight: 600;\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\n }\n\n .rdtPicker .rdtNext,\n .rdtPicker .rdtPrev {\n width: 36px;\n font-size: 1.4rem;\n vertical-align: top;\n color: ", ";\n }\n .rdtPicker .rdtCounter .rdtBtn {\n font-size: 1rem;\n display: block;\n user-select: none;\n }\n .rdtPicker th.rdtDisabled,\n .rdtPicker th.rdtDisabled:hover {\n background: none;\n color: #6c757d;\n cursor: not-allowed;\n }\n .rdtPicker thead tr:first-child th {\n cursor: pointer;\n }\n .rdtPicker thead:first-child {\n line-height: 20px;\n }\n .rdtPicker thead tr:first-child th:hover {\n background: #f8f9fa;\n }\n .rdtPicker .rdtTimeToggle {\n border-top: 1px solid #e9ecef;\n }\n .rdtPicker button {\n border: none;\n background: none;\n cursor: pointer;\n }\n .rdtPicker button:hover {\n background-color: #f8f9fa;\n }\n .rdtPicker thead button {\n width: 100%;\n height: 100%;\n }\n .rdtPicker .rdtDays {\n min-width: 250px;\n }\n .rdtPicker .rdtMonth,\n .rdtPicker .rdtYear {\n height: 50px;\n width: 25%;\n cursor: pointer;\n }\n .rdtPicker .rdtMonth:hover,\n .rdtPicker .rdtYear:hover {\n color: #16181b;\n background: #f8f9fa;\n }\n .rdtPicker .rdtActiveSecond {\n background: ", " !important;\n color: ", " !important;\n border-radius: 0.5rem;\n font-weight: 600;\n text-decoration: none !important;\n }\n .rdtPicker .rdtLabel {\n cursor: default !important;\n background: transparent !important;\n font-weight: 600;\n text-align: right;\n }\n\n .rdtPicker .rdtActive {\n background-color: ", " !important;\n color: ", ";\n border-radius: 0.5rem;\n font-weight: 600;\n }\n .rdtPicker .rdtActive:hover {\n background-color: ", ";\n color: ", ";\n font-weight: 600;\n }\n .rdtPicker .rdtActive .rdtToday:before {\n border-bottom-color: ", ";\n }\n .rdtPicker .rdtDisabled,\n .rdtPicker .rdtDisabled:hover {\n background: none;\n color: #6c757d;\n text-decoration: line-through;\n cursor: not-allowed;\n }\n .rdtPicker .rdtDays {\n display: inline-block;\n }\n .rdtPicker .rdtCounters {\n display: inline-block;\n }\n .rdtPicker .rdtCounters > div {\n float: left;\n }\n\n .rdtPicker .rdtActiveRange {\n background: #EFF3F8;\n }\n\n .rdtPicker .rdtCounters > div :first-child {\n visibility: hidden;\n transform: rotate(-90deg);\n }\n .rdtPicker .rdtCounters > div :last-child {\n visibility: hidden;\n transform: rotate(90deg);\n }\n .rdtPicker .rdtCounters > div > span:before {\n left: 5px;\n visibility: visible;\n position: relative;\n content: '\u203A';\n font-size: 2rem;\n font-weight: 900;\n color: ", ";\n padding: 0 10px;\n }\n .rdtPicker .rdtCounter {\n width: 40px;\n }\n .rdtPicker .rdtCounter .rdtBtn {\n line-height: 40px;\n cursor: pointer;\n }\n .rdtPicker .rdtCounter .rdtBtn:hover {\n background: #f8f9fa;\n }\n .rdtPicker .rdtCounter .rdtCount {\n line-height: 20px;\n font-size: 1.25rem;\n }\n .rdtPicker .rdtCounterSeparator {\n line-height: 100px;\n }\n"])), th('colors.red2'), th('colors.red2'), th('colors.red1'), th('colors.white'), th('colors.red2'), th('colors.white'), th('colors.red2'), th('colors.white'), th('colors.white'), th('colors.red2'));
|
|
8
8
|
var templateObject_1;
|