github
/
element
mirror of https://github.com/ElemeFE/element
1
0
Fork 0
Code Issues Releases Wiki Activity

Menu: optimize collapse animation

pull/6459/merge
Leopoldthecoder 2017-08-11 18:15:19 +08:00 committed by 杨奕
parent e289e86154
commit 122c3690df
1 changed files with 21 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
packages/theme-default/src/menu.css
View File

@ -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 @@
@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 @@
&: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 @@
} }
} }
[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 @@
} }
} }
} }
.horizontal-collapse-transition .el-submenu__title .el-submenu__icon-arrow {
transition: .2s;
opacity: 0;
}