diff --git a/package-lock.json b/package-lock.json index 56e915d..8d32e57 100644 --- a/package-lock.json +++ b/package-lock.json @@ -11,6 +11,7 @@ "@element-plus/icons-vue": "^2.3.2", "axios": "^1.13.2", "element-plus": "^2.11.8", + "normalize.css": "^8.0.1", "vue": "^3.5.24", "vue-router": "^4.6.3" }, @@ -1592,6 +1593,12 @@ "integrity": "sha512-Wj7+EJQ8mSuXr2iWfnujrimU35R2W4FAErEyTmJoJ7ucwTn2hOUSsRehMb5RSYkxXGTM7Y9QpvPmp++w5ftoJw==", "license": "BSD-3-Clause" }, + "node_modules/normalize.css": { + "version": "8.0.1", + "resolved": "https://registry.npmjs.org/normalize.css/-/normalize.css-8.0.1.tgz", + "integrity": "sha512-qizSNPO93t1YUuUhP22btGOo3chcvDFqFaj2TRybP0DMxkHOCTYwp3n34fel4a31ORXy4m1Xq0Gyqpb5m33qIg==", + "license": "MIT" + }, "node_modules/picocolors": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.1.1.tgz", diff --git a/package.json b/package.json index 741ef40..0bd3717 100644 --- a/package.json +++ b/package.json @@ -12,6 +12,7 @@ "@element-plus/icons-vue": "^2.3.2", "axios": "^1.13.2", "element-plus": "^2.11.8", + "normalize.css": "^8.0.1", "vue": "^3.5.24", "vue-router": "^4.6.3" }, diff --git a/src/layout/Layout.vue b/src/layout/Layout.vue index c343bef..71a08af 100644 --- a/src/layout/Layout.vue +++ b/src/layout/Layout.vue @@ -94,8 +94,9 @@ const currentRoutePath = computed(() => route.path); .sidebar { position: fixed; left: 24px; + top: 10px; width: 336px; - height: 100vh; + height: calc(100vh - 20px); flex-shrink: 0; border-radius: 8px; background: #FEE6E6; @@ -142,9 +143,11 @@ const currentRoutePath = computed(() => route.path); .main-content { padding: 20px; background-color: #FEE6E6; - height: 100vh; + height: calc(100vh - 20px); margin-left: 50px; - box-shadow: 0 0 4px 0 #00000040; + margin-right: 24px; + margin-top: 10px; + box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.25); } /* 父目录文字样式 */ diff --git a/src/main.js b/src/main.js index f231269..8695bff 100644 --- a/src/main.js +++ b/src/main.js @@ -6,6 +6,7 @@ import ElementPlus from 'element-plus' import 'element-plus/dist/index.css' // 导入 Element Plus 图标 import * as ElementPlusIconsVue from '@element-plus/icons-vue' +import 'normalize.css'; const app = createApp(App)