fix: 华农

src/layouts/HN.less

@@ -242,6 +242,36 @@
         }
       }
     }
+    .ant-layout-slider-menu-item {
+      height: 36px;
+    }
+    .ant-layout-slider-menu-item a {
+      flex-direction: row;
+      width: 100%;
+      margin: 0 auto;
+      margin-top: 4px;
+      margin-right: 16px;
+      padding-left: 16px;
+      overflow: hidden;
+      white-space: nowrap;
+      text-overflow: ellipsis;
+      & > img {
+        width: 18px;
+        height: 18px;
+        margin-top: 4px;
+        opacity: 1;
+      }
+      & > span {
+        margin-left: 4px;
+      }
+    }
+    .ant-menu {
+      ul {
+        .ant-menu-item-only-child {
+          padding-left: 26px !important;
+        }
+      }
+    }
     .test-icon {
       width: 100%;
       overflow: hidden;
@@ -290,6 +320,13 @@
       text-overflow: ellipsis;
       vertical-align: bottom;
     }
+    .ant-pro-menu-item-title {
+      display: inline-block;
+      overflow: hidden;
+      text-align: left;
+      text-overflow: ellipsis;
+      vertical-align: bottom;
+    }
     .hight-active {
       color: @hn-greenColor;
       // background: @hn-greenColor;
@@ -328,91 +365,93 @@
       display: none;
     }
     
-.ant-menu-submenu-vertical>.ant-menu-submenu-title .ant-menu-submenu-arrow,
-.ant-menu-submenu-vertical-left>.ant-menu-submenu-title .ant-menu-submenu-arrow,
-.ant-menu-submenu-vertical-right>.ant-menu-submenu-title .ant-menu-submenu-arrow,
-.ant-menu-submenu-inline>.ant-menu-submenu-title .ant-menu-submenu-arrow {
-  position: absolute;
-  top: 50%;
-  right: 16px;
-  width: 10px;
-  transition: transform .3s cubic-bezier(.645, .045, .355, 1)
-}
-
-.ant-menu-submenu-vertical>.ant-menu-submenu-title .ant-menu-submenu-arrow::before,
-.ant-menu-submenu-vertical-left>.ant-menu-submenu-title .ant-menu-submenu-arrow::before,
-.ant-menu-submenu-vertical-right>.ant-menu-submenu-title .ant-menu-submenu-arrow::before,
-.ant-menu-submenu-inline>.ant-menu-submenu-title .ant-menu-submenu-arrow::before,
-.ant-menu-submenu-vertical>.ant-menu-submenu-title .ant-menu-submenu-arrow::after,
-.ant-menu-submenu-vertical-left>.ant-menu-submenu-title .ant-menu-submenu-arrow::after,
-.ant-menu-submenu-vertical-right>.ant-menu-submenu-title .ant-menu-submenu-arrow::after,
-.ant-menu-submenu-inline>.ant-menu-submenu-title .ant-menu-submenu-arrow::after {
-  position: absolute;
-  width: 6px;
-  height: 1.5px;
-  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.85));
-  border-radius: 2px;
-  transition: background .3s cubic-bezier(.645, .045, .355, 1), transform .3s cubic-bezier(.645, .045, .355, 1), top .3s cubic-bezier(.645, .045, .355, 1);
-  content: ""
-}
+    .ant-menu-submenu-vertical>.ant-menu-submenu-title .ant-menu-submenu-arrow,
+    .ant-menu-submenu-vertical-left>.ant-menu-submenu-title .ant-menu-submenu-arrow,
+    .ant-menu-submenu-vertical-right>.ant-menu-submenu-title .ant-menu-submenu-arrow,
+    .ant-menu-submenu-inline>.ant-menu-submenu-title .ant-menu-submenu-arrow {
+      position: absolute;
+      top: 50%;
+      right: 16px;
+      width: 10px;
+      transition: transform .3s cubic-bezier(.645, .045, .355, 1)
+    }
 
