techsbcn-storybook 0.22.3 → 0.22.5
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/dist/components/tables/SearchComponent/SearchComponent.d.ts +1 -1
- package/dist/techsbcn-storybook.cjs.development.js +11 -10
- package/dist/techsbcn-storybook.cjs.development.js.map +1 -1
- package/dist/techsbcn-storybook.cjs.production.min.js +1 -1
- package/dist/techsbcn-storybook.cjs.production.min.js.map +1 -1
- package/dist/techsbcn-storybook.esm.js +11 -10
- package/dist/techsbcn-storybook.esm.js.map +1 -1
- package/package.json +1 -1
- package/src/components/fields/ButtonComponent/ButtonComponent.scss +3 -1
- package/src/components/fields/DatePickerComponent/DatePickerComponent.scss +1 -0
- package/src/components/fields/SelectFieldComponent/SelectField.scss +3 -3
- package/src/components/fields/TextFieldComponent/TextFieldComponent.scss +1 -0
- package/src/components/tables/SearchComponent/SearchComponent.scss +1 -1
- package/src/components/tables/SearchComponent/SearchComponent.tsx +5 -5
- package/src/components/wrappers/MainWrapperComponent/MainWrapperComponent.scss +4 -4
|
@@ -70,7 +70,7 @@ var PublicFormWrapper = function PublicFormWrapper(props) {
|
|
|
70
70
|
}, props.children)));
|
|
71
71
|
};
|
|
72
72
|
|
|
73
|
-
var css_248z$1 = ".search-component .title {\n color: #000;\n font-size:
|
|
73
|
+
var css_248z$1 = ".search-component .title {\n color: #000;\n font-size: 17px !important;\n font-weight: 400;\n position: relative;\n}\n.search-component .tune-btn {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 50px;\n cursor: pointer;\n color: white;\n}\n.search-component .tune-btn:hover {\n box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12) !important;\n}\n.search-component .wrapper-actions.min-action-width .btn-action .MuiButton-root {\n max-width: 100%;\n width: auto;\n}\n.search-component .wrapper-actions.min-action-width .btn-action .btn {\n max-width: 100%;\n width: auto;\n}\n.search-component .wrapper-actions .btn-action {\n cursor: pointer;\n}\n.search-component .wrapper-actions .btn-action .MuiButton-root {\n width: max-content;\n}\n.search-component .wrapper-actions .btn-action .btn {\n width: max-content;\n}\n.search-component .wrapper-actions .btn-action svg {\n font-size: 40px;\n}\n\n.search-menu-actions .wrapper-actions .btn-action {\n cursor: pointer;\n}\n.search-menu-actions .wrapper-actions .btn-action .btn {\n width: max-content;\n}\n.search-menu-actions .wrapper-actions .btn-action svg {\n font-size: 40px;\n}";
|
|
74
74
|
styleInject(css_248z$1);
|
|
75
75
|
|
|
76
76
|
var ActionsList = function ActionsList(actions) {
|
|
@@ -142,9 +142,9 @@ var SearchComponent = function SearchComponent(props) {
|
|
|
142
142
|
}, React__default.createElement(material.Grid, {
|
|
143
143
|
item: true,
|
|
144
144
|
xs: props.actions ? 8 : 12,
|
|
145
|
-
md: props.actions && props.searchBar ? 4 : props.searchBar ?
|
|
145
|
+
md: props.actions && props.searchBar ? 4 : props.searchBar ? 8 : props.actions ? 6 : 12
|
|
146
146
|
}, React__default.createElement(material.Box, {
|
|
147
|
-
|
|
147
|
+
pr: 1,
|
|
148
148
|
className: (props.enableAfter ? 'main-background-color-after' : '') + " title"
|
|
149
149
|
}, props.title)), props.actions && React__default.createElement(material.Grid, {
|
|
150
150
|
item: true,
|
|
@@ -200,7 +200,7 @@ var SearchComponent = function SearchComponent(props) {
|
|
|
200
200
|
}, ActionsList(props.actions)))), (props.searchBar || props.filters || props.actions) && React__default.createElement(material.Grid, {
|
|
201
201
|
item: true,
|
|
202
202
|
xs: 12,
|
|
203
|
-
md: props.actions && props.searchBar ? 8 : props.actions ? 6 :
|
|
203
|
+
md: props.actions && props.searchBar ? 8 : props.actions ? 6 : 4
|
|
204
204
|
}, React__default.createElement(material.Box, {
|
|
205
205
|
display: "flex",
|
|
206
206
|
alignItems: "center"
|
|
@@ -234,7 +234,8 @@ var SearchComponent = function SearchComponent(props) {
|
|
|
234
234
|
my: 2
|
|
235
235
|
}, React__default.createElement(material.Grid, {
|
|
236
236
|
container: true,
|
|
237
|
-
spacing: 3
|
|
237
|
+
spacing: 3,
|
|
238
|
+
justifyContent: "end"
|
|
238
239
|
}, props.filters && props.filters.length > 0 && props.filters.map(function (filter, i) {
|
|
239
240
|
var _props$filtersSize, _props$filtersSize2;
|
|
240
241
|
|
|
@@ -263,7 +264,7 @@ var LinearProgressComponent = function LinearProgressComponent() {
|
|
|
263
264
|
}));
|
|
264
265
|
};
|
|
265
266
|
|
|
266
|
-
var css_248z$3 = ".main-wrapper-component {\n background-color: white;\n box-shadow: 0 1px 20px 0 rgba(69, 90, 100, 0.08);\n}\n.main-wrapper-component .main-background-color-after {\n position: relative;\n}\n.main-wrapper-component .main-background-color-after:after {\n content: \"\";\n position: absolute;\n left: -
|
|
267
|
+
var css_248z$3 = ".main-wrapper-component {\n background-color: white;\n box-shadow: 0 1px 20px 0 rgba(69, 90, 100, 0.08);\n}\n.main-wrapper-component .main-background-color-after {\n position: relative;\n}\n.main-wrapper-component .main-background-color-after:after {\n content: \"\";\n position: absolute;\n left: -16px;\n top: -1px;\n width: 3px;\n height: 20px;\n}\n.main-wrapper-component .wrapper-actions.min-action-width .btn-action .MuiButton-root {\n max-width: 100%;\n width: auto;\n}\n.main-wrapper-component .wrapper-actions .btn-action {\n cursor: pointer;\n}\n.main-wrapper-component .wrapper-actions .btn-action .MuiButton-root {\n width: max-content;\n}\n.main-wrapper-component .wrapper-actions .btn-action svg {\n font-size: 40px;\n}";
|
|
267
268
|
styleInject(css_248z$3);
|
|
268
269
|
|
|
269
270
|
var MainWrapperComponent = function MainWrapperComponent(props) {
|
|
@@ -305,7 +306,7 @@ var MainWrapperComponent = function MainWrapperComponent(props) {
|
|
|
305
306
|
var css_248z$4 = ".table-component .paper-container {\n box-shadow: none;\n background-color: transparent !important;\n}\n.table-component .paper-container .checkbox-cell .MuiCheckbox-root {\n padding: 0 !important;\n}\n.table-component .paper-container .checkbox-cell .MuiCheckbox-root:hover {\n background-color: transparent !important;\n}\n.table-component .paper-container .checkbox-cell .Mui-checked {\n color: rgba(0, 0, 0, 0.54) !important;\n}\n.table-component .paper-container .checkbox-cell .MuiCheckbox-indeterminate {\n color: #212529 !important;\n}\n.table-component .paper-container .table-container.with-scroll {\n max-height: 68vh;\n}\n.table-component .paper-container .table-container .table-column {\n font-weight: bold;\n font-size: calc(9pt + (11 - 9) * calc(100vw - 300px)/1300) !important;\n padding: 10px !important;\n border-top: 1px solid #e0e0e0;\n border-right: 1px solid #e0e0e0;\n border-bottom: 2px solid #e0e0e0;\n}\n.table-component .paper-container .table-container .table-column .table-header-cell {\n color: black;\n font-weight: bold;\n padding: 0px 10px 0px 10px !important;\n}\n.table-component .paper-container .table-container.table-simple {\n border-bottom: 1px solid black;\n}\n.table-component .paper-container .table-container.table-simple .table-column:first-child {\n border-radius: 5px 0 0 5px;\n}\n.table-component .paper-container .table-container.table-simple .table-column:last-child {\n border-right: none !important;\n border-radius: 0 5px 5px 0;\n}\n.table-component .paper-container .table-container.table-bordered .table-column {\n border-bottom: 1px solid #eaeaea !important;\n border-top: 1px solid #eaeaea !important;\n border-right: 1px solid #eaeaea !important;\n border-bottom: 1px solid #eaeaea !important;\n color: #7a7a7a !important;\n}\n.table-component .paper-container .table-container.table-bordered .table-column .table-header-cell {\n color: #7a7a7a !important;\n}\n.table-component .paper-container .table-container.table-bordered .table-column:first-child {\n border-left: 1px solid #eaeaea;\n}\n.table-component .paper-container .table-container.table-bordered .table-rows .table-cell {\n border-right: 1px solid #eaeaea;\n color: #505050 !important;\n}\n.table-component .paper-container .table-container.table-bordered .table-rows .table-cell:first-child {\n border-left: 1px solid #eaeaea;\n}\n.table-component .paper-container .table-container .table-rows.table-striped td {\n background-color: rgba(255, 255, 255, 0.95);\n}\n.table-component .paper-container .table-container .table-rows.row-click {\n cursor: pointer;\n}\n.table-component .paper-container .table-container .table-rows.row-click:hover {\n background-color: rgba(0, 0, 0, 0.04);\n}\n.table-component .paper-container .table-container .table-rows.row-click:hover.table-striped {\n background-color: transparent !important;\n}\n.table-component .paper-container .table-container .table-rows.row-click:hover.table-striped td {\n background-color: rgba(0, 0, 0, 0.04);\n}\n.table-component .paper-container .table-container .table-rows.Mui-selected {\n background-color: rgba(0, 0, 0, 0.04);\n}\n.table-component .paper-container .table-container .table-rows.Mui-selected.table-striped {\n background-color: transparent !important;\n}\n.table-component .paper-container .table-container .table-rows.Mui-selected.table-striped td {\n background-color: rgba(0, 0, 0, 0.04);\n}\n.table-component .paper-container .table-container .table-rows .Mui-selected {\n background-color: transparent !important;\n}\n.table-component .paper-container .table-container .table-rows .MuiTableCell-root {\n padding: 6px !important;\n overflow: hidden;\n}\n.table-component .paper-container .table-container .table-rows .img-table {\n width: 100%;\n height: 110px;\n}\n.table-component .paper-container .table-container .table-rows .img-table img {\n object-fit: contain;\n}\n.table-component .paper-container .table-container .table-rows .actions {\n float: right;\n}\n.table-component .paper-container .table-container .table-rows .btn-action {\n color: rgba(0, 0, 0, 0.54);\n display: inline-block;\n text-decoration: none;\n font-size: 1.6em !important;\n padding: 0px 7px;\n cursor: pointer;\n}\n.table-component .paper-container .table-container .table-rows .format-value {\n font-size: calc(9pt + (11 - 9) * calc(100vw - 300px)/1300) !important;\n}\n.table-component .paper-container .table-container .table-rows .format-value .MuiTypography-root {\n font-size: calc(9pt + (11 - 9) * calc(100vw - 300px)/1300);\n}\n.table-component .paper-container .MuiTable-root.loading {\n opacity: 0.5;\n}\n.table-component .paper-container .MuiTable-root.loading .MuiCircularProgress-root {\n width: 80px !important;\n height: 80px !important;\n position: absolute;\n left: 0;\n right: 0;\n top: 5px;\n margin: auto;\n color: grey;\n}\n.table-component .paper-container .MuiTablePagination-root {\n overflow: unset;\n}\n.table-component .paper-container .MuiTablePagination-root .MuiToolbar-root {\n justify-content: center !important;\n flex-wrap: wrap;\n padding: 0px !important;\n}\n.table-component .paper-container .MuiTablePagination-root .MuiTablePagination-spacer {\n flex: 0 !important;\n}\n.table-component .paper-container .MuiTablePagination-root.table-bordered {\n color: #7a7a7a !important;\n}\n.table-component .paper-container .MuiTablePagination-root.table-bordered .pagination {\n margin-left: auto;\n}\n.table-component .paper-container .MuiTablePagination-root.table-bordered .pagination li button {\n border-color: #dee2e6 !important;\n margin: 0px;\n border-radius: 0px !important;\n color: #7a7a7a !important;\n border-top: 1px solid;\n border-bottom: 1px solid;\n border-left: 0px solid;\n border-right: 1px solid;\n}\n.table-component .paper-container .MuiTablePagination-root.table-bordered .pagination li:nth-child(1) .MuiPaginationItem-root {\n border-radius: 5px 0 0 5px !important;\n border-left: 1px solid;\n}\n.table-component .paper-container .MuiTablePagination-root.table-bordered .pagination li:nth-last-child(1) .MuiPaginationItem-root {\n border-radius: 0 5px 5px 0 !important;\n}\n.table-component .paper-container .MuiTablePagination-root.table-bordered .pagination .MuiPaginationItem-icon {\n color: #7a7a7a !important;\n}\n.table-component .paper-container .MuiTablePagination-root.table-simple .pagination .MuiPaginationItem-page {\n background-color: #3f4d67;\n color: white !important;\n}\n.table-component .paper-container .MuiTablePagination-root.table-simple .pagination li:nth-child(2) .MuiPaginationItem-page {\n border-radius: 5px 0 0 5px !important;\n}\n.table-component .paper-container .MuiTablePagination-root.table-simple .pagination li:nth-last-child(2) .MuiPaginationItem-page {\n border-radius: 0 5px 5px 0 !important;\n}\n.table-component .paper-container .MuiTablePagination-root .pagination .MuiPaginationItem-page {\n border-radius: 0px;\n margin: 1px;\n}\n.table-component .paper-container .MuiTablePagination-root .pagination .MuiPaginationItem-page.Mui-selected {\n color: white !important;\n background-color: #3299C7;\n}\n.table-component .paper-container .MuiTablePagination-root .pagination li button {\n padding: 14px;\n}\n@media (max-width: 992px) {\n .table-component .paper-container .table-container {\n max-height: 60vh;\n border-top: 1px solid #cccccc;\n }\n .table-component .paper-container .table-container .MuiTable-root {\n border-collapse: collapse !important;\n }\n .table-component .paper-container .table-container .MuiTableHead-root {\n display: none !important;\n }\n .table-component .paper-container .table-container .table-rows {\n border-bottom: 2px solid #cccccc;\n }\n .table-component .paper-container .table-container .table-rows .MuiTableCell-root {\n width: auto;\n border-bottom: none !important;\n }\n .table-component .paper-container .table-container .table-rows .MuiTableCell-root .label-cell {\n font-size: 1rem;\n vertical-align: top;\n width: 50%;\n height: auto;\n }\n .table-component .paper-container .table-container .table-rows .MuiTableCell-root .label-cell + div {\n display: inline-block;\n }\n .table-component .paper-container .table-container .table-rows .table-cell {\n display: block !important;\n }\n .table-component .paper-container .table-container .table-rows .format-value {\n text-overflow: ellipsis;\n white-space: nowrap;\n overflow: hidden;\n width: 50%;\n max-width: 299px;\n }\n .table-component .MuiTablePagination-root.table-bordered .pagination {\n margin-left: 0;\n }\n}";
|
|
306
307
|
styleInject(css_248z$4);
|
|
307
308
|
|
|
308
|
-
var css_248z$5 = ".text-field-component .MuiFormLabel-root {\n color: #666666 !important;\n font-size: 1rem !important;\n transform: translate(0, 0.5px) scale(0.85);\n transform-origin: top left;\n text-overflow: initial !important;\n}\n.text-field-component .MuiFormLabel-root + .MuiInputBase-formControl {\n margin-top: 25px !important;\n}\n.text-field-component .MuiInputBase-root.no-border {\n border: none !important;\n padding: 0 !important;\n width: fit-content !important;\n}\n.text-field-component .MuiInputBase-root {\n color: #666666 !important;\n border: 1px solid grey;\n padding: 0.43rem 0.87rem;\n background-color: white !important;\n border-radius: 3px !important;\n}\n.text-field-component .MuiInputBase-root.Mui-error {\n border: 1px solid #F24726 !important;\n}\n.text-field-component .MuiInputBase-root:not(.Mui-disabled):hover {\n border: 1px solid grey;\n}\n.text-field-component .MuiInputBase-root.Mui-focused {\n border: 1px solid #3299C7;\n}\n.text-field-component .MuiInputBase-root .MuiInputBase-input {\n color: #666666 !important;\n background-color: white !important;\n}\n.text-field-component .MuiInputBase-root .MuiInputBase-input::placeholder {\n text-overflow: ellipsis !important;\n color: #666666 !important;\n opacity: 1;\n}\n.text-field-component .MuiInputBase-root .Mui-disabled {\n -webkit-text-fill-color: #666666 !important;\n}\n.text-field-component .MuiFormHelperText-root {\n padding: 0 !important;\n font-size: 0.85rem !important;\n color: #666666;\n}";
|
|
309
|
+
var css_248z$5 = ".text-field-component .MuiFormLabel-root {\n color: #666666 !important;\n font-size: 1rem !important;\n transform: translate(0, 0.5px) scale(0.85);\n transform-origin: top left;\n text-overflow: initial !important;\n}\n.text-field-component .MuiFormLabel-root + .MuiInputBase-formControl {\n margin-top: 25px !important;\n}\n.text-field-component .MuiInputBase-root.no-border {\n border: none !important;\n padding: 0 !important;\n width: fit-content !important;\n}\n.text-field-component .MuiInputBase-root {\n color: #666666 !important;\n border: 1px solid grey;\n padding: 0.43rem 0.87rem;\n background-color: white !important;\n border-radius: 3px !important;\n font-size: 14px !important;\n}\n.text-field-component .MuiInputBase-root.Mui-error {\n border: 1px solid #F24726 !important;\n}\n.text-field-component .MuiInputBase-root:not(.Mui-disabled):hover {\n border: 1px solid grey;\n}\n.text-field-component .MuiInputBase-root.Mui-focused {\n border: 1px solid #3299C7;\n}\n.text-field-component .MuiInputBase-root .MuiInputBase-input {\n color: #666666 !important;\n background-color: white !important;\n}\n.text-field-component .MuiInputBase-root .MuiInputBase-input::placeholder {\n text-overflow: ellipsis !important;\n color: #666666 !important;\n opacity: 1;\n}\n.text-field-component .MuiInputBase-root .Mui-disabled {\n -webkit-text-fill-color: #666666 !important;\n}\n.text-field-component .MuiFormHelperText-root {\n padding: 0 !important;\n font-size: 0.85rem !important;\n color: #666666;\n}";
|
|
309
310
|
styleInject(css_248z$5);
|
|
310
311
|
|
|
311
312
|
var TextFieldComponent = function TextFieldComponent(props) {
|
|
@@ -1594,7 +1595,7 @@ var AppHeader = function AppHeader(props) {
|
|
|
1594
1595
|
}, React__default.createElement(MenuIcon, null)), props.children));
|
|
1595
1596
|
};
|
|
1596
1597
|
|
|
1597
|
-
var css_248z$d = ".MuiButton-root {\n width: auto;\n padding: 0.8rem 1rem !important;\n text-transform: inherit !important;\n line-height: inherit !important;\n box-shadow: none !important;\n font-size:
|
|
1598
|
+
var css_248z$d = ".MuiButton-root {\n width: auto;\n padding: 0.8rem 1rem !important;\n text-transform: inherit !important;\n line-height: inherit !important;\n box-shadow: none !important;\n font-size: 14px !important;\n background-color: #3299C7;\n}\n.MuiButton-root.btn-login {\n width: 100%;\n}\n.MuiButton-root.btn-reverse-color {\n border: 1px solid #3299C7;\n color: #3299C7;\n background-color: white !important;\n}\n.MuiButton-root.btn-modal-cancel {\n background-color: #666666 !important;\n}\n.MuiButton-root.btn-modal-cancel.Mui-disabled {\n background-color: #666666c4 !important;\n color: #030303b4 !important;\n}\n.MuiButton-root:hover {\n box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12) !important;\n}\n.MuiButton-root .MuiCircularProgress-root {\n color: white;\n width: 17px !important;\n height: 17px !important;\n}\n.MuiButton-root .MuiButton-label .MuiCircularProgress-root {\n color: white;\n}\n.MuiButton-root .MuiButton-startIcon svg {\n font-size: 20px !important;\n}\n.MuiButton-root .MuiButton-endIcon svg {\n font-size: 20px !important;\n}";
|
|
1598
1599
|
styleInject(css_248z$d);
|
|
1599
1600
|
|
|
1600
1601
|
var ButtonComponent = function ButtonComponent(props) {
|
|
@@ -1671,7 +1672,7 @@ TextSimpleComponent.defaultProps = {
|
|
|
1671
1672
|
isFormLabel: true
|
|
1672
1673
|
};
|
|
1673
1674
|
|
|
1674
|
-
var css_248z$f = ".select-field .MuiFormLabel-root {\n color: #666666 !important;\n font-size: 1rem !important;\n transform: translate(0, 0.5px) scale(0.85);\n transform-origin: top left;\n text-overflow: initial !important;\n}\n.select-field .select {\n font-size: 1rem;\n}\n.select-field .select__menu {\n z-index: 3 !important;\n background-color: white;\n}\n.select-field .select__control {\n cursor: pointer;\n border: 1px solid grey;\n border-radius: 5px !important;\n padding: 0.
|
|
1675
|
+
var css_248z$f = ".select-field .MuiFormLabel-root {\n color: #666666 !important;\n font-size: 1rem !important;\n transform: translate(0, 0.5px) scale(0.85);\n transform-origin: top left;\n text-overflow: initial !important;\n}\n.select-field .select {\n font-size: 1rem;\n}\n.select-field .select__menu {\n z-index: 3 !important;\n background-color: white;\n}\n.select-field .select__control {\n cursor: pointer;\n border: 1px solid grey;\n border-radius: 5px !important;\n padding: 0.23rem 0.2rem;\n font-size: 14px;\n color: grey !important;\n background-color: transparent;\n}\n.select-field .select__option {\n cursor: pointer;\n color: #666666 !important;\n background-color: white !important;\n}\n.select-field .select__option--is-focused {\n background-color: rgba(0, 0, 0, 0.04) !important;\n color: #666666 !important;\n}\n.select-field .select__option--is-selected {\n color: white !important;\n}\n.select-field .select__indicator {\n color: grey !important;\n}\n.select-field .select__indicator:hover {\n color: black !important;\n}\n.select-field .select__placeholder {\n text-overflow: ellipsis !important;\n color: #666666 !important;\n opacity: 1;\n}\n.select-field .select__single-value {\n color: #666666 !important;\n}\n.select-field .select__multi-value__label {\n color: #666666 !important;\n font-size: 14px;\n}\n.select-field .select__control--is-focused {\n border-color: grey !important;\n box-shadow: none !important;\n}\n.select-field .helper-text {\n font-size: 0.85rem !important;\n padding: 0 !important;\n margin-top: 3px;\n line-height: 1.66;\n color: #666666 !important;\n letter-spacing: 0.03333em;\n}\n.select-field .has-error {\n color: #F24726 !important;\n}\n.select-field .has-error .select__control {\n border: 1px #F24726 solid !important;\n}\n.select-field .has-error .select__control--is-focused {\n border-color: #F24726 !important;\n box-shadow: 0 0 0 1px #F24726;\n}";
|
|
1675
1676
|
styleInject(css_248z$f);
|
|
1676
1677
|
|
|
1677
1678
|
var SelectField = function SelectField(props) {
|
|
@@ -3146,7 +3147,7 @@ var TabsComponent = function TabsComponent(props) {
|
|
|
3146
3147
|
}))));
|
|
3147
3148
|
};
|
|
3148
3149
|
|
|
3149
|
-
var css_248z$h = ".data-picker-component .MuiFormLabel-root {\n color: #666666 !important;\n font-size: 1rem !important;\n transform: translate(0, 0.5px) scale(0.85);\n transform-origin: top left;\n text-overflow: initial !important;\n}\n.data-picker-component .MuiFormLabel-root + .MuiInputBase-formControl {\n margin-top: 25px !important;\n}\n.data-picker-component .MuiInputBase-root.no-border {\n border: none !important;\n padding: 0 !important;\n width: fit-content !important;\n}\n.data-picker-component .MuiInputBase-root {\n color: #666666 !important;\n border: 1px solid grey;\n padding: 0.43rem 0.87rem;\n background-color: white !important;\n border-radius: 3px !important;\n}\n.data-picker-component .MuiInputBase-root.Mui-error {\n border: 1px solid #F24726 !important;\n}\n.data-picker-component .MuiInputBase-root:not(.Mui-disabled):hover {\n border: 1px solid grey;\n}\n.data-picker-component .MuiInputBase-root.Mui-focused {\n border: 1px solid #3299C7;\n}\n.data-picker-component .MuiInputBase-root .MuiInputBase-input {\n color: #666666 !important;\n background-color: white !important;\n}\n.data-picker-component .MuiInputBase-root .MuiInputBase-input::placeholder {\n text-overflow: ellipsis !important;\n color: #666666 !important;\n opacity: 1;\n}\n.data-picker-component .MuiInputBase-root .Mui-disabled {\n -webkit-text-fill-color: #666666 !important;\n}\n.data-picker-component .MuiFormHelperText-root {\n padding: 0 !important;\n font-size: 0.85rem !important;\n color: #666666;\n}";
|
|
3150
|
+
var css_248z$h = ".data-picker-component .MuiFormLabel-root {\n color: #666666 !important;\n font-size: 1rem !important;\n transform: translate(0, 0.5px) scale(0.85);\n transform-origin: top left;\n text-overflow: initial !important;\n}\n.data-picker-component .MuiFormLabel-root + .MuiInputBase-formControl {\n margin-top: 25px !important;\n}\n.data-picker-component .MuiInputBase-root.no-border {\n border: none !important;\n padding: 0 !important;\n width: fit-content !important;\n}\n.data-picker-component .MuiInputBase-root {\n color: #666666 !important;\n border: 1px solid grey;\n padding: 0.43rem 0.87rem;\n background-color: white !important;\n border-radius: 3px !important;\n font-size: 14px !important;\n}\n.data-picker-component .MuiInputBase-root.Mui-error {\n border: 1px solid #F24726 !important;\n}\n.data-picker-component .MuiInputBase-root:not(.Mui-disabled):hover {\n border: 1px solid grey;\n}\n.data-picker-component .MuiInputBase-root.Mui-focused {\n border: 1px solid #3299C7;\n}\n.data-picker-component .MuiInputBase-root .MuiInputBase-input {\n color: #666666 !important;\n background-color: white !important;\n}\n.data-picker-component .MuiInputBase-root .MuiInputBase-input::placeholder {\n text-overflow: ellipsis !important;\n color: #666666 !important;\n opacity: 1;\n}\n.data-picker-component .MuiInputBase-root .Mui-disabled {\n -webkit-text-fill-color: #666666 !important;\n}\n.data-picker-component .MuiFormHelperText-root {\n padding: 0 !important;\n font-size: 0.85rem !important;\n color: #666666;\n}";
|
|
3150
3151
|
styleInject(css_248z$h);
|
|
3151
3152
|
|
|
3152
3153
|
var DatePickerComponent = function DatePickerComponent(props) {
|