fix: 💄 ui style

illacloud · Nov 10, 2022 · ff7e9b3 · ff7e9b3
1 parent 46fcaf8
commit ff7e9b3
Show file tree

Hide file tree

Showing 7 changed files with 141 additions and 33 deletions.
diff --git a/apps/builder/src/components/PanelBar/style.ts b/apps/builder/src/components/PanelBar/style.ts
@@ -51,8 +51,8 @@ export const panelBarItemAnimation: Variants = {
 
 export const addIconHotpotStyle = css`
   font-size: 12px;
-  width: 24px;
-  height: 24px;
+  width: 16px;
+  height: 16px;
   display: flex;
   align-items: center;
   justify-content: center;

diff --git a/apps/builder/src/middleware/redux/reduxAsync.ts b/apps/builder/src/middleware/redux/reduxAsync.ts
@@ -356,12 +356,12 @@ export const reduxAsync: Redux.Middleware = (store) => (next) => (action) => {
               addedSectionName,
             } = action.payload as AddTargetPageSectionPayload
             const pageNode = searchDsl(getCanvas(store.getState()), pageName)
-            const addSectionNode = searchDsl(
-              getCanvas(store.getState()),
-              addedSectionName,
+            if (!pageNode) break
+            const addSectionNode = pageNode.childrenNode.find(
+              (node) => node.showName === addedSectionName,
             )
+            if (!addSectionNode) break
 
-            if (!pageNode || !addSectionNode) break
             const WSPagePayload = transformComponentReduxPayloadToWsPayload(
               pageNode,
             )

diff --git a/apps/builder/src/page/App/components/DataWorkspace/components/PageSpaceTree/index.tsx b/apps/builder/src/page/App/components/DataWorkspace/components/PageSpaceTree/index.tsx
@@ -1,7 +1,12 @@
 import { FC, useCallback } from "react"
 import { PanelBar } from "@/components/PanelBar"
 import { useTranslation } from "react-i18next"
-import { homePageIconStyle, pageItemWrapperStyle, pageNameStyle } from "./style"
+import {
+  homePageIconHotSpot,
+  homePageIconStyle,
+  pageItemWrapperStyle,
+  pageNameStyle,
+} from "./style"
 import { PageItemProps } from "./interface"
 import { ReactComponent as HomepageIcon } from "@/assets/dataWorkspace/homepage.svg"
 import { useDispatch, useSelector } from "react-redux"
@@ -35,7 +40,9 @@ export const PageItem: FC<PageItemProps> = (props) => {
         }}
       >
         <span css={pageNameStyle}>{pageName}</span>
-        {isHomePage && <HomepageIcon css={homePageIconStyle} />}
+        <div css={homePageIconHotSpot}>
+          {isHomePage && <HomepageIcon css={homePageIconStyle} />}
+        </div>
       </div>
     </Dropdown>
   )

diff --git a/apps/builder/src/page/App/components/DataWorkspace/components/PageSpaceTree/style.ts b/apps/builder/src/page/App/components/DataWorkspace/components/PageSpaceTree/style.ts
@@ -7,6 +7,14 @@ export const pageNameStyle = css`
   font-weight: 500;
 `
 
+export const homePageIconHotSpot = css`
+  width: 16px;
+  height: 16px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+`
+
 export const homePageIconStyle = css`
   font-size: 12px;
   width: 12px;
@@ -23,6 +31,7 @@ export const pageItemWrapperStyle = (isSelected: boolean) => {
     width: 100%;
     height: 24px;
     cursor: pointer;
+    font-family: "Fira Code", monospace;
     background-color: ${isSelected
       ? globalColor(`--${illaPrefix}-techPurple-07`)
       : globalColor(`--${illaPrefix}-white-01`)};