-.ant-menu-submenu-vertical>.ant-menu-submenu-title .ant-menu-submenu-arrow::before,
-.ant-menu-submenu-vertical-left>.ant-menu-submenu-title .ant-menu-submenu-arrow::before,
-.ant-menu-submenu-vertical-right>.ant-menu-submenu-title .ant-menu-submenu-arrow::before,
-.ant-menu-submenu-inline>.ant-menu-submenu-title .ant-menu-submenu-arrow::before {
-  transform: rotate(45deg) translateY(-2px)
-}
+    .ant-menu-submenu-vertical>.ant-menu-submenu-title .ant-menu-submenu-arrow::before,
+    .ant-menu-submenu-vertical-left>.ant-menu-submenu-title .ant-menu-submenu-arrow::before,
+    .ant-menu-submenu-vertical-right>.ant-menu-submenu-title .ant-menu-submenu-arrow::before,
+    .ant-menu-submenu-inline>.ant-menu-submenu-title .ant-menu-submenu-arrow::before,
+    .ant-menu-submenu-vertical>.ant-menu-submenu-title .ant-menu-submenu-arrow::after,
+    .ant-menu-submenu-vertical-left>.ant-menu-submenu-title .ant-menu-submenu-arrow::after,
+    .ant-menu-submenu-vertical-right>.ant-menu-submenu-title .ant-menu-submenu-arrow::after,
+    .ant-menu-submenu-inline>.ant-menu-submenu-title .ant-menu-submenu-arrow::after {
+      position: absolute;
+      width: 6px;
+      height: 1.5px;
+      background-image: linear-gradient(to right, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.85));
+      border-radius: 2px;
+      transition: background .3s cubic-bezier(.645, .045, .355, 1), transform .3s cubic-bezier(.645, .045, .355, 1), top .3s cubic-bezier(.645, .045, .355, 1);
+      content: ""
+    }
 
-.ant-menu-submenu-vertical>.ant-menu-submenu-title .ant-menu-submenu-arrow::after,
-.ant-menu-submenu-vertical-left>.ant-menu-submenu-title .ant-menu-submenu-arrow::after,
-.ant-menu-submenu-vertical-right>.ant-menu-submenu-title .ant-menu-submenu-arrow::after,
-.ant-menu-submenu-inline>.ant-menu-submenu-title .ant-menu-submenu-arrow::after {
-  transform: rotate(-45deg) translateY(2px)
-}
+    .ant-menu-submenu-vertical>.ant-menu-submenu-title .ant-menu-submenu-arrow::before,
+    .ant-menu-submenu-vertical-left>.ant-menu-submenu-title .ant-menu-submenu-arrow::before,
+    .ant-menu-submenu-vertical-right>.ant-menu-submenu-title .ant-menu-submenu-arrow::before,
+    .ant-menu-submenu-inline>.ant-menu-submenu-title .ant-menu-submenu-arrow::before {
+      transform: rotate(45deg) translateY(-2px)
+    }
 
