diff --git a/nezha-fronted/src/assets/css/components/common/bottomBox/bottomBox.scss b/nezha-fronted/src/assets/css/components/common/bottomBox/bottomBox.scss index aa1ac73d3..c61e4c590 100644 --- a/nezha-fronted/src/assets/css/components/common/bottomBox/bottomBox.scss +++ b/nezha-fronted/src/assets/css/components/common/bottomBox/bottomBox.scss @@ -209,7 +209,7 @@ overflow-y: auto; } .resize-modal { - width: calc(100% - 240px); + width: calc(100% - 252px); opacity: 0.6; background-color: #f5f9ff; border: 1px solid #a7d0f7; diff --git a/nezha-fronted/src/assets/css/components/common/bottomBox/dashboardTab.scss b/nezha-fronted/src/assets/css/components/common/bottomBox/dashboardTab.scss index ebcfdc662..71c584233 100644 --- a/nezha-fronted/src/assets/css/components/common/bottomBox/dashboardTab.scss +++ b/nezha-fronted/src/assets/css/components/common/bottomBox/dashboardTab.scss @@ -16,10 +16,6 @@ border-radius: 5px; } - .panel-list-width { - width:240px; - } - .panel-dropdown-title { line-height:24px; padding-left:5px; diff --git a/nezha-fronted/src/assets/css/components/layout/home.scss b/nezha-fronted/src/assets/css/components/layout/home.scss index 806513a19..2e0d4058c 100644 --- a/nezha-fronted/src/assets/css/components/layout/home.scss +++ b/nezha-fronted/src/assets/css/components/layout/home.scss @@ -4,7 +4,7 @@ background-color: $--background-color-empty; .body { flex: 1; - width: calc(100% - 240px); + width: calc(100% - 252px); height: 100%; display: flex; flex-direction: column; @@ -27,6 +27,12 @@ position: fixed; } +.body.isShrink{ + .panel-loading{ + left: 64px; + } +} + .home.tv,.home.se{ .left-menu{ display: none; @@ -46,15 +52,15 @@ padding-left: 0; } } + .panel-loading{ + left: 0; + top: 0; + } } .right-box.right-box-chart{ top: 0px; height: 100%; } - .panel-loading{ - left: 0; - top: 0; - } } } .home.se{ diff --git a/nezha-fronted/src/assets/css/components/layout/leftMenu.scss b/nezha-fronted/src/assets/css/components/layout/leftMenu.scss index e395ea4fd..7e382ce39 100644 --- a/nezha-fronted/src/assets/css/components/layout/leftMenu.scss +++ b/nezha-fronted/src/assets/css/components/layout/leftMenu.scss @@ -13,7 +13,7 @@ font-size: 18px; } >.el-menu:not(.el-menu--collapse) { - width: 240px; + width: 252px; } >.el-menu.menu-list { height: calc(100% - 110px); @@ -106,3 +106,41 @@ background-color: $--left-menu-background-color-hover !important; } } +.collapse-btn{ + position: fixed; + bottom: 0; + left: 0; + width: 252px; + height: 52px; + transition: all 0.4s ease 0s; + cursor: pointer; + .copy-right{ + padding: 6px 0 6px 12px; + text-align: left; + span{ + display: block; + font-size: 13px; + line-height: 20px; + color: $--color-text-secondary; + white-space: nowrap; + } + } + .collapse-icon{ + position: absolute; + top: 4px; + right: 8px; + font-size: 16px; + color: $--color-text-secondary; + transform: rotate(90deg); + } + &.isCollapse-btn{ + width: 64px; + .collapse-icon{ + left: 0; + right: 0; + margin: auto; + text-align: center; + transform: rotate(-90deg); + } + } +} diff --git a/nezha-fronted/src/assets/css/components/page/dashboard/panel.scss b/nezha-fronted/src/assets/css/components/page/dashboard/panel.scss index 5cdd149ea..970ef72c8 100644 --- a/nezha-fronted/src/assets/css/components/page/dashboard/panel.scss +++ b/nezha-fronted/src/assets/css/components/page/dashboard/panel.scss @@ -142,7 +142,7 @@ /* end-chart list*/ .panel-loading { position: fixed; - left: 250px; + left: 252px; top: 59px; height: 100%; width: 100%; diff --git a/nezha-fronted/src/components/layout/header.vue b/nezha-fronted/src/components/layout/header.vue index bbf41a929..4fbc2d75e 100644 --- a/nezha-fronted/src/components/layout/header.vue +++ b/nezha-fronted/src/components/layout/header.vue @@ -1,6 +1,6 @@ @@ -83,6 +91,9 @@ export default { } }, methods: { + shrink () { + this.$store.commit('isShrink') + }, jump (route) { if (route === this.route) { this.refresh()