oa-componentbook 1.0.1-stage.392 → 1.0.1-stage.394
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.
|
@@ -2030,7 +2030,7 @@ function GenricLayOut(_ref) {
|
|
|
2030
2030
|
}
|
|
2031
2031
|
console.log(state, "GenricLayOutstate");
|
|
2032
2032
|
return /*#__PURE__*/_react.default.createElement(_styles.OapageWithDataStyle, {
|
|
2033
|
-
marginBottom: infoPanel !== null && infoPanel !== void 0 && infoPanel.bottomMarginRequired ? "
|
|
2033
|
+
marginBottom: infoPanel !== null && infoPanel !== void 0 && infoPanel.bottomMarginRequired ? "18px" : "0",
|
|
2034
2034
|
className: (state === null || state === void 0 || (_state$misc22 = state.misc) === null || _state$misc22 === void 0 ? void 0 : _state$misc22.flow) === "hubAutomation" ? "hubAutomationContainer" : ""
|
|
2035
2035
|
}, /*#__PURE__*/_react.default.createElement(_styles.DrawerWithOutFooter, null), /*#__PURE__*/_react.default.createElement("div", {
|
|
2036
2036
|
className: "fullPageLayout"
|
|
@@ -2060,7 +2060,7 @@ function GenricLayOut(_ref) {
|
|
|
2060
2060
|
}))), /*#__PURE__*/_react.default.createElement("div", {
|
|
2061
2061
|
className: "headerRight"
|
|
2062
2062
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
2063
|
-
className: (sidebar === null || sidebar === void 0 || (_sidebar$mobileMenuIt = sidebar.mobileMenuItems) === null || _sidebar$mobileMenuIt === void 0 || (_sidebar$mobileMenuIt = _sidebar$mobileMenuIt.items) === null || _sidebar$mobileMenuIt === void 0 ? void 0 : _sidebar$mobileMenuIt.length) > 0 ?
|
|
2063
|
+
className: (sidebar === null || sidebar === void 0 || (_sidebar$mobileMenuIt = sidebar.mobileMenuItems) === null || _sidebar$mobileMenuIt === void 0 || (_sidebar$mobileMenuIt = _sidebar$mobileMenuIt.items) === null || _sidebar$mobileMenuIt === void 0 ? void 0 : _sidebar$mobileMenuIt.length) > 0 ? "hideProfileOnMobile" : ""
|
|
2064
2064
|
}, /*#__PURE__*/_react.default.createElement(_ProfileSection.default, {
|
|
2065
2065
|
profileData: profileData,
|
|
2066
2066
|
onProfileClick: () => {
|
|
@@ -2171,7 +2171,7 @@ function GenricLayOut(_ref) {
|
|
|
2171
2171
|
color: (infoPanel === null || infoPanel === void 0 || (_infoPanel$data3 = infoPanel.data) === null || _infoPanel$data3 === void 0 || (_infoPanel$data3 = _infoPanel$data3.iconConfig) === null || _infoPanel$data3 === void 0 ? void 0 : _infoPanel$data3.color) || "warning",
|
|
2172
2172
|
icon: infoPanel === null || infoPanel === void 0 || (_infoPanel$data4 = infoPanel.data) === null || _infoPanel$data4 === void 0 || (_infoPanel$data4 = _infoPanel$data4.iconConfig) === null || _infoPanel$data4 === void 0 ? void 0 : _infoPanel$data4.icon
|
|
2173
2173
|
}),
|
|
2174
|
-
position: (infoPanel === null || infoPanel === void 0 || (_infoPanel$data5 = infoPanel.data) === null || _infoPanel$data5 === void 0 || (_infoPanel$data5 = _infoPanel$data5.iconConfig) === null || _infoPanel$data5 === void 0 ? void 0 : _infoPanel$data5.position) ||
|
|
2174
|
+
position: (infoPanel === null || infoPanel === void 0 || (_infoPanel$data5 = infoPanel.data) === null || _infoPanel$data5 === void 0 || (_infoPanel$data5 = _infoPanel$data5.iconConfig) === null || _infoPanel$data5 === void 0 ? void 0 : _infoPanel$data5.position) || "left"
|
|
2175
2175
|
}
|
|
2176
2176
|
}))), Object.keys((state === null || state === void 0 || (_state$customDrawer3 = state.customDrawer) === null || _state$customDrawer3 === void 0 ? void 0 : _state$customDrawer3.appliedFilters) || {}).length > 0 && /*#__PURE__*/_react.default.createElement(_antd.Skeleton, {
|
|
2177
2177
|
loading: state === null || state === void 0 ? void 0 : state.isLoading,
|
|
@@ -16,7 +16,7 @@ function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(
|
|
|
16
16
|
const DrawerWithOutFooter = exports.DrawerWithOutFooter = (0, _styledComponents.createGlobalStyle)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.hubAutomationContainer .fullPageLayout {padding: 0 !important; background: #fff !important;}\n.hubAutomationContainer .fullPageLayout .oaRightLayouts{\n max-width: 1154px;\n margin: 24px auto;\n padding: 0 16px;\n box-shadow: none;}\n.oaDrawer div + div.ant-drawer-body{padding-bottom:100px !important;}\n\n.ant-checkbox-indeterminate .ant-checkbox-inner:after {\n background-color: #014fc5;\n}\n\n.ant-form-item .ant-form-item-label >label.ant-form-item-required::before {display:none;}\n.ant-form-item .ant-form-item-label >label.ant-form-item-required::after{ content: \"*\"; color: #DE350B; visibility: visible !important;}\n\n\n.cstUplaodWithFullWidth{margin-bottom:24px;}\n.cstUplaodWithFullWidth:last-child{margin-bottom:0;}\n.cstUplaodWithFullWidth .uploadDiv{width:100%;}\n.cstUplaodWithFullWidth .uploadDiv .ant-upload-list-item-container, .cstUplaodWithFullWidth .uploadDiv .ant-upload-wrapper .ant-upload-list-picture-card .ant-upload-select, .cstUplaodWithFullWidth .uploadDiv .ant-upload-wrapper.ant-upload-picture-card-wrapper .ant-upload-list.ant-upload-list-picture-card .ant-upload-list-item-container {\n width: 100%; \n height: 120px;\n}\n\n\n\n\n.oaDrawer .ant-form-item .ant-form-item-explain-error {\n color: #DE350B;\n font-size: 12px;\n margin: 4px 0 0 0;\n}\n.bottomSelectedSecion{background: #F6F6F6; padding: 16px 36px; position: fixed; bottom: 0; left: 0; right: 0;\nbox-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.14);\n display: flex; z-index: 2;\n align-items: center;\n justify-content: end;\n gap: 24px;}\n\n\n\n.listOfItems{ border-radius: 12px;\n border: 1px solid #E0E0E0;\n padding: 24px;\n margin: 24px 0 0 0;}\n modalSubheading{\n padding: 24px;\n margin: 24px 0 0 0;}\n\n.listOfItemsWithoutBorder{\n padding: 24px 0;\n margin: 24px 0 0 0;}\n\n modalSubheading{\n padding: 24px;\n margin: 24px 0 0 0;}\n\n\n\n\n.modalIconAndTextBox{display:flex; flex-direction:row; align-items: center; margin: 0 0 16px 0; gap:4px;}\n\n/* Select List Item Styles */\n.select-list-container {\n padding: 0;\n margin: 16px 0 0 0;\n}\n\n.select-list-item {\n display: flex;\n align-items: center;\n padding: 16px 0;\n cursor: pointer;\n transition: background-color 0.2s ease;\n border-bottom: 1px solid #f0f0f0;\n position: relative;\n}\n\n.select-list-item:hover {\n background-color: #f8f9fa;\n}\n\n.select-list-item:last-child {\n border-bottom: none;\n}\n\n.item-avatar {\n width: 40px;\n height: 40px;\n border-radius: 50%;\n background-color: #f0f0f0;\n display: flex;\n align-items: center;\n justify-content: center;\n margin-right: 12px;\n font-size: 20px;\n font-weight: 500;\n color: #333;\n flex-shrink: 0;\n}\n\n/* Different avatar colors for different items */\n.select-list-item:nth-child(1) .item-avatar {\n background-color: #717171;\n color: #fff;\n}\n\n.select-list-item:nth-child(2) .item-avatar {\n background-color: #014fc5;\n color: #fff;\n}\n\n.item-content {\n flex: 1;\n min-width: 0;\n}\n\n.item-arrow {\n flex-shrink: 0;\n margin-left: 8px;\n color: #014fc5;\n}\n"])));
|
|
17
17
|
const FormWidgetStyle = exports.FormWidgetStyle = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n .formBottomAction {\n position: absolute;\n bottom: 0px;\n background-color: rgb(249, 249, 249);\n box-shadow: rgba(0, 0, 0, 0.1) 0px -2px 8px;\n padding: 16px;\n display: flex;\n justify-content: flex-end;\n gap: 12px;\n z-index: 10;\n left: 0;\n right: 0;\n }\n\n .formBottomAction .ant-form-item {\n margin-bottom: 0px;\n }\n\n .searchErrorMsg {\n font-size: 12px;\n }\n .searchErrorMsg {\n font-size: 12px;\n }\n"])));
|
|
18
18
|
const TableDataStyle = exports.TableDataStyle = _styledComponents.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n .tableContainerList th,\n button {\n white-space: nowrap;\n }\n .tableContainerList th,\n button {\n white-space: nowrap;\n }\n"])));
|
|
19
|
-
const OapageWithDataStyle = exports.OapageWithDataStyle = _styledComponents.default.aside(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n .oaTopHeaderAndBtnSec {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n\n .headerContent {\n display: flex;\n align-items: center
|
|
19
|
+
const OapageWithDataStyle = exports.OapageWithDataStyle = _styledComponents.default.aside(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n .oaTopHeaderAndBtnSec {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n\n .headerContent {\n display: flex;\n align-items: flex-start; // Changed from 'center' to 'flex-start'\n justify-content: space-between;\n width: 100%;\n\n .headerLeft {\n flex: 1;\n }\n\n .headerRight {\n display: flex;\n align-items: flex-start; // Changed from 'center' to 'flex-start'\n justify-content: flex-end;\n }\n }\n }\n\n .fullPageLayout {\n display: flex;\n padding: 8px;\n background: #f6f6f6;\n }\n .ant-pagination {\n padding: 0 16px;\n justify-content: end;\n }\n .layoutHeadingPage {\n display: flex;\n gap: 8px;\n margin: 0 0 32px 0;\n flex-direction: column;\n justify-content: flex-start;\n }\n\n .topHadingWithIcon span {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n gap: 8px;\n }\n\n .subHadingText {\n margin: 0 0 0 36px;\n }\n\n .subHading1Text {\n margin: 0 0 ", " 40px;\n }\n\n .marginNone {\n margin: 0 !important;\n }\n\n .subHadingText > span {\n display: flex;\n flex-direction: row;\n gap: 4px;\n align-items: center;\n }\n\n .oaRightLayouts {\n width: 100%;\n min-height: calc(100vh - 16px);\n padding: 76px 48px;\n overflow-y: auto;\n border-radius: 16px;\n background: #fff;\n box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.14);\n }\n\n .oaheaderSearchAndFilter {\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin: 0 0 16px 0;\n gap: 16px;\n }\n\n .oaRightLayouts .iconAndTextSecBox {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: 8px;\n }\n .inLine {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: 4px;\n }\n\n .customeSelectDropdown {\n margin: 4px 0 0 8px;\n }\n\n .cardData {\n padding: 28px 0 48px 0;\n }\n\n .ant-carousel .slick-dots {\n position: static;\n margin: 20px auto 12px 0;\n }\n .ant-carousel .slick-dots li {\n width: 8px;\n height: 8px;\n }\n .ant-carousel .slick-dots li button {\n width: 8px;\n height: 8px;\n background: #cacaca;\n border-radius: 50%;\n opacity: 0.5;\n }\n .ant-carousel .slick-dots li.slick-active {\n width: 8px;\n height: 8px;\n }\n .ant-carousel .slick-dots li.slick-active button {\n width: 8px;\n height: 8px;\n opacity: 1;\n }\n .ant-carousel .slick-dots li::after {\n width: 8px;\n height: 8px;\n border-radius: 50%;\n opacity: 1;\n background: #717171;\n }\n\n .oaTabs .ant-tabs-nav {\n border-top: 1px solid #e0e0e0;\n border-left: 1px solid #e0e0e0;\n border-right: 1px solid #e0e0e0;\n padding: 12px 22px 0 22px;\n margin: 0 0 8px 0;\n background: #fff;\n border-radius: 4px 4px 0 0;\n }\n .ant-card-body {\n padding: 24px 16px !important;\n border-radius: 16px;\n background: #f6f6f6;\n }\n .cardContainer {\n display: flex;\n gap: 24px;\n }\n .selectAndSearch .noClear {\n border-radius: 0 4px 4px 0;\n width: 320px;\n }\n\n .searchErrorMsg {\n font-size: 12px;\n margin: 4px 0px 0px;\n color: #de350b;\n }\n .searchOnly {\n margin: 0px 0px 16px;\n position: relative;\n }\n .searchOnly .ant-input-affix-wrapper {\n border-radius: 4px;\n max-width: 420px;\n padding-left: 44px;\n }\n .searchOnly .cstSearchIcon {\n position: absolute;\n left: 16px;\n top: 14px;\n z-index: 2;\n }\n\n .selectAndSearch .ant-input-affix-wrapper {\n border-radius: 0 4px 4px 0;\n width: 320px;\n }\n\n .selectAndSearch {\n flex-shrink: 0;\n }\n\n .customeSelectDropdown .ant-select-selector {\n border: none;\n padding: 0;\n }\n .customeSelectDropdown .ant-select-selection-item > span {\n font-size: 24px;\n font-weight: 500;\n line-height: 32px;\n }\n\n .customeSelectDropdown .ant-select {\n margin: 0 0 0 32px;\n }\n\n .customeSelectDropdown .ant-select .ant-select-arrow {\n color: #014fc5;\n inset-inline-end: -6px;\n }\n\n .customeSelectDropdown .ant-select-selector {\n box-shadow: none !important;\n }\n .oaheaderButtons {\n display: flex;\n gap: 24px;\n align-items: center;\n position: relative;\n flex-grow: 1;\n justify-content: space-between;\n }\n\n .oaheaderButtons.single-child {\n justify-content: flex-end;\n }\n\n .oaheaderButtonsRight {\n display: flex;\n flex-direction: row;\n gap: 16px;\n }\n\n .oaheaderButtons .notifyDot {\n width: 12px;\n height: 12px;\n background: #de350b;\n position: absolute;\n top: -4px;\n right: -4px;\n border-radius: 50%;\n }\n\n @media only screen and (max-width: 600px) {\n .selectAndSearch .ant-input-affix-wrapper {\n width: calc(100% - 84px);\n }\n .oaheaderSearchAndFilter .dropDownSearchContainer {\n width: 100%;\n }\n\n .oaheaderSearchAndFilter {\n align-items: flex-end;\n flex-direction: column;\n gap: 16px;\n }\n\n .inLine {\n flex-direction: column;\n gap: 0;\n align-items: flex-start;\n }\n\n .subHadingText > span {\n flex-direction: column;\n align-items: flex-start;\n }\n\n .fullPageLayout {\n flex-direction: column;\n padding: 0;\n }\n .oaRightLayouts {\n padding: 16px;\n border-radius: 0;\n background: #fff;\n box-shadow: none;\n height: auto;\n background: #f6f6f6;\n }\n .oaTabs .ant-tabs-nav {\n margin: 0 0 28px 0;\n padding: 12px 0 0 0;\n }\n .layoutHeadingPage {\n margin: 0 0 16px 0;\n background: #fff;\n padding: 16px;\n border-radius: 8px;\n width: 100%;\n }\n .layoutHeadingAndSearch {\n background: #fff;\n padding: 20px 16px;\n margin: 0;\n width: 100%;\n border-radius: 8px;\n }\n \n /* Hide profile section on mobile when sidebar has profile icon */\n .hideProfileOnMobile {\n display: none !important;\n }\n }\n"])), _ref => {
|
|
20
20
|
let {
|
|
21
21
|
marginBottom
|
|
22
22
|
} = _ref;
|
|
@@ -29,7 +29,7 @@ const {
|
|
|
29
29
|
SubMenu
|
|
30
30
|
} = _antd.Menu;
|
|
31
31
|
function SidebarWidget(_ref) {
|
|
32
|
-
var _mobileMenuItems$item, _footer$item, _menuItems$items, _footer$item2, _footer$item3
|
|
32
|
+
var _mobileMenuItems$item, _footer$item, _menuItems$items, _footer$item2, _footer$item3, _footer$icons$;
|
|
33
33
|
let {
|
|
34
34
|
heading,
|
|
35
35
|
menuItems = [],
|
|
@@ -53,19 +53,23 @@ function SidebarWidget(_ref) {
|
|
|
53
53
|
|
|
54
54
|
// Find if current path is in any submenu
|
|
55
55
|
for (const item of items) {
|
|
56
|
-
if (item.children && item.children.length > 0) {
|
|
57
|
-
|
|
56
|
+
if (item !== null && item !== void 0 && item.children && (item === null || item === void 0 ? void 0 : item.children.length) > 0) {
|
|
57
|
+
var _item$children;
|
|
58
|
+
const hasCurrentPath = item === null || item === void 0 || (_item$children = item.children) === null || _item$children === void 0 ? void 0 : _item$children.some(child => (child === null || child === void 0 ? void 0 : child.path) === currentPath);
|
|
58
59
|
if (hasCurrentPath) {
|
|
59
|
-
setOpenKeys([item.key]);
|
|
60
|
+
setOpenKeys([item === null || item === void 0 ? void 0 : item.key]);
|
|
60
61
|
return;
|
|
61
62
|
}
|
|
62
63
|
}
|
|
63
64
|
}
|
|
64
65
|
|
|
65
66
|
// If no match found, open the first submenu by default
|
|
66
|
-
const firstSubmenu = items.find(item =>
|
|
67
|
+
const firstSubmenu = items === null || items === void 0 ? void 0 : items.find(item => {
|
|
68
|
+
var _item$children2;
|
|
69
|
+
return (item === null || item === void 0 ? void 0 : item.children) && (item === null || item === void 0 || (_item$children2 = item.children) === null || _item$children2 === void 0 ? void 0 : _item$children2.length) > 0;
|
|
70
|
+
});
|
|
67
71
|
if (firstSubmenu) {
|
|
68
|
-
setOpenKeys([firstSubmenu.key]);
|
|
72
|
+
setOpenKeys([firstSubmenu === null || firstSubmenu === void 0 ? void 0 : firstSubmenu.key]);
|
|
69
73
|
}
|
|
70
74
|
}, [location.pathname, menuItems]);
|
|
71
75
|
|
|
@@ -84,17 +88,19 @@ function SidebarWidget(_ref) {
|
|
|
84
88
|
|
|
85
89
|
// Simple render function for menu items
|
|
86
90
|
const renderMenuItem = item => {
|
|
87
|
-
|
|
91
|
+
var _item$children3;
|
|
92
|
+
if (item !== null && item !== void 0 && item.children && (item === null || item === void 0 || (_item$children3 = item.children) === null || _item$children3 === void 0 ? void 0 : _item$children3.length) > 0) {
|
|
93
|
+
var _item$children4;
|
|
88
94
|
return /*#__PURE__*/_react.default.createElement(SubMenu, {
|
|
89
95
|
key: item.key,
|
|
90
|
-
title: /*#__PURE__*/_react.default.createElement("span", null, /*#__PURE__*/_react.default.createElement(_MaterialIcon.default, item === null || item === void 0 ? void 0 : item.iconConfig), item.label)
|
|
91
|
-
}, item.children.map(child => /*#__PURE__*/_react.default.createElement(_antd.Menu.Item, {
|
|
92
|
-
key: child.path
|
|
93
|
-
}, child.label)));
|
|
96
|
+
title: /*#__PURE__*/_react.default.createElement("span", null, /*#__PURE__*/_react.default.createElement(_MaterialIcon.default, item === null || item === void 0 ? void 0 : item.iconConfig), item === null || item === void 0 ? void 0 : item.label)
|
|
97
|
+
}, item === null || item === void 0 || (_item$children4 = item.children) === null || _item$children4 === void 0 ? void 0 : _item$children4.map(child => /*#__PURE__*/_react.default.createElement(_antd.Menu.Item, {
|
|
98
|
+
key: child === null || child === void 0 ? void 0 : child.path
|
|
99
|
+
}, child === null || child === void 0 ? void 0 : child.label)));
|
|
94
100
|
} else {
|
|
95
101
|
return /*#__PURE__*/_react.default.createElement(_antd.Menu.Item, {
|
|
96
102
|
key: item.path
|
|
97
|
-
}, /*#__PURE__*/_react.default.createElement(_MaterialIcon.default, item === null || item === void 0 ? void 0 : item.iconConfig), item.label);
|
|
103
|
+
}, /*#__PURE__*/_react.default.createElement(_MaterialIcon.default, item === null || item === void 0 ? void 0 : item.iconConfig), item === null || item === void 0 ? void 0 : item.label);
|
|
98
104
|
}
|
|
99
105
|
};
|
|
100
106
|
return /*#__PURE__*/_react.default.createElement(_styles.default, null, /*#__PURE__*/_react.default.createElement("div", {
|
|
@@ -151,6 +157,17 @@ function SidebarWidget(_ref) {
|
|
|
151
157
|
}, /*#__PURE__*/_react.default.createElement(_MaterialIcon.default, footer === null || footer === void 0 || (_footer$item2 = footer.item) === null || _footer$item2 === void 0 ? void 0 : _footer$item2.iconConfig), /*#__PURE__*/_react.default.createElement(_Typography.default, {
|
|
152
158
|
color: "negative",
|
|
153
159
|
typography: "type-button-500"
|
|
154
|
-
}, footer === null || footer === void 0 || (_footer$item3 = footer.item) === null || _footer$item3 === void 0 ? void 0 : _footer$item3.label)))
|
|
160
|
+
}, footer === null || footer === void 0 || (_footer$item3 = footer.item) === null || _footer$item3 === void 0 ? void 0 : _footer$item3.label)), (footer === null || footer === void 0 ? void 0 : footer.icons) && footer.icons.length > 0 && /*#__PURE__*/_react.default.createElement("div", {
|
|
161
|
+
className: "footerLogoSection"
|
|
162
|
+
}, /*#__PURE__*/_react.default.createElement(_Typography.default, {
|
|
163
|
+
color: "secondary-content",
|
|
164
|
+
typography: "type-b2-400"
|
|
165
|
+
}, "Powered by"), /*#__PURE__*/_react.default.createElement("div", {
|
|
166
|
+
className: "footerLogoContainer"
|
|
167
|
+
}, /*#__PURE__*/_react.default.createElement(_antd.Image, {
|
|
168
|
+
src: (_footer$icons$ = footer.icons[0]) === null || _footer$icons$ === void 0 ? void 0 : _footer$icons$.icon,
|
|
169
|
+
preview: false,
|
|
170
|
+
className: "footerLogo"
|
|
171
|
+
})))))));
|
|
155
172
|
}
|
|
156
173
|
var _default = exports.default = (0, _reactRouterDom.withRouter)(SidebarWidget);
|
|
@@ -8,6 +8,6 @@ var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
|
8
8
|
var _templateObject, _templateObject2; // styles.js
|
|
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 OalayoutStyle = _styledComponents.default.aside(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n .oaLeftLayouts {\n padding: 24px 8px;\n background: #f6f6f6;\n }\n\n .logoContainer {\n padding: 0 12px 68px;\n display: flex;\n justify-content: space-between;\n }\n\n .logoutDiv {\n display: flex; flex-direction: row; margin:
|
|
11
|
+
const OalayoutStyle = _styledComponents.default.aside(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n .oaLeftLayouts {\n padding: 24px 8px;\n background: #f6f6f6;\n }\n\n .logoContainer {\n padding: 0 12px 68px;\n display: flex;\n justify-content: space-between;\n }\n\n .logoutDiv {\n display: flex; flex-direction: row; margin: 48px 0 0 16px; gap: 8px; cursor: pointer;\n }\n\n .leftLogoSec {\n display: flex;\n flex-direction: row;\n gap: 8px;\n }\n\n .logoContainer em {\n width: 1px;\n background: #e0e0e0;\n }\n .logoContainer img {\n height: 32px;\n }\n .ant-layout-sider-light,\n .ant-menu-light {\n background: transparent;\n }\n\n /* Regular menu items */\n .ant-menu-item {\n padding: 16px;\n border-radius: 50px;\n margin: 0 0 8px;\n height: auto;\n line-height: normal;\n border-radius: 999px;\n border: 1px solid #e0e0e0;\n background: #fff;\n }\n\n /* SubMenu title styling - this is the parent item - same size as regular items */\n .ant-menu-submenu-title {\n padding: 16px;\n border-radius: 50px;\n margin: 0 0 8px;\n height: auto;\n line-height: normal;\n border-radius: 999px;\n border: 1px solid #e0e0e0;\n background: #fff;\n display: flex;\n align-items: center;\n }\n\n /* SubMenu items - these are the children - should be plain text */\n .ant-menu-submenu .ant-menu-item {\n margin: 8px 0;\n padding: 8px 24px;\n border-radius: 0;\n background: transparent;\n border: none;\n margin-left: 16px;\n color: #666;\n font-size: 14px;\n height: auto;\n line-height: 1.4;\n }\n\n /* Add extra spacing for first nested item */\n .ant-menu-submenu .ant-menu-item:first-child {\n margin-top: 12px;\n }\n\n /* Add extra spacing for last nested item */\n .ant-menu-submenu .ant-menu-item:last-child {\n margin-bottom: 12px;\n }\n\n /* REMOVED: Open SubMenu styling - this was making ALL open submenus blue */\n /* .ant-menu-submenu-open > .ant-menu-submenu-title {\n background: #014fc5;\n color: #fff;\n padding: 24px; \n } */\n\n /* NEW: Only make parent blue when it contains a selected child */\n .ant-menu-submenu-open:has(.ant-menu-item-selected) > .ant-menu-submenu-title {\n background: #014fc5;\n color: #fff;\n padding: 24px;\n }\n\n /* Fallback for browsers that don't support :has() */\n .ant-menu-submenu-open > .ant-menu-submenu-title {\n background: #fff;\n color: #000;\n padding: 24px;\n }\n\n /* SubMenu title content */\n .ant-menu-item .ant-menu-title-content {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: 8px;\n }\n \n .ant-menu-submenu-title .ant-menu-title-content {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: 8px;\n }\n\n /* Add styling to span elements inside SubMenu title content */\n .ant-menu-submenu-title .ant-menu-title-content span {\n display: flex;\n gap: 8px;\n align-items: center;\n }\n\n /* Selected states */\n .ant-menu-item-active {\n background: #014fc5;\n color: #fff;\n }\n .ant-menu-item-selected {\n background: #014fc5;\n color: #fff;\n }\n\n /* SubMenu selected item - should be bold black when selected */\n .ant-menu-submenu .ant-menu-item-selected {\n background: transparent;\n color: #000;\n font-weight: bold;\n border-radius: 0;\n }\n\n /* Hover effects */\n .ant-menu-light:not(.ant-menu-horizontal)\n .ant-menu-item:not(.ant-menu-item-selected):hover,\n :where(.css-dev-only-do-not-override-zcfrx9).ant-menu-light\n > .ant-menu:not(.ant-menu-horizontal)\n .ant-menu-item:not(.ant-menu-item-selected):hover {\n background: #014fc5;\n color: #fff;\n }\n\n /* SubMenu title hover - should be blue on hover */\n .ant-menu-submenu-title:hover {\n background: #014fc5 !important;\n color: #fff !important;\n padding: 24px !important;\n }\n\n /* Nested items hover - should be bold black when hovered */\n .ant-menu-submenu .ant-menu-item:hover {\n background: transparent !important;\n color: #000 !important;\n font-weight: bold !important;\n border-radius: 0;\n }\n\n /* Make Orders parent blue when hovering over submenu items */\n .ant-menu-submenu:hover .ant-menu-submenu-title {\n background: #014fc5 !important;\n color: #fff !important;\n padding: 24px !important;\n }\n\n .ant-menu-light.ant-menu-root.ant-menu-inline {\n border: none;\n }\n\n /* SubMenu arrow styling */\n .ant-menu-submenu-arrow {\n color: inherit;\n }\n\n /* SubMenu content area */\n .ant-menu-sub {\n background: transparent !important;\n padding: 8px 0;\n }\n\n /* Remove default SubMenu styling */\n .ant-menu-submenu .ant-menu-sub {\n background: transparent !important;\n box-shadow: none !important;\n }\n\n .notShowInDesktop {\n display: none;\n }\n\n .footerLogoSection {\n margin-top: 64px;\n padding: 0 16px;\n display: flex;\n flex-direction: column;\n gap: 12px;\n }\n\n .footerLogoContainer {\n display: flex;\n align-items: center;\n }\n\n .footerLogo {\n height: 32px; /* Adjust size as needed */\n }\n\n @media only screen and (max-width: 600px) {\n .oaLeftLayouts {\n background: #fff;\n padding: 16px;\n }\n .logoContainer {\n padding: 0;\n align-items: center;\n }\n\n .notShowInMobile {\n display: none;\n }\n .notShowInDesktop {\n display: flex;\n }\n\n .oaLeftLayouts .ant-layout-sider {\n max-width: none !important;\n width: 100% !important;\n }\n p.ant-dropdown-trigger {\n margin-bottom: 0;\n }\n }\n"])));
|
|
12
12
|
const ProfileIcon = exports.ProfileIcon = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n width: 36px;\n height: 36px;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 14px;\n font-weight: 500;\n cursor: pointer;\n transition: all 0.2s ease;\n box-shadow: 0 0 0 2px #ffffff, 0 0 0 4px var(--color-primary);\n\n &:hover {\n transform: scale(1.05);\n }\n"])));
|
|
13
13
|
var _default = exports.default = OalayoutStyle;
|