Skip to content

E
Element
Commit 122c3690 authored by Leopoldthecoder's avatar Leopoldthecoder Committed by 杨奕
Browse files
Options

Menu: optimize collapse animation

parent e289e861
Hide whitespace changes
Inline Side-by-side
Showing with 21 additions and 5 deletions
packages/theme-default/src/menu.css
View file @ 122c3690
...@@ -142,10 +142,11 @@ ...@@ -142,10 +142,11 @@
> .el-menu-item, > .el-menu-item,
> .el-submenu > .el-submenu__title { > .el-submenu > .el-submenu__title {
text-align: center;
[class^="el-icon-"] { [class^="el-icon-"] {
margin: 0; margin: 0;
vertical-align: middle; vertical-align: middle;
width: 24px;
text-align: center;
} }
.el-submenu__icon-arrow { .el-submenu__icon-arrow {
display: none; display: none;
...@@ -181,8 +182,12 @@ ...@@ -181,8 +182,12 @@
@extend menu-item; @extend menu-item;
& [class^="el-icon-"] { & [class^="el-icon-"] {
vertical-align: baseline; margin-right: 5px;
margin-right: 10px; width: 24px;
text-align: center;
}
& * {
vertical-align: middle;
} }
&:first-child { &:first-child {
margin-left: 0; margin-left: 0;
...@@ -206,6 +211,10 @@ ...@@ -206,6 +211,10 @@
&:hover { &:hover {
background-color: var(--color-base-gray); background-color: var(--color-base-gray);
} }
& * {
vertical-align: middle;
}
} }
& .el-menu { & .el-menu {
background-color: var(--color-light-gray); background-color: var(--color-light-gray);
...@@ -239,8 +248,10 @@ ...@@ -239,8 +248,10 @@
} }
} }
[class^="el-icon-"] { [class^="el-icon-"] {
vertical-align: baseline; vertical-align: middle;
margin-right: 10px; margin-right: 5px;
width: 24px;
text-align: center;
} }
} }
...@@ -257,3 +268,8 @@ ...@@ -257,3 +268,8 @@
} }
} }
} }
.horizontal-collapse-transition .el-submenu__title .el-submenu__icon-arrow {
transition: .2s;
opacity: 0;
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment