kate522
db361fcc3f
Disable the global 2-col .content-layout grid on single pages (it was tiling breadcrumb/article/author/related/comments left-right), add the missing Zibll utility bridge used by the author/meta bar, and replace nonstandard <name>/<item>/<badge> tags in the single surface.
80 lines
2.0 KiB
CSS
80 lines
2.0 KiB
CSS
/* Single page shell — Zibll float dual-column (scoped to body.single) */
|
|
|
|
body.single .container {
|
|
position: relative;
|
|
}
|
|
|
|
body.single .content-wrap {
|
|
float: left;
|
|
width: 100%;
|
|
}
|
|
|
|
/*
|
|
* Global layout.css turns .content-layout into a 2-col grid that expects
|
|
* .content-layout__primary + .content-layout__aside children.
|
|
* Single posts put breadcrumb / article / author / related / comments as
|
|
* direct children and float the sidebar outside — so the grid must be
|
|
* disabled here or those sections tile left/right and look "broken".
|
|
*/
|
|
body.single main.container .content-layout {
|
|
display: block;
|
|
grid-template-columns: none;
|
|
gap: 0;
|
|
width: 100%;
|
|
min-width: 0;
|
|
}
|
|
|
|
body.single main.container .content-layout > * {
|
|
min-width: 0;
|
|
max-width: 100%;
|
|
}
|
|
|
|
/* Clear floats after main dual-column shell */
|
|
body.single main.container::after {
|
|
content: "";
|
|
display: table;
|
|
clear: both;
|
|
}
|
|
|
|
/* Default: no sidebar full width */
|
|
body.single.container--no-sidebar .content-layout,
|
|
body.single .container--no-sidebar .content-layout,
|
|
body.single main.container--no-sidebar .content-layout {
|
|
margin-right: 0;
|
|
}
|
|
|
|
/* Zibll site-layout-2: content left, sidebar right (311px) */
|
|
@media (min-width: 992px) {
|
|
body.single:not(.no-sidebar) main.container:not(.container--no-sidebar) .content-layout {
|
|
margin-right: calc(var(--sidebar-width, 311px) + 15px);
|
|
}
|
|
|
|
body.single:not(.no-sidebar) main.container:not(.container--no-sidebar) > .sidebar {
|
|
float: left;
|
|
width: var(--sidebar-width, 311px);
|
|
margin-left: calc(0px - var(--sidebar-width, 311px));
|
|
position: relative;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 991.98px) {
|
|
body.single main.container > .sidebar {
|
|
display: none;
|
|
}
|
|
|
|
body.single main.container .content-layout {
|
|
margin-right: 0 !important;
|
|
}
|
|
}
|
|
|
|
/* Sidebar widgets spacing */
|
|
body.single .sidebar .zib-widget,
|
|
body.single .sidebar .widget {
|
|
margin-bottom: 15px;
|
|
}
|
|
|
|
body.single .sidebar .posts-nav-box.toc-widget {
|
|
position: sticky;
|
|
top: calc(var(--nav-height, 60px) + 16px);
|
|
}
|