diff --git a/src/assets/css/pages/tools-framework.scss b/src/assets/css/pages/tools-framework.scss index 46c8d95..f1dc864 100644 --- a/src/assets/css/pages/tools-framework.scss +++ b/src/assets/css/pages/tools-framework.scss @@ -30,6 +30,7 @@ body { height: 40px; font-size: constants.$SIZE_ICON_SM; border-radius: 8px; + cursor: pointer; span { transform: rotateZ(180deg); transition: all .3s; @@ -45,6 +46,7 @@ body { font-size: 2em; text-align: center; letter-spacing: 0.6em; + transform: translateX(0.3em); } } @@ -178,6 +180,40 @@ body { opacity: 0.4; } + .footer { + display: flex; + align-items: center; + font-weight: bold; + padding: 10px 14px; + color: constants.$main-color; + + .icon-box { + display: flex; + justify-content: center; + align-items: center; + padding: 10px; + width: 40px; + height: 40px; + font-size: constants.$SIZE_ICON_SM; + border-radius: 8px; + span { + transform: rotateZ(180deg); + transition: all .3s; + } + + &:hover { + background-color: constants.$background-color; + } + } + + .text { + flex: 1; + font-size: 2em; + text-align: center; + letter-spacing: 0.6em; + } + } + &.hide { width: 68px; diff --git a/src/pages/ToolsFramework.tsx b/src/pages/ToolsFramework.tsx index f9e94bb..519ea17 100644 --- a/src/pages/ToolsFramework.tsx +++ b/src/pages/ToolsFramework.tsx @@ -4,15 +4,17 @@ import '@/assets/css/pages/tools-framework.scss' import Icon from '@ant-design/icons' import { toolsJsonObjects } from '@/router/tools.tsx' import HideScrollbar, { HideScrollbarElement } from '@/components/common/HideScrollbar.tsx' +import { getLocalStorage, setLocalStorage } from '@/utils/common.ts' const ToolsFramework: React.FC = () => { const hideScrollbarRef = useRef(null) const [submenuTop, setSubmenuTop] = useState(0) const [submenuLeft, setSubmenuLeft] = useState(0) - const [hideSidebar, setHideSidebar] = useState(false) + const [hideSidebar, setHideSidebar] = useState(getLocalStorage('hideSidebar') === 'false') const switchSidebar = () => { setHideSidebar(!hideSidebar) + setLocalStorage('hideSidebar', hideSidebar ? 'true' : 'false') setTimeout(() => { hideScrollbarRef.current?.refreshLayout() }, 300) @@ -90,7 +92,7 @@ const ToolsFramework: React.FC = () => {
  • -
    +
  • @@ -177,7 +179,13 @@ const ToolsFramework: React.FC = () => {
    -
    氮工具
    +
    +
    + + + + 氮工具 +