mirror of
https://github.com/jumpserver/lina.git
synced 2026-01-13 19:35:24 +00:00
perf: 优化移动端模式下菜单样式
This commit is contained in:
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div style="padding: 0 20px;" @click="toggleClick">
|
||||
<svg-icon icon-class="direction-left" class="hamburger" :class="{'is-active':isActive}" />
|
||||
<svg-icon icon-class="arrow-to-left" class="hamburger" style="color: #ffffff;" :class="{'is-active':isActive}" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -30,6 +30,6 @@ export default {
|
||||
color: $menuText;
|
||||
}
|
||||
.hamburger.is-active {
|
||||
transform: rotate(-180deg);
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -198,6 +198,7 @@ export default {
|
||||
line-height: 30px;
|
||||
border-radius: 4px;
|
||||
border-color: $--color-primary;
|
||||
background-color: white;
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
transition: .2s;
|
||||
|
||||
@@ -248,39 +248,39 @@ export default {
|
||||
display: none;
|
||||
|
||||
& > > > .organization {
|
||||
height: 48px;
|
||||
line-height: 48px;
|
||||
padding-left: 8px;
|
||||
background: transparent;
|
||||
color: #fff;
|
||||
border-bottom: 1px solid rgba(31, 35, 41, .15);
|
||||
.el-input--prefix .el-input__inner {
|
||||
height: 48px!important;
|
||||
line-height: 48px!important;
|
||||
}
|
||||
.svg-icon {
|
||||
color: #FFF!important;
|
||||
margin-right:0px!important;
|
||||
}
|
||||
}
|
||||
|
||||
& > > > .title-label {
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
.mobile-view-switch > > > .el-menu-item.is-active {
|
||||
color: #ffffff;
|
||||
.mobile-view-switch {
|
||||
&>>> .el-menu-item.is-active {
|
||||
color: var(--menu-text-active)!important;
|
||||
.svg-icon {
|
||||
color: var(--menu-text-active)!important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 992px) {
|
||||
.active-mobile {
|
||||
display: block;
|
||||
.organization {
|
||||
&>>> .svg-icon {
|
||||
color: #FFF!important;
|
||||
margin-right:0px!important;
|
||||
}
|
||||
}
|
||||
.mobile-view-switch {
|
||||
background: #fff!important;
|
||||
&>>> .el-menu-item.is-active {
|
||||
color: var(--menu-text-active)!important;
|
||||
.svg-icon {
|
||||
color: var(--menu-text-active)!important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.active-switch-view {
|
||||
display: none!important;
|
||||
|
||||
Reference in New Issue
Block a user