admin/jdcProject_front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: 样式穿透使用最新的 :deep() 语法 (#13)

Browse Source
This commit is contained in:
ClariS 2022-09-28 17:17:24 +08:00 committed by GitHub
parent 08b60c99cc
commit 63ca3831ea
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 8 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/layout/components/Sidebar/SidebarItem.vue
View File

@ -106,7 +106,7 @@ const resolvePath = (routePath: string) => {
.simple-mode { .simple-mode {
&.first-level { &.first-level {
::v-deep(.el-sub-menu) { :deep(.el-sub-menu) {
.el-sub-menu__icon-arrow { .el-sub-menu__icon-arrow {
display: none; display: none;
} }

14
src/layout/components/Sidebar/index.vue
View File

@ -80,7 +80,7 @@ const isCollapse = computed(() => {
.el-scrollbar { .el-scrollbar {
height: 100%; height: 100%;
::v-deep(.scrollbar-wrapper) { :deep(.scrollbar-wrapper) {
// 限制水平宽度 // 限制水平宽度
overflow-x: hidden !important; overflow-x: hidden !important;
.el-scrollbar__view { .el-scrollbar__view {
@ -88,7 +88,7 @@ const isCollapse = computed(() => {
} }
} }
// 滚动条 // 滚动条
::v-deep(.el-scrollbar__bar) { :deep(.el-scrollbar__bar) {
&.is-horizontal { &.is-horizontal {
// 隐藏水平滚动条 // 隐藏水平滚动条
display: none; display: none;
@ -102,9 +102,9 @@ const isCollapse = computed(() => {
width: 100% !important; width: 100% !important;
} }
::v-deep(.el-menu-item), :deep(.el-menu-item),
::v-deep(.el-sub-menu__title), :deep(.el-sub-menu__title),
::v-deep(.el-sub-menu .el-menu-item) { :deep(.el-sub-menu .el-menu-item) {
height: var(--v3-sidebar-menu-item-height); height: var(--v3-sidebar-menu-item-height);
line-height: var(--v3-sidebar-menu-item-height); line-height: var(--v3-sidebar-menu-item-height);
&:hover { &:hover {
@ -116,14 +116,14 @@ const isCollapse = computed(() => {
} }
} }
::v-deep(.el-menu-item) { :deep(.el-menu-item) {
&.is-active { &.is-active {
@include tip-line; @include tip-line;
} }
} }
.el-menu--collapse { .el-menu--collapse {
::v-deep(.el-sub-menu) { :deep(.el-sub-menu) {
&.is-active { &.is-active {
.el-sub-menu__title { .el-sub-menu__title {
color: var(--v3-sidebar-menu-active-text-color) !important; color: var(--v3-sidebar-menu-active-text-color) !important;