kate522/wordpress-theme-aksrt
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(frontend): align layouts posts and widgets with zibll

Browse Source
This commit is contained in:
kate522 committed 2026-08-17 21:47:40 +08:00
1 parent 526364b438
commit 5d45eb053b
27 files changed
+3222 -2777
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

assets/css/frontend/layout.css
+2 -105
View File
@@ -57,9 +57,8 @@
* body.site-layout-2 = sidebar right
* body.site-layout-3 = sidebar left
*
* Desktop columns use Grid so the sidebar is always a real second column.
* The float rules below remain as a narrow-screen compatibility fallback;
* below 768px the sidebar is intentionally hidden.
* This intentionally uses Zibll's float/negative-margin ownership model.
* Below 992px the sidebar is hidden and the content margins collapse.
* ============================================================ */
main.container,
@@ -130,14 +129,6 @@ main.content-shell::after,
display: block;
}
/* Single posts use a theme-specific class. It avoids collisions with legacy
* scripts that treat a generic .sidebar node as disposable page chrome. */
.aksrt-article-sidebar {
display: none;
min-width: 0;
box-sizing: border-box;
}
.content-layout__aside {
min-width: 0;
}
@@ -198,100 +189,6 @@ body.site-layout-3 .sidebar,
position: unset;
}
/* Desktop dual-column geometry.
*
* A full-width floated .content-wrap plus a negatively-margined sidebar can
* leave the sidebar outside the visible painting area when a parent clips
* horizontal overflow. Put the two direct children in explicit grid columns
* instead, so widgets cannot be positioned off-canvas. */
@media (min-width: 768px) {
body.site-layout-2 main.container,
body.site-layout-2 main.content-shell,
body.site-layout-2 .site-main.container {
display: grid;
grid-template-columns: minmax(0, 1fr) var(--sidebar-width, 311px);
column-gap: 15px;
align-items: start;
}
body.site-layout-3 main.container,
body.site-layout-3 main.content-shell,
body.site-layout-3 .site-main.container {
display: grid;
grid-template-columns: var(--sidebar-width, 311px) minmax(0, 1fr);
column-gap: 15px;
align-items: start;
}
body.site-layout-2 main.container::after,
body.site-layout-2 main.content-shell::after,
body.site-layout-2 .site-main.container::after,
body.site-layout-3 main.container::after,
body.site-layout-3 main.content-shell::after,
body.site-layout-3 .site-main.container::after {
content: none;
}
body.site-layout-2 main.container > .content-wrap,
body.site-layout-2 main.content-shell > .content-wrap,
body.site-layout-2 .site-main.container > .content-wrap {
float: none;
grid-column: 1;
grid-row: 1;
width: auto;
}
body.site-layout-3 main.container > .content-wrap,
body.site-layout-3 main.content-shell > .content-wrap,
body.site-layout-3 .site-main.container > .content-wrap {
float: none;
grid-column: 2;
grid-row: 1;
width: auto;
}
body.site-layout-2 main.container > .content-wrap > .content-layout,
body.site-layout-2 main.content-shell > .content-wrap > .content-layout,
body.site-layout-2 .site-main.container > .content-wrap > .content-layout,
body.site-layout-3 main.container > .content-wrap > .content-layout,
body.site-layout-3 main.content-shell > .content-wrap > .content-layout,
body.site-layout-3 .site-main.container > .content-wrap > .content-layout {
width: auto;
margin-right: 0;
margin-left: 0;
}
body.site-layout-2 main.container > .sidebar,
body.site-layout-2 main.content-shell > .sidebar,
body.site-layout-2 .site-main.container > .sidebar,
body.site-layout-2 main.container > .aksrt-article-sidebar,
body.site-layout-2 main.content-shell > .aksrt-article-sidebar,
body.site-layout-2 .site-main.container > .aksrt-article-sidebar {
display: block;
float: none;
grid-column: 2;
grid-row: 1;
width: var(--sidebar-width, 311px);
margin-left: 0;
position: relative;
}
body.site-layout-3 main.container > .sidebar,
body.site-layout-3 main.content-shell > .sidebar,
body.site-layout-3 .site-main.container > .sidebar,
body.site-layout-3 main.container > .aksrt-article-sidebar,
body.site-layout-3 main.content-shell > .aksrt-article-sidebar,
body.site-layout-3 .site-main.container > .aksrt-article-sidebar {
display: block;
float: none;
grid-column: 1;
grid-row: 1;
width: var(--sidebar-width, 311px);
margin-left: 0;
position: relative;
}
}
/* Sticky widgets inside sidebar */
@media (min-width: 992px) {
body.site-layout-2 .sidebar .posts-nav-box,