| | |
| | | <template> |
| | | <div class="Menu"> |
| | | <!-- 菜单栏 --> |
| | | <el-aside width="160px" class="menu"> |
| | | <el-aside width="200px" class="menu"> |
| | | <h2 class="siderbar-title">遂昌执法平台</h2> |
| | | <el-scrollbar class="MenuScroll"> |
| | | <!-- 路由 --> |
| | | <el-menu class="el-menu-vertical"> |
| | |
| | | </script> |
| | | |
| | | <style lang="scss" scpoed> |
| | | $bk:#333744; |
| | | .icon-padding { |
| | | padding-right: 10px; |
| | | } |
| | | .menu { |
| | | background: $bk; |
| | | background: #07162e; |
| | | color: #e9eef3; |
| | | text-align: center; |
| | | box-sizing: border-box; |
| | |
| | | top: 0; |
| | | left: 0; |
| | | z-index: 999; |
| | | box-shadow: 0 -5px 5px #0ff inset; |
| | | background-color: #08162f; |
| | | } |
| | | |
| | | .MenuScroll { |
| | | height: calc(100vh - 66px); |
| | | box-sizing: border-box; |
| | | margin-top: 66px; |
| | | .el-menu { |
| | | background: linear-gradient(#07162e, #0f2b56); |
| | | border: 0; |
| | | |
| | | .firstMenu { |
| | | background: $bk; |
| | | background: #07162e; |
| | | text-align: left; |
| | | &:hover .fisrtSpan { |
| | | color: #fff; |
| | |
| | | |
| | | .el-menu-item { |
| | | color: #c3c3c4; |
| | | background-color: #333744; |
| | | |
| | | background-color: #07162e; |
| | | &:hover { |
| | | color: #fff; |
| | | background-color: #0c2c4c; |
| | | } |
| | | } |
| | | |
| | |
| | | } |
| | | |
| | | .is-active { |
| | | background-color: #092c4a; |
| | | background-color: #07162e; |
| | | } |
| | | } |
| | | |