renxiaodong/lingji-work-fe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 框架样式调整

Browse Source
This commit is contained in:
rd
2025-08-15 14:32:40 +08:00
parent f11548e9c1
commit ca53964cfb
56 changed files with 206 additions and 157 deletions
Download Patch File Download Diff File Expand all files Collapse all files

107
src/layouts/Basic.vue
View File

@ -16,7 +16,7 @@ const router = useRouter();
const route = useRoute();
useResponsive(true);
const navbarHeight = `72px`;
const navbarHeight = `52px`;
const navbar = computed(() => appStore.navbar);
const renderMenu = computed(() => appStore.menu && !appStore.topMenu);
const hideMenu = computed(() => appStore.hideMenu);
@ -110,62 +110,65 @@ provide('toggleDrawerMenu', () => {
<style scoped lang="scss">
$layout-max-width: 1100px;
.layout-navbar {
position: fixed;
top: 0;
left: 0;
z-index: 1000;
width: 100%;
height: $navbar-height;
}
.layout-sider {
position: fixed;
top: 0;
left: 0;
z-index: 99;
height: 100%;
transition: all 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
&::after {
position: absolute;
.layout {
.layout-navbar {
position: fixed;
top: 0;
right: -1px;
display: block;
width: 1px;
left: 0;
z-index: 1000;
width: 100%;
height: $navbar-height;
}
.layout-sider {
position: fixed;
top: 0;
left: 0;
z-index: 99;
height: 100%;
background-color: var(--color-border);
content: '';
transition: all 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
background: none;
box-shadow: none;
// &::after {
// position: absolute;
// top: 0;
// right: -1px;
// display: block;
// width: 1px;
// height: 100%;
// background-color: var(--color-border);
// content: '';
// }
> :deep(.arco-layout-sider-children) {
overflow-y: hidden;
}
}
> :deep(.arco-layout-sider-children) {
overflow-y: hidden;
}
}
.menu-wrapper {
height: 100%;
overflow: auto;
overflow-x: hidden;
.menu-wrapper {
height: 100%;
overflow: auto;
overflow-x: hidden;
:deep(.arco-menu) {
::-webkit-scrollbar {
width: 12px;
height: 4px;
}
::-webkit-scrollbar-thumb {
border: 4px solid transparent;
background-clip: padding-box;
border-radius: 7px;
background-color: var(--color-text-4);
}
::-webkit-scrollbar-thumb:hover {
background-color: var(--color-text-3);
:deep(.arco-menu) {
::-webkit-scrollbar {
width: 12px;
height: 4px;
}
::-webkit-scrollbar-thumb {
border: 4px solid transparent;
background-clip: padding-box;
border-radius: 7px;
background-color: var(--color-text-4);
}
::-webkit-scrollbar-thumb:hover {
background-color: var(--color-text-3);
}
}
}
}
.layout-content {
min-width: 1366px;
height: 100%;
overflow-y: hidden;
background-color: $color-background;
transition: padding 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
.layout-content {
min-width: 1366px;
height: 100%;
overflow-y: hidden;
transition: padding 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
padding-top: $navbar-height;
}
}
</style>