feat: 框架样式调整

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

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>

View File

@ -8,7 +8,7 @@ const route = useRoute();
const routerKey = computed(() => {
return route.path + Math.random();
});
const hideFooter = computed(() => route.meta?.hideFooter);
// const hideFooter = computed(() => route.meta?.hideFooter);
/*** - end */
</script>
@ -20,10 +20,10 @@ const hideFooter = computed(() => route.meta?.hideFooter);
<component :is="Component" :key="route.fullPath" />
</keep-alive>
</transition>
<view class="footer" v-if="!hideFooter">
<!-- <view class="footer" v-if="!hideFooter">
<view>闽公网安备 352018502850842 闽ICP备20250520582号 © 2025小题科技All Rights Reserved.</view>
<view>* 数据通过公开渠道获取灵机进行统计分析</view>
</view>
</view> -->
</router-view>
</template>