oa-componentbook 0.18.102 → 0.18.104
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/build/widgets/oa-detailWidget-card/MembershipDetailCard.js +8 -7
- package/build/widgets/oa-detailWidget-card/styles.js +1 -1
- package/build/widgets/oa-widget-card/MembershipCard.js +3 -1
- package/build/widgets/oa-widget-card/styles.js +1 -1
- package/build/widgets/oa-widget-document-upload/DocUploadWidget.js +16 -6
- package/build/widgets/oa-widget-document-upload/styles.js +1 -1
- package/package.json +1 -1
|
@@ -52,7 +52,13 @@ function MembershipDetailCard(_ref) {
|
|
|
52
52
|
color: primaryInfo.type === 'success' ? 'positive' : 'negative',
|
|
53
53
|
className: "type-b2-400"
|
|
54
54
|
}, primaryInfo.label)))), primaryPanel && /*#__PURE__*/_react.default.createElement("div", {
|
|
55
|
-
className: "primaryInfo"
|
|
55
|
+
className: "primaryInfo",
|
|
56
|
+
onClick: primaryPanel.name,
|
|
57
|
+
onKeyDown: e => {
|
|
58
|
+
if (e.key === 'Enter') primaryPanel.name();
|
|
59
|
+
},
|
|
60
|
+
tabIndex: 0,
|
|
61
|
+
role: "button"
|
|
56
62
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
57
63
|
className: "paraWithIcon"
|
|
58
64
|
}, /*#__PURE__*/_react.default.createElement(_CustomIcon.default, {
|
|
@@ -65,12 +71,7 @@ function MembershipDetailCard(_ref) {
|
|
|
65
71
|
color: "primary-background",
|
|
66
72
|
className: "type-link-button-500"
|
|
67
73
|
}, primaryPanel.label))), /*#__PURE__*/_react.default.createElement("div", {
|
|
68
|
-
|
|
69
|
-
onKeyDown: e => {
|
|
70
|
-
if (e.key === 'Enter') primaryPanel.name();
|
|
71
|
-
},
|
|
72
|
-
tabIndex: 0,
|
|
73
|
-
role: "button"
|
|
74
|
+
className: "displayFlex"
|
|
74
75
|
}, /*#__PURE__*/_react.default.createElement(_MaterialIcon.default, {
|
|
75
76
|
color: "primary-background",
|
|
76
77
|
icon: _ArrowForwardIos.default
|
|
@@ -8,5 +8,5 @@ var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
|
8
8
|
var _templateObject, _templateObject2;
|
|
9
9
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
10
10
|
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
11
|
-
const MembershipCardStyle = exports.MembershipCardStyle = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.flexGap div{\n padding: 0 0 8px;\n}\n.viewStatus button{\n padding: 16px 0 0;\n}\n.flexGap div:last-child{\n padding: 0;\n}\n.primaryInfo svg{\n cursor: pointer;\n}\np,h2,h3{\n margin: 0;\n}\n padding: 24px;\n background: var(--color-primary-background);\n border-radius: 12px;\n box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.14);\n position: relative;\n border: 1px solid var(--color-divider);\n margin: 0 0 24px;\n @media only screen and (max-width: 600px) {\n gap: 16px;\n padding: 16px;\n }\n .primaryInfo{\n display: flex;\n padding: 12px 8px;\n justify-content: space-between;\n background: var(--color-primary);\n border-radius: 8px;\n align-items: center;\n cursor: pointer;\n }\n .primaryInfo img{\n width: 24px;\n }\n .toolTipInfo .text-container svg {\n font-size: 16px !important;\n }\n .paraWithIcon{\n display: flex;\n gap: 8px;\n align-items: center;\n }\n .toolTipInfo{\n display: flex;\n background: var(--color-background-positive);\n padding: 12px;\n border-radius: 8px;\n flex-direction: column;\n justify-content: space-between;\n }\n .flexChangeBody{\n flex-direction: row;\n align-items: center;\n }\n\n .toolTipInfo .toolTip + div{\n display: flex;\n justify-content: end;\n }\n .error{\n background: var(--color-background-negative);\n }\n .error .toolTip svg{\n color: var(--color-negative);\n }\n .warning{\n background: var(--color-background-warning);\n }\n .warning .toolTip svg{\n color: var(--color-warning);\n }\n .success{\n background: var(--color-background-positive);\n }\n\n .success .toolTip svg{\n color: var(--color-positive);\n }\n .toolTip{\n display: flex;\n gap: 8px;\n }\n .cardHead{\n display: flex;\n justify-content: space-between;\n gap: 32px;\n flex-direction: column;\n }\n .imgBg{\n border-radius: 8px;\n background: #DEF1FB;\n min-width: 56px;\n height: 56px;\n display: flex;\n align-items: center;\n justify-content: center;\n }\n \n .ant-modal-footer{\n display: none;\n }\n .toolTip svg{\n margin:
|
|
11
|
+
const MembershipCardStyle = exports.MembershipCardStyle = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.flexGap div{\n padding: 0 0 8px;\n}\n.viewStatus button{\n padding: 16px 0 0;\n}\n.flexGap div:last-child{\n padding: 0;\n}\n.primaryInfo svg{\n cursor: pointer;\n}\np,h2,h3{\n margin: 0;\n}\n padding: 24px;\n background: var(--color-primary-background);\n border-radius: 12px;\n box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.14);\n position: relative;\n border: 1px solid var(--color-divider);\n margin: 0 0 24px;\n @media only screen and (max-width: 600px) {\n gap: 16px;\n padding: 16px;\n }\n .primaryInfo{\n display: flex;\n padding: 12px 8px;\n justify-content: space-between;\n background: var(--color-primary);\n border-radius: 8px;\n align-items: center;\n cursor: pointer;\n }\n .primaryInfo img{\n width: 24px;\n height: 24px;\n }\n .toolTipInfo .text-container svg {\n font-size: 16px !important;\n }\n .paraWithIcon{\n display: flex;\n gap: 8px;\n align-items: center;\n }\n .toolTipInfo{\n display: flex;\n background: var(--color-background-positive);\n padding: 12px;\n border-radius: 8px;\n flex-direction: column;\n justify-content: space-between;\n }\n .flexChangeBody{\n flex-direction: row;\n align-items: center;\n }\n\n .toolTipInfo .toolTip + div{\n display: flex;\n justify-content: end;\n }\n .error{\n background: var(--color-background-negative);\n }\n .error .toolTip svg{\n color: var(--color-negative);\n }\n .warning{\n background: var(--color-background-warning);\n }\n .warning .toolTip svg{\n color: var(--color-warning);\n }\n .success{\n background: var(--color-background-positive);\n }\n\n .success .toolTip svg{\n color: var(--color-positive);\n }\n .toolTip{\n display: flex;\n gap: 8px;\n }\n .cardHead{\n display: flex;\n justify-content: space-between;\n gap: 32px;\n flex-direction: column;\n }\n .imgBg{\n border-radius: 8px;\n background: #DEF1FB;\n min-width: 56px;\n height: 56px;\n display: flex;\n align-items: center;\n justify-content: center;\n }\n \n .ant-modal-footer{\n display: none;\n }\n .toolTip svg{\n margin: 0px 0 0;\n }\n .displayFlex{\n display: flex;\n }\n @media only screen and (max-width: 600px) {\n .toolTipInfo {\n flex-direction: column;\n gap: 0;\n align-items: unset;\n }\n .cardHead{\n gap: 24px;\n }\n .cardHead .titleHead > span{\n font-size: 16px;\n font-weight: 700;\n line-height: 24px;\n }\n }\n"])));
|
|
12
12
|
const CardBody = exports.CardBody = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\ndisplay: flex;\nflex-direction: column;\ngap: 32px;\n@media only screen and (max-width: 600px) {\n gap: 24px;\n}\n"])));
|
|
@@ -104,7 +104,9 @@ function MembershipCard(_ref) {
|
|
|
104
104
|
}), /*#__PURE__*/_react.default.createElement("label", null, /*#__PURE__*/_react.default.createElement(_Typography.default, {
|
|
105
105
|
color: "primary-background",
|
|
106
106
|
className: "type-button-500"
|
|
107
|
-
}, primaryPanel.label))), /*#__PURE__*/_react.default.createElement("div",
|
|
107
|
+
}, primaryPanel.label))), /*#__PURE__*/_react.default.createElement("div", {
|
|
108
|
+
className: "displayFlex"
|
|
109
|
+
}, /*#__PURE__*/_react.default.createElement(_MaterialIcon.default, {
|
|
108
110
|
color: "primary-background",
|
|
109
111
|
icon: _ArrowForwardIos.default
|
|
110
112
|
}))), alert.length > 0 && alert.map((item, i) => {
|
|
@@ -8,6 +8,6 @@ var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
|
8
8
|
var _templateObject, _templateObject2, _templateObject3;
|
|
9
9
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
10
10
|
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
11
|
-
const MembershipCardStyle = exports.MembershipCardStyle = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.flexGap div{\n padding: 0 0 8px;\n}\n.viewStatus button{\n padding: 16px 0 0;\n}\n.flexGap div:last-child{\n padding: 0;\n}\n.primaryInfo svg{\n cursor: pointer;\n}\np,h1, h2, h3, h4, h5, h6{\n margin: 0;\n}\n padding: 24px;\n background: var(--color-primary-background);\n border-radius: 12px;\n box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.14);\n position: relative;\n margin: 0 0 24px;\n border: 1px solid var(--color-divider);\n @media only screen and (max-width: 600px) {\n gap: 16px;\n padding: 24px 16px 16px;\n .cardHead p .type-b1-400{\n font-size: 14px;\n font-weight: 400;\n line-height: 20px;\n }\n .primary-info label .type-t2-700{\n font-size: 14px;\n font-weight: 500;\n line-height: 20px;\n }\n }\n .primaryInfo{\n display: flex;\n padding: 12px 8px;\n justify-content: space-between;\n background: var(--color-primary);\n border-radius: 8px;\n align-items: center;\n cursor: pointer;\n }\n .primaryInfo img{\n width: 24px;\n height: 24px;\n }\n .toolTipInfo .text-container svg {\n font-size: 16px !important;\n }\n .paraWithIcon{\n display: flex;\n gap: 8px;\n align-items: center;\n }\n .toolTipInfo{\n display: flex;\n background: var(--color-background-positive);\n padding: 12px;\n border-radius: 8px;\n flex-direction: column;\n justify-content: space-between;\n }\n .flexChangeBody{\n flex-direction: row;\n align-items: center;\n }\n\n .toolTipInfo .toolTip + div{\n display: flex;\n justify-content: end;\n }\n .error{\n background: var(--color-background-negative);\n }\n .error .toolTip svg{\n color: var(--color-negative);\n }\n .warning{\n background: var(--color-background-warning);\n }\n .warning .toolTip svg{\n color: var(--color-warning);\n }\n .success{\n background: var(--color-background-positive);\n }\n\n .success .toolTip svg{\n color: var(--color-positive);\n }\n .toolTip{\n display: flex;\n gap: 8px;\n }\n .cardHead{\n display: flex;\n justify-content: space-between;\n gap: 24px;\n }\n .imgBg{\n border-radius: 8px;\n background: #DEF1FB;\n min-width: 56px;\n height: 56px;\n display: flex;\n align-items: center;\n justify-content: center;\n }\n \n .ant-modal-footer{\n display: none;\n }\n .toolTip svg{\n margin:
|
|
11
|
+
const MembershipCardStyle = exports.MembershipCardStyle = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.flexGap div{\n padding: 0 0 8px;\n}\n.viewStatus button{\n padding: 16px 0 0;\n}\n.flexGap div:last-child{\n padding: 0;\n}\n.primaryInfo svg{\n cursor: pointer;\n}\np,h1, h2, h3, h4, h5, h6{\n margin: 0;\n}\n padding: 24px;\n background: var(--color-primary-background);\n border-radius: 12px;\n box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.14);\n position: relative;\n margin: 0 0 24px;\n border: 1px solid var(--color-divider);\n @media only screen and (max-width: 600px) {\n gap: 16px;\n padding: 24px 16px 16px;\n .cardHead p .type-b1-400{\n font-size: 14px;\n font-weight: 400;\n line-height: 20px;\n }\n .primary-info label .type-t2-700{\n font-size: 14px;\n font-weight: 500;\n line-height: 20px;\n }\n }\n .primaryInfo{\n display: flex;\n padding: 12px 8px;\n justify-content: space-between;\n background: var(--color-primary);\n border-radius: 8px;\n align-items: center;\n cursor: pointer;\n }\n .primaryInfo img{\n width: 24px;\n height: 24px;\n }\n .toolTipInfo .text-container svg {\n font-size: 16px !important;\n }\n .paraWithIcon{\n display: flex;\n gap: 8px;\n align-items: center;\n }\n .toolTipInfo{\n display: flex;\n background: var(--color-background-positive);\n padding: 12px;\n border-radius: 8px;\n flex-direction: column;\n justify-content: space-between;\n }\n .flexChangeBody{\n flex-direction: row;\n align-items: center;\n }\n\n .toolTipInfo .toolTip + div{\n display: flex;\n justify-content: end;\n }\n .error{\n background: var(--color-background-negative);\n }\n .error .toolTip svg{\n color: var(--color-negative);\n }\n .warning{\n background: var(--color-background-warning);\n }\n .warning .toolTip svg{\n color: var(--color-warning);\n }\n .success{\n background: var(--color-background-positive);\n }\n\n .success .toolTip svg{\n color: var(--color-positive);\n }\n .toolTip{\n display: flex;\n gap: 8px;\n }\n .cardHead{\n display: flex;\n justify-content: space-between;\n gap: 24px;\n }\n .imgBg{\n border-radius: 8px;\n background: #DEF1FB;\n min-width: 56px;\n height: 56px;\n display: flex;\n align-items: center;\n justify-content: center;\n }\n \n .ant-modal-footer{\n display: none;\n }\n .toolTip svg{\n margin: 0px 0 0;\n }\n .flexChangeBody{\n align-items: center !important;\n flex-direction: row !important;\n gap: 8px !important;\n }\n .flexChangeBody .text-container{\n white-space: nowrap;\n }\n .flexChangeBody .viewStatus button {\n padding: 0 !important;\n}\n.displayFlex{\n display: flex;\n}\n @media only screen and (max-width: 600px) {\n .type-b1-400{\n font-size: 14px;\n font-weight: 400;\n line-height: 20px;\n }\n .toolTipInfo {\n flex-direction: column;\n gap: 0;\n align-items: unset;\n }\n \n .cardHead .titleHead > span{\n font-size: 16px;\n font-weight: 700;\n line-height: 24px;\n }\n }\n"])));
|
|
12
12
|
const CardBody = exports.CardBody = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\ndisplay: flex;\nflex-direction: column;\ngap: 24px;\n@media only screen and (max-width: 600px) {\n gap: 16px;\n}\n"])));
|
|
13
13
|
const CardFooter = exports.CardFooter = _styledComponents.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\ndisplay: flex;\npadding: 16px 24px;\ngap: 24px;\nborder-top: 1px solid var(--color-divider);\nwidth: calc(100% + 48px);\nmargin: 0 0 0 -24px;\nposition: relative;\ntop: 24px;\njustify-content: end;\n@media only screen and (max-width: 600px) {\n padding: 16px 16px;\n width: calc(100% + 32px);\n margin: 0 0 0 -16px;\n top: 16px;\n\n .text-container .type-t2-700 {\n font-size: 14px;\n font-weight: 500;\n line-height: 20px;\n}\n.large {\n height: 36px;\n min-width: 100px;\n padding: 10px 16px;\n}\n}\n"])));
|
|
@@ -12,6 +12,7 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
|
12
12
|
var _icons = require("@ant-design/icons");
|
|
13
13
|
var _antd = require("antd");
|
|
14
14
|
var _RemoveRedEye = _interopRequireDefault(require("@material-ui/icons/RemoveRedEye"));
|
|
15
|
+
var _CustomInfo = _interopRequireDefault(require("../../components/oa-component-info/CustomInfo"));
|
|
15
16
|
var _MaterialIcon = _interopRequireDefault(require("../../components/oa-component-icons/MaterialIcon"));
|
|
16
17
|
var _Typography = _interopRequireDefault(require("../../components/oa-component-typography/Typography"));
|
|
17
18
|
var _ColorVariablesMap = _interopRequireDefault(require("../../global-css/ColorVariablesMap"));
|
|
@@ -41,7 +42,8 @@ function DocumentUpload(props) {
|
|
|
41
42
|
subText,
|
|
42
43
|
heading,
|
|
43
44
|
formName,
|
|
44
|
-
getPreview
|
|
45
|
+
getPreview,
|
|
46
|
+
infoText
|
|
45
47
|
} = props;
|
|
46
48
|
const [previewOpen, setPreviewOpen] = (0, _react.useState)(false);
|
|
47
49
|
const [previewImage, setPreviewImage] = (0, _react.useState)(null);
|
|
@@ -63,6 +65,9 @@ function DocumentUpload(props) {
|
|
|
63
65
|
}
|
|
64
66
|
return false;
|
|
65
67
|
}
|
|
68
|
+
(0, _react.useEffect)(() => {
|
|
69
|
+
setFileList(uploadedDocuments);
|
|
70
|
+
}, [uploadedDocuments === null || uploadedDocuments === void 0 ? void 0 : uploadedDocuments.length]);
|
|
66
71
|
const handlePreview = async file => {
|
|
67
72
|
if (file !== null && file !== void 0 && file.originFileObj) {
|
|
68
73
|
if (isImageFile(file === null || file === void 0 ? void 0 : file.name)) {
|
|
@@ -123,17 +128,20 @@ function DocumentUpload(props) {
|
|
|
123
128
|
marginTop: 8
|
|
124
129
|
}
|
|
125
130
|
}, "Upload"));
|
|
126
|
-
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_styles.MainStyleSec, null, /*#__PURE__*/_react.default.createElement(_styles.StyledSection, null, (heading || subText) && /*#__PURE__*/_react.default.createElement("div",
|
|
127
|
-
className: "
|
|
128
|
-
}, /*#__PURE__*/_react.default.createElement(_Typography.default, {
|
|
131
|
+
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_styles.MainStyleSec, null, /*#__PURE__*/_react.default.createElement(_styles.StyledSection, null, (heading || subText) && /*#__PURE__*/_react.default.createElement("div", {
|
|
132
|
+
className: "uploadSecPad"
|
|
133
|
+
}, heading && /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_Typography.default, {
|
|
129
134
|
color: "primary-content",
|
|
130
135
|
className: "type-t2-700"
|
|
131
136
|
}, heading, /*#__PURE__*/_react.default.createElement(_Typography.default, {
|
|
132
137
|
color: "negative"
|
|
133
|
-
}, "*"))), subText && /*#__PURE__*/_react.default.createElement(_Typography.default, {
|
|
138
|
+
}, "*"))), subText && /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_Typography.default, {
|
|
134
139
|
color: "secondary-content",
|
|
135
140
|
className: "type-b2-400"
|
|
136
|
-
}, subText)),
|
|
141
|
+
}, subText)), infoText && /*#__PURE__*/_react.default.createElement(_CustomInfo.default, {
|
|
142
|
+
color: "background-warning",
|
|
143
|
+
description: infoText
|
|
144
|
+
})), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_antd.ConfigProvider, {
|
|
137
145
|
theme: {
|
|
138
146
|
token: {
|
|
139
147
|
colorBorder: _ColorVariablesMap.default['--color-primary'],
|
|
@@ -180,6 +188,7 @@ DocumentUpload.propTypes = {
|
|
|
180
188
|
subText: _propTypes.default.string,
|
|
181
189
|
heading: _propTypes.default.string,
|
|
182
190
|
formName: _propTypes.default.string,
|
|
191
|
+
infoText: _propTypes.default.string,
|
|
183
192
|
getPreview: _propTypes.default.func // Define the getPreview prop type
|
|
184
193
|
};
|
|
185
194
|
DocumentUpload.defaultProps = {
|
|
@@ -188,6 +197,7 @@ DocumentUpload.defaultProps = {
|
|
|
188
197
|
subText: '',
|
|
189
198
|
heading: '',
|
|
190
199
|
formName: '',
|
|
200
|
+
infoText: '',
|
|
191
201
|
getPreview: () => {}
|
|
192
202
|
};
|
|
193
203
|
var _default = exports.default = DocumentUpload;
|
|
@@ -9,5 +9,5 @@ var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
|
9
9
|
var _templateObject, _templateObject2;
|
|
10
10
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
11
11
|
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
12
|
-
const MainStyleSec = exports.MainStyleSec = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n gap: 24px;\n .ant-upload-list-item-done{\n border: 1px solid var(--color-divider) !important;\n }\n .ant-upload-wrapper.ant-upload-picture-card-wrapper .ant-upload-list.ant-upload-list-picture-card .ant-upload-list-item:hover::before{\n opacity: 1 !important;\n }\n .ant-upload-wrapper.ant-upload-picture-card-wrapper .ant-upload-list.ant-upload-list-picture-card .ant-upload-list-item:hover::before ant-upload-list-item-actions > a\n {\n background: red !important;\n }\n .ant-upload-list-item-actions{\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 16px;\n }\n .ant-upload-wrapper.ant-upload-picture-card-wrapper .ant-upload-list.ant-upload-list-picture-card .ant-upload-list-item::before{\n background: transparent;\n opacity: 1;\n }\n.ant-upload-list-item-actions button{\n background: #000;\n border-radius: 50px;\n height: 24px !important;\n display: flex;\n align-items: center;\n}\n.ant-btn-text:not(:disabled):not(.ant-btn-disabled):hover{\n background: #000;\n}\n .ant-upload-list-item-actions a{\n background: #000;\n border-radius: 50px;\n height: 24px;\n display: flex;\n }\n .ant-upload-wrapper.ant-upload-picture-card-wrapper .ant-upload-list.ant-upload-list-picture-card .ant-upload-list-item-actions,.ant-upload-wrapper .ant-upload-list .ant-upload-list-item .ant-upload-list-item-actions .ant-upload-list-item-action {\n opacity: 1;\n }\n .ant-upload-wrapper .ant-upload-list.ant-upload-list-picture-card .ant-upload-list-item{\n opacity: 1 !important;\n }\n .ant-upload-wrapper.ant-upload-picture-card-wrapper .ant-upload-list.ant-upload-list-picture-card .ant-upload-list-item-actions .anticon-eye,.ant-upload-wrapper.ant-upload-picture-card-wrapper .ant-upload-list.ant-upload-list-picture-card .ant-upload-list-item-actions .anticon-delete{\n color: #fff;\n }\n"])));
|
|
12
|
+
const MainStyleSec = exports.MainStyleSec = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.uploadSecPad div{\n padding: 0 0 8px;\n}\n.uploadSecPad{\n width: 100%;\n}\n.uploadSecPad div:last-child{\n padding: 0;\n}\n display: flex;\n flex-direction: column;\n gap: 24px;\n .ant-upload-list-item-done{\n border: 1px solid var(--color-divider) !important;\n }\n .ant-upload-wrapper.ant-upload-picture-card-wrapper .ant-upload-list.ant-upload-list-picture-card .ant-upload-list-item:hover::before{\n opacity: 1 !important;\n }\n .ant-upload-wrapper.ant-upload-picture-card-wrapper .ant-upload-list.ant-upload-list-picture-card .ant-upload-list-item:hover::before ant-upload-list-item-actions > a\n {\n background: red !important;\n }\n .ant-upload-list-item-actions{\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 16px;\n }\n .ant-upload-wrapper.ant-upload-picture-card-wrapper .ant-upload-list.ant-upload-list-picture-card .ant-upload-list-item::before{\n background: transparent;\n opacity: 1;\n }\n.ant-upload-list-item-actions button{\n background: #000;\n border-radius: 50px;\n height: 24px !important;\n display: flex;\n align-items: center;\n}\n.ant-btn-text:not(:disabled):not(.ant-btn-disabled):hover{\n background: #000;\n}\n .ant-upload-list-item-actions a{\n background: #000;\n border-radius: 50px;\n height: 24px;\n display: flex;\n }\n .ant-upload-wrapper.ant-upload-picture-card-wrapper .ant-upload-list.ant-upload-list-picture-card .ant-upload-list-item-actions,.ant-upload-wrapper .ant-upload-list .ant-upload-list-item .ant-upload-list-item-actions .ant-upload-list-item-action {\n opacity: 1;\n }\n .ant-upload-wrapper .ant-upload-list.ant-upload-list-picture-card .ant-upload-list-item{\n opacity: 1 !important;\n }\n .ant-upload-wrapper.ant-upload-picture-card-wrapper .ant-upload-list.ant-upload-list-picture-card .ant-upload-list-item-actions .anticon-eye,.ant-upload-wrapper.ant-upload-picture-card-wrapper .ant-upload-list.ant-upload-list-picture-card .ant-upload-list-item-actions .anticon-delete{\n color: #fff;\n }\n"])));
|
|
13
13
|
const StyledSection = exports.StyledSection = _styledComponents.default.section(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n display: flex;\n gap: 16px;\n justify-content: space-between;\n h2{\n margin: 0;\n }\n .ant-upload-select, .ant-upload-wrapper, .ant-upload-wrapper, .ant-upload-wrapper.ant-upload-picture-card-wrapper .ant-upload-list.ant-upload-list-picture-card .ant-upload-list-item-container{\n width: 96px;\n height: 96px;\n margin: 0;\n }\n .ant-upload-wrapper.ant-upload-picture-card-wrapper .ant-upload.ant-upload-select{\n width: 96px !important;\n height: 96px !important;\n margin: 0;\n }\n"])));
|