-.ant-menu-submenu-vertical>.ant-menu-submenu-title:hover .ant-menu-submenu-arrow::after,
-.ant-menu-submenu-vertical-left>.ant-menu-submenu-title:hover .ant-menu-submenu-arrow::after,
-.ant-menu-submenu-vertical-right>.ant-menu-submenu-title:hover .ant-menu-submenu-arrow::after,
-.ant-menu-submenu-inline>.ant-menu-submenu-title:hover .ant-menu-submenu-arrow::after,
-.ant-menu-submenu-vertical>.ant-menu-submenu-title:hover .ant-menu-submenu-arrow::before,
-.ant-menu-submenu-vertical-left>.ant-menu-submenu-title:hover .ant-menu-submenu-arrow::before,
-.ant-menu-submenu-vertical-right>.ant-menu-submenu-title:hover .ant-menu-submenu-arrow::before,
-.ant-menu-submenu-inline>.ant-menu-submenu-title:hover .ant-menu-submenu-arrow::before {
-  background: linear-gradient(to right, #13c2c2, #13c2c2)
-}
+    .ant-menu-submenu-vertical>.ant-menu-submenu-title .ant-menu-submenu-arrow::after,
+    .ant-menu-submenu-vertical-left>.ant-menu-submenu-title .ant-menu-submenu-arrow::after,
+    .ant-menu-submenu-vertical-right>.ant-menu-submenu-title .ant-menu-submenu-arrow::after,
+    .ant-menu-submenu-inline>.ant-menu-submenu-title .ant-menu-submenu-arrow::after {
+      transform: rotate(-45deg) translateY(2px)
+    }
 
-.ant-menu-submenu-vertical>.ant-menu-submenu-title .ant-menu-submenu-arrow::before,
-.ant-menu-submenu-vertical-left>.ant-menu-submenu-title .ant-menu-submenu-arrow::before,
-.ant-menu-submenu-vertical-right>.ant-menu-submenu-title .ant-menu-submenu-arrow::before {
-  transform: rotate(45deg) translateY(-2px)
-}
+    .ant-menu-submenu-vertical>.ant-menu-submenu-title:hover .ant-menu-submenu-arrow::after,
+    .ant-menu-submenu-vertical-left>.ant-menu-submenu-title:hover .ant-menu-submenu-arrow::after,
+    .ant-menu-submenu-vertical-right>.ant-menu-submenu-title:hover .ant-menu-submenu-arrow::after,
+    .ant-menu-submenu-inline>.ant-menu-submenu-title:hover .ant-menu-submenu-arrow::after,
+    .ant-menu-submenu-vertical>.ant-menu-submenu-title:hover .ant-menu-submenu-arrow::before,
+    .ant-menu-submenu-vertical-left>.ant-menu-submenu-title:hover .ant-menu-submenu-arrow::before,
+    .ant-menu-submenu-vertical-right>.ant-menu-submenu-title:hover .ant-menu-submenu-arrow::before,
+    .ant-menu-submenu-inline>.ant-menu-submenu-title:hover .ant-menu-submenu-arrow::before {
+      background: linear-gradient(to right, #13c2c2, #13c2c2)
+    }
 
-.ant-menu-submenu-vertical>.ant-menu-submenu-title .ant-menu-submenu-arrow::after,
-.ant-menu-submenu-vertical-left>.ant-menu-submenu-title .ant-menu-submenu-arrow::after,
-.ant-menu-submenu-vertical-right>.ant-menu-submenu-title .ant-menu-submenu-arrow::after {
-  transform: rotate(-45deg) translateY(2px)
-}
+    .ant-menu-submenu-vertical>.ant-menu-submenu-title .ant-menu-submenu-arrow::before,
+    .ant-menu-submenu-vertical-left>.ant-menu-submenu-title .ant-menu-submenu-arrow::before,
+    .ant-menu-submenu-vertical-right>.ant-menu-submenu-title .ant-menu-submenu-arrow::before {
+      transform: rotate(45deg) translateY(-2px)
+    }
 
-.ant-menu-submenu-inline>.ant-menu-submenu-title .ant-menu-submenu-arrow::before {
-  transform: rotate(-45deg) translateX(2px)
-}
+    .ant-menu-submenu-vertical>.ant-menu-submenu-title .ant-menu-submenu-arrow::after,
+    .ant-menu-submenu-vertical-left>.ant-menu-submenu-title .ant-menu-submenu-arrow::after,
+    .ant-menu-submenu-vertical-right>.ant-menu-submenu-title .ant-menu-submenu-arrow::after {
+      transform: rotate(-45deg) translateY(2px)
+    }
 
-.ant-menu-submenu-inline>.ant-menu-submenu-title .ant-menu-submenu-arrow::after {
-  transform: rotate(45deg) translateX(-2px)
-}
+    .ant-menu-submenu-inline>.ant-menu-submenu-title .ant-menu-submenu-arrow::before {
+      transform: rotate(-45deg) translateX(2px)
+    }
 
-.ant-menu-submenu-open.ant-menu-submenu-inline>.ant-menu-submenu-title .ant-menu-submenu-arrow {
-  transform: translateY(-2px)
-}
+    .ant-menu-submenu-inline>.ant-menu-submenu-title .ant-menu-submenu-arrow::after {
+      transform: rotate(45deg) translateX(-2px)
+    }
 
-.ant-menu-submenu-open.ant-menu-submenu-inline>.ant-menu-submenu-title .ant-menu-submenu-arrow::after {
-  transform: rotate(-45deg) translateX(-2px)
-}
+    .ant-menu-submenu-open.ant-menu-submenu-inline>.ant-menu-submenu-title .ant-menu-submenu-arrow {
+      transform: translateY(-2px)
+    }
 
-.ant-menu-submenu-open.ant-menu-submenu-inline>.ant-menu-submenu-title .ant-menu-submenu-arrow::before {
-  transform: rotate(45deg) translateX(2px)
-}
+    .ant-menu-submenu-open.ant-menu-submenu-inline>.ant-menu-submenu-title .ant-menu-submenu-arrow::after {
+      transform: rotate(-45deg) translateX(-2px)
+    }
 
+    .ant-menu-submenu-open.ant-menu-submenu-inline>.ant-menu-submenu-title .ant-menu-submenu-arrow::before {
+      transform: rotate(45deg) translateX(2px)
+    }
+    .ant-menu-submenu-open.ant-menu-submenu-inline>.ant-menu-submenu-title{
+      position: relative;
+    }
 
   }
 }