feat: ✨ 布局，样式统一，集成依赖

src/styles/btn-style.scss

@@ -0,0 +1,35 @@
+// 公共的图表按钮样式
+.btn-icon-btn {
+  align-items: center;
+  justify-content: center;
+  display: inline-block;
+  border: 1px solid transparent;
+  border-radius: 30%;
+  padding: 4px;
+  cursor: pointer;
+  transition: all 0.3s ease;
+
+  // 鼠标移入
+  &:hover {
+    background-color: rgb(0, 0, 0, .05);
+
+    .svg-icon {
+      color: rgb(0, 0, 0, .6);
+    }
+  }
+
+  // 鼠标按下
+  &:active {
+    background-color: rgb(0, 0, 0, .08);
+
+    .svg-icon {
+      color: rgb(0, 0, 0, .7);
+    }
+  }
+
+  // 图标
+  .svg-icon {
+    user-select: none;
+    color: rgb(0, 0, 0, .5);
+  }
+}

src/styles/index.scss

@@ -1,3 +1,4 @@
+@use './btn-style.scss';
 @use 'reset-css';
 @use './element-plus.scss';
 

src/styles/var.scss

@@ -0,0 +1,9 @@
+:root {
+  /* 头部高度 */
+  --header-container-default-heigth: 56px;
+
+  /* 侧边栏背景色 */
+  --sidebar-background-color: #f3f4f6;
+  
+
+}