瀏覽代碼

fix: 主界面布局

ChenYangfan 6 年之前
父節點
當前提交
fdaa3a6d91
共有 2 個文件被更改,包括 20 次插入7 次删除
  1. 20 6
      src/components/TabSideComponent.vue
  2. 0 1
      src/views/shared/UserHomeLayout.vue

+ 20 - 6
src/components/TabSideComponent.vue

@@ -35,15 +35,17 @@ export default {
 <style lang="scss" scoped>
 .tab-side-component {
   box-sizing: border-box;
+  z-index: 3;
+
 }
 
 .content {
+  z-index: 4;
   max-height: 90vh;
   overflow: auto;
 }
 
 .small {
-  z-index: 3;
   position: fixed;
   top: 0;
   bottom: 0;
@@ -57,14 +59,26 @@ export default {
   background: rgba(255, 255, 255, 0.7);
 }
 
+.large {
+  width: 340px;
+  min-height: 350px;
+  &::after {
+    z-index: -1;
+    content: '';
+    position: fixed;
+    width: 100vw;
+    height: 100vh;
+    top: 0;
+    left: 0;
+    backdrop-filter: saturate(120%);
+    background-color: rgba(255, 255, 255, 0.4);
+    pointer-events: none;
+  }
+}
+
 @media (min-width: 600px) {
   .small {
     padding: 64px 10vw;
   }
 }
-
-.large {
-  width: 340px;
-  min-height: 350px;
-}
 </style>

+ 0 - 1
src/views/shared/UserHomeLayout.vue

@@ -52,7 +52,6 @@ export default {
   },
   watch: {
     $route () {
-      console.log(this.$route)
       this.currentRouteName = this.$route.path
     }
   },