feat: sider调整
This commit is contained in:
71
src/layouts/components/siderBar/style.scss
Normal file
71
src/layouts/components/siderBar/style.scss
Normal file
@ -0,0 +1,71 @@
|
||||
@mixin menu-item {
|
||||
border-radius: 8px;
|
||||
backdrop-filter: blur(100px);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
// justify-content: center;
|
||||
padding: 8px 12px;
|
||||
margin: 0;
|
||||
cursor: pointer;
|
||||
width: 100%;
|
||||
.label {
|
||||
transition: all 0.3s;
|
||||
margin-left: 8px;
|
||||
flex: auto;
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.ant-menu-title-content {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
&:hover {
|
||||
background: rgba(109, 76, 254, 0.08);
|
||||
color: #6d4cfe;
|
||||
.label,
|
||||
.svg-icon {
|
||||
color: #6d4cfe;
|
||||
}
|
||||
}
|
||||
&.active {
|
||||
background: #fff !important;
|
||||
.label,
|
||||
.svg-icon {
|
||||
color: #6d4cfe !important;
|
||||
}
|
||||
}
|
||||
&:not(:last-child) {
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
&.ant-menu-item-selected {
|
||||
background-color: transparent;
|
||||
}
|
||||
}
|
||||
.siderBar-wrap {
|
||||
background: transparent !important;
|
||||
border: none !important;
|
||||
color: inherit;
|
||||
.cts {
|
||||
color: #211f24;
|
||||
font-family: $font-family-regular;
|
||||
font-size: 14px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: 22px;
|
||||
}
|
||||
.menu-item {
|
||||
@include menu-item;
|
||||
}
|
||||
.line {
|
||||
opacity: 0.06;
|
||||
}
|
||||
.fold-btn {
|
||||
&:hover {
|
||||
.cts,
|
||||
.icon {
|
||||
color: #6d4cfe !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user