juluo/fuwari
1
0
Fork 0
mirror of https://github.com/afoim/fuwari.git synced 2026-01-31 09:03:18 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(layout): 调整主网格布局的行列结构和页脚位置

Browse Source 
修复移动端和桌面端布局不一致的问题，重新组织网格行和列的起始位置，确保页脚在不同设备上正确显示
This commit is contained in:
二叉树树
2026-01-18 02:17:38 +08:00
parent 7ec997337d
commit 420efc820f
1 changed files with 4 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/layouts/MainGridLayout.astro
View File

@@ -63,7 +63,7 @@ const mainPanelTop = siteConfig.banner.enable
<div class="absolute w-full z-30 pointer-events-none" style=`top: ${mainPanelTop}`>
<!-- The pointer-events-none here prevent blocking the click event of the TOC -->
<div class="relative max-w-[var(--page-width)] mx-auto pointer-events-auto">
<div id="main-grid" class="transition duration-700 w-full left-0 right-0 grid grid-cols-[17.5rem_auto] grid-rows-[auto_1fr_auto] lg:grid-rows-[auto]
<div id="main-grid" class="transition duration-700 w-full left-0 right-0 grid grid-cols-[17.5rem_auto] grid-rows-[auto_auto_1fr] lg:grid-rows-[auto_1fr]
mx-auto gap-4 px-4 md:px-4"
>
<!-- Banner image credit -->
@@ -80,20 +80,17 @@ const mainPanelTop = siteConfig.banner.enable
</a>}
<SideBar class="mb-4 row-start-2 row-end-3 col-span-2 lg:row-start-1 lg:row-end-2 lg:col-span-1 lg:max-w-[17.5rem] onload-animation" headings={headings}></SideBar>
<SideBar class="mb-4 row-start-2 col-span-2 lg:row-start-1 lg:col-span-1 lg:max-w-[17.5rem] onload-animation" headings={headings}></SideBar>
<main id="swup-container" class="transition-swup-fade col-span-2 lg:col-span-1 overflow-visible min-w-0">
<main id="swup-container" class="transition-swup-fade row-start-1 col-span-2 lg:row-start-1 lg:col-span-1 overflow-visible min-w-0">
<div id="content-wrapper" class="onload-animation">
<!-- the overflow-hidden here prevent long text break the layout-->
<!-- make id different from windows.swup global property -->
<slot></slot>
<div class="footer col-span-2 onload-animation hidden lg:block">
<Footer></Footer>
</div>
</div>
</main>
<div class="footer col-span-2 onload-animation block lg:hidden">
<div class="footer col-span-2 row-start-3 lg:col-span-1 lg:col-start-2 lg:row-start-2 onload-animation">
<Footer></Footer>
</div>
</div>