From e69633c1e6e57a45e8f92243a7c5b23dd5af0508 Mon Sep 17 00:00:00 2001 From: LZS911 <42765421+LZS911@users.noreply.github.com> Date: Mon, 23 Oct 2023 19:42:22 +0800 Subject: [PATCH 1/2] Revert "Revert "fix: remove gap attribute"" --- packages/base/src/page/Login/style.ts | 2 +- .../src/page/Nav/SideMenu/GlobalSetting.tsx | 24 ++++++++++++++----- .../Nav/SideMenu/ProjectSelector/style.ts | 4 +++- .../src/page/Nav/SideMenu/UserNavigate.tsx | 12 +++++++--- packages/base/src/page/Nav/SideMenu/style.ts | 15 ++++++++---- .../ProjectSelectorModal.tsx | 2 +- .../Detail/NotFoundRecentlyProject/style.ts | 5 +++- .../ActiontechTable/components/style.ts | 6 ++--- .../lib/components/BasicSelect/style.ts | 6 ----- .../lib/components/CustomSelect/style.ts | 12 ++++++---- .../sqle/src/page/Home/CommonTable/style.ts | 10 ++++++-- .../sqle/src/page/Order/AuditDetail/index.tsx | 1 + .../sqle/src/page/Order/AuditDetail/style.ts | 2 -- packages/sqle/src/page/Order/List/index.tsx | 5 +++- .../UpdateWorkflowTemplate/style.ts | 8 ++++--- .../components/StepCard/style.ts | 1 - 16 files changed, 75 insertions(+), 40 deletions(-) diff --git a/packages/base/src/page/Login/style.ts b/packages/base/src/page/Login/style.ts index ff9c1a5e1..8dae1dcdf 100644 --- a/packages/base/src/page/Login/style.ts +++ b/packages/base/src/page/Login/style.ts @@ -53,7 +53,6 @@ export const LoginPageRightStyleWrapper = styled('div')` display: flex; height: 100%; align-items: center; - gap: 10px; flex-shrink: 0; align-self: stretch; @@ -69,6 +68,7 @@ export const LoginPageRightStyleWrapper = styled('div')` .label-primary { color: ${({ theme }) => theme.baseTheme.sideMenu.title.color[0]}; + margin-right: 10px; } .label-base { diff --git a/packages/base/src/page/Nav/SideMenu/GlobalSetting.tsx b/packages/base/src/page/Nav/SideMenu/GlobalSetting.tsx index 658fbdaa5..d08dcc2b7 100644 --- a/packages/base/src/page/Nav/SideMenu/GlobalSetting.tsx +++ b/packages/base/src/page/Nav/SideMenu/GlobalSetting.tsx @@ -51,7 +51,9 @@ const GlobalSetting: React.FC<{ onClick={() => handleClickItem(`/sqle/rule`)} > - {t('dmsMenu.globalSettings.viewRule')} + + {t('dmsMenu.globalSettings.viewRule')} + {/* FITRUE_isSQLE */} @@ -63,7 +65,9 @@ const GlobalSetting: React.FC<{ onClick={() => handleClickItem('/userCenter')} > - {t('dmsMenu.globalSettings.userCenter')} + + {t('dmsMenu.globalSettings.userCenter')} + {/* IFTRUE_isSQLE */}
handleClickItem('/sqle/reportStatistics')} > - {t('dmsMenu.globalSettings.reportStatistics')} + + {t('dmsMenu.globalSettings.reportStatistics')} +
handleClickItem(`/sqle/rule`)} > - {t('dmsMenu.globalSettings.viewRule')} + + {t('dmsMenu.globalSettings.viewRule')} +
handleClickItem(`/sqle/ruleManager`)} > - {t('dmsMenu.globalSettings.ruleManage')} + + {t('dmsMenu.globalSettings.ruleManage')} +
{/* FITRUE_isSQLE */}
handleClickItem(`/system`)} > - {t('dmsMenu.globalSettings.system')} + + {t('dmsMenu.globalSettings.system')} +
diff --git a/packages/base/src/page/Nav/SideMenu/ProjectSelector/style.ts b/packages/base/src/page/Nav/SideMenu/ProjectSelector/style.ts index 978f3da72..3cd8c4074 100644 --- a/packages/base/src/page/Nav/SideMenu/ProjectSelector/style.ts +++ b/packages/base/src/page/Nav/SideMenu/ProjectSelector/style.ts @@ -4,6 +4,8 @@ import { styled } from '@mui/material/styles'; export const ProjectSelectorStyleWrapper = styled(CustomSelect)` &.${ANTD_PREFIX_STR}-select-lg.${ANTD_PREFIX_STR}-select.custom-project-selector { + margin: 4px 0; + .${ANTD_PREFIX_STR}-select-selector { font-size: 13px; font-weight: 500; @@ -36,7 +38,6 @@ export const ProjectSelectorStyleWrapper = styled(CustomSelect)` export const ProjectSelectorLabelStyleWrapper = styled('div')` display: flex; align-items: center; - gap: 8px; &:hover { .project-flag-icon { @@ -52,6 +53,7 @@ export const ProjectSelectorLabelStyleWrapper = styled('div')` } .project-selector-label-text { + margin-left: 8px; color: ${({ theme }) => theme.baseTheme.sideMenu.projectSelector.dropdown.labelColor}; } diff --git a/packages/base/src/page/Nav/SideMenu/UserNavigate.tsx b/packages/base/src/page/Nav/SideMenu/UserNavigate.tsx index 7cafe9278..553f9c650 100644 --- a/packages/base/src/page/Nav/SideMenu/UserNavigate.tsx +++ b/packages/base/src/page/Nav/SideMenu/UserNavigate.tsx @@ -38,7 +38,9 @@ const UserNavigate: React.FC<{ }} > - {t('dmsMenu.userNavigate.account')} + + {t('dmsMenu.userNavigate.account')} +
- {t('dmsMenu.userNavigate.viewVersion')} + + {t('dmsMenu.userNavigate.viewVersion')} +
- {t('dmsMenu.userNavigate.logout')} + + {t('dmsMenu.userNavigate.logout')} +
diff --git a/packages/base/src/page/Nav/SideMenu/style.ts b/packages/base/src/page/Nav/SideMenu/style.ts index 25f220f21..676d1c8cb 100644 --- a/packages/base/src/page/Nav/SideMenu/style.ts +++ b/packages/base/src/page/Nav/SideMenu/style.ts @@ -28,14 +28,12 @@ export const SideMenuStyleWrapper = styled('div')` display: flex; flex-direction: column; align-items: flex-start; - gap: 4px; .title { display: flex; height: 60px; padding: 8px; align-items: center; - gap: 10px; flex-shrink: 0; align-self: stretch; cursor: pointer; @@ -52,6 +50,7 @@ export const SideMenuStyleWrapper = styled('div')` .label-primary { color: ${({ theme }) => theme.baseTheme.sideMenu.title.color[0]}; + margin-right: 10px; } .label-base { @@ -244,7 +243,6 @@ export const PopoverInnerStyleWrapper = styled('div')` display: flex; height: 32px; align-items: center; - gap: 8px; align-self: stretch; border-radius: 4px; font-size: 13px; @@ -258,6 +256,10 @@ export const PopoverInnerStyleWrapper = styled('div')` background-color: ${({ theme }) => theme.baseTheme.sideMenu.userNavigate.content.hoverBackgroundColor}; } + + &-text { + margin-left: 8px; + } } } @@ -281,7 +283,6 @@ export const PopoverInnerStyleWrapper = styled('div')` padding: 3px; justify-content: center; align-items: flex-start; - gap: 4px; border-radius: 100px; border: ${({ theme }) => theme.baseTheme.sideMenu.userNavigate.footer.iconWrapper.border}; @@ -289,13 +290,16 @@ export const PopoverInnerStyleWrapper = styled('div')` theme.baseTheme.sideMenu.userNavigate.footer.iconWrapper .backgroundColor}; + &-wrapper:first-of-type { + margin-right: 4px; + } + &-wrapper { display: flex; width: 26px; height: 26px; justify-content: center; align-items: center; - gap: 10px; cursor: pointer; color: ${({ theme }) => theme.baseTheme.sideMenu.userNavigate.footer.iconWrapper.color}; @@ -327,6 +331,7 @@ export const CEModeProjectWrapperStyleWrapper = styled('div')` border: 1px solid ${({ theme }) => theme.sharedTheme.uiToken.colorBorderSecondary}; border-radius: 4px; + margin: 4px 0; .project-flag-icon { margin-right: 8px; diff --git a/packages/base/src/page/Project/Detail/NotFoundRecentlyProject/ProjectSelectorModal.tsx b/packages/base/src/page/Project/Detail/NotFoundRecentlyProject/ProjectSelectorModal.tsx index ecf1b7a85..2c9092c9e 100644 --- a/packages/base/src/page/Project/Detail/NotFoundRecentlyProject/ProjectSelectorModal.tsx +++ b/packages/base/src/page/Project/Detail/NotFoundRecentlyProject/ProjectSelectorModal.tsx @@ -47,7 +47,7 @@ const ProjectSelectorModal: React.FC = ({ } > - {t('dmsProject.detail.modalTips')} + {t('dmsProject.detail.modalTips')} )` } } `; - -export const BasicSelectOptionLabelStyleWrapper = styled('span')` - display: flex; - gap: 8px; -`; -export const BasicSelectPlaceholderStyleWrapper = styled('span')``; diff --git a/packages/shared/lib/components/CustomSelect/style.ts b/packages/shared/lib/components/CustomSelect/style.ts index b54b1cb5b..14fe25255 100644 --- a/packages/shared/lib/components/CustomSelect/style.ts +++ b/packages/shared/lib/components/CustomSelect/style.ts @@ -25,7 +25,10 @@ export const CustomSelectStyleWrapper = styled(BasicSelect)` .custom-select-placeholder { display: inline-flex; align-items: center; - gap: 8px; + + &-value { + margin-left: 8px; + } } } @@ -33,7 +36,6 @@ export const CustomSelectStyleWrapper = styled(BasicSelect)` .custom-select-option-content { display: inline-flex; align-items: center; - gap: 8px; max-width: 100%; } } @@ -56,7 +58,9 @@ export const CustomSelectStyleWrapper = styled(BasicSelect)` padding-inline-end: 24px; .${ANTD_PREFIX_STR}-select-selection-overflow { - gap: 2px; + &-item:not(:first-of-type) { + margin-left: 2px; + } } } } @@ -79,9 +83,9 @@ export const CustomSelectStyleWrapper = styled(BasicSelect)` export const CustomSelectOptionLabelStyleWrapper = styled('span')` display: flex; - gap: 8px; .custom-select-option-content-prefix { + margin-right: 8px; color: ${({ theme }) => theme.sharedTheme.components.customSelect.content.prefixColor}; } diff --git a/packages/sqle/src/page/Home/CommonTable/style.ts b/packages/sqle/src/page/Home/CommonTable/style.ts index dbccb53a4..0d168a133 100644 --- a/packages/sqle/src/page/Home/CommonTable/style.ts +++ b/packages/sqle/src/page/Home/CommonTable/style.ts @@ -2,17 +2,23 @@ import { styled } from '@mui/material/styles'; export const DashboardNameStyleWrapper = styled('div')` display: flex; - gap: 12px; align-items: center; + + .custom-icon { + margin-right: 12px; + } `; export const TableTitleStyleWrapper = styled('header')` display: flex; - gap: 8px; align-items: center; font-size: 16px; font-weight: 600; color: ${({ theme }) => theme.sharedTheme.uiToken.colorTextBase}; + + .custom-icon { + margin-right: 8px; + } `; export const NoBorderedPageHeaderWrapper = styled('div')` diff --git a/packages/sqle/src/page/Order/AuditDetail/index.tsx b/packages/sqle/src/page/Order/AuditDetail/index.tsx index 0fff46f9c..a40e63a35 100644 --- a/packages/sqle/src/page/Order/AuditDetail/index.tsx +++ b/packages/sqle/src/page/Order/AuditDetail/index.tsx @@ -278,6 +278,7 @@ const AuditDetail: React.FC = ({