标签样式优化

template/admin/src/components/main/components/side-menu/side-menu.vue

@@ -350,7 +350,7 @@ export default {
     }
   }
   .child-menu {
-    z-index: 8;
+    z-index: 999;
     box-shadow: 2px 0px 4px 0px rgba(0, 0, 0, 0.06);
     .child-menus {
       width: @side-child-width !important;
@@ -390,13 +390,13 @@ export default {
     }
     .cat-name {
       width: 100%;
-      font-size: 14px;
+      font-size: 16px;
       height: 50px;
       line-height: 16px;
       font-weight: 600;
-      color: #303133;
-      padding: 15px;
-      text-align: center;
+      color: #606266;
+      padding: 15px 23px;
+      text-align: left;
       border-bottom: 1px solid #f2f2f2;
     }
   }

template/admin/src/components/main/components/tags-nav/tags-nav.less

@@ -15,7 +15,7 @@
   background: unset;
   width: 100%;
   margin: 0 15px 0 0px;
-  overflow: hidden;
+  //overflow: hidden;
   padding: 0;
   height: 42px;
   margin-bottom: 14px;
@@ -24,7 +24,7 @@
 }
 .tags-nav {
   position: relative;
-  margin-top: 4px;
+  //margin-top: 3px;
   // border-top: 1px solid #f0f0f0;
   // border-bottom: 1px solid #f0f0f0;
   .no-select;
@@ -34,7 +34,7 @@
     right: 0;
     top: 0;
     height: 100%;
-    width: 32px;
+    width: 40px;
     background: #fff;
     text-align: center;
     z-index: 10;
@@ -43,24 +43,26 @@
     position: absolute;
     top: 0px;
     height: 100%;
-    padding-top: 3px;
+    padding-top: 5px;
     z-index: 10;
+    background-color: #fff;
     button {
-      padding: 6px 4px;
+      padding: 6px;
       line-height: 14px;
       text-align: center;
     }
     &.left-btn {
-      left: 1px;
+      border-right: 1px solid #f0f0f0;
     }
     &.right-btn {
-      right: 16px;
-      // border-right: 1px solid #f0f0f0;
+      right: 40px;
+       border-right: 1px solid #f0f0f0;
+       border-left: 1px solid #f0f0f0;
     }
   }
   .scroll-outer {
     position: absolute;
-    left: 8px;
+    left: 20px;
     right: 21px;
     top: 0;
     bottom: 0;
@@ -68,7 +70,7 @@
     .scroll-body {
       height: ~'calc(100% - 1px)';
       display: inline-block;
-      padding: 1px 20px 0 20px;
+      padding: 3px 20px 0 20px;
       position: absolute;
       overflow: visible;
       white-space: nowrap;
@@ -85,12 +87,12 @@
   .contextmenu {
     position: absolute;
     margin: 0;
-    padding: 5px 0;
+    padding: 5px 0px;
     background: #fff;
     z-index: 1000;
     list-style-type: none;
     border-radius: 4px;
-    box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.1);
+    box-shadow: 0px 1px 6px rgba(0, 0, 0, 0.2);
     li {
       margin: 0;
       padding: 5px 15px;

template/admin/src/components/main/components/tags-nav/tags-nav.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="tags-nav">
-    <!-- <div class="close-con">
+    <div class="close-con">
       <Dropdown transfer @on-click="handleTagsOption" style="margin-top: 7px">
         <Button size="small" type="text">
           <Icon :size="18" type="ios-close-circle-outline" />
@@ -10,7 +10,7 @@
           <DropdownItem name="close-others">关闭其他</DropdownItem>
         </DropdownMenu>
       </Dropdown>
-    </div> -->
+    </div>
     <ul v-show="visible" :style="{ left: contextMenuLeft + 'px', top: contextMenuTop + 'px' }" class="contextmenu">
       <li v-for="(item, key) of menuList" @click="handleTagsOption(key)" :key="key">{{ item }}</li>
     </ul>