fix(single): restore Zibll float dual-column and article chrome
Align single-post layout/visuals with Zibll: fix sidebar-over-content float geometry (position:unset, 311px token, kill Bootstrap/container padding and the 280px sidebar override), demote theme-box to spacing- only, unify breadcrumb/cover/graphic utilities, and split aksrt-single render helpers under the file-size limit.
This commit is contained in:
@@ -1,12 +1,17 @@
|
||||
/* ========== 面包屑导航 — 对齐 zibll breadcrumb ========== */
|
||||
.breadcrumb-nav,
|
||||
/* ========== 面包屑导航 — 对齐 zibll .breadcrumb (main.css) ========== */
|
||||
/* Single source for breadcrumb chrome. Do not re-define in layout.css. */
|
||||
|
||||
.breadcrumb,
|
||||
ul.breadcrumb,
|
||||
.breadcrumb-nav,
|
||||
.breadcrumbs-wrap {
|
||||
background: transparent;
|
||||
font-size: 13px;
|
||||
padding: 0 8px;
|
||||
margin-bottom: 12px;
|
||||
margin: 0 0 12px;
|
||||
opacity: 0.6;
|
||||
line-height: 1.8;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.breadcrumb-nav ol,
|
||||
@@ -16,90 +21,98 @@ ul.breadcrumb,
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
gap: 0;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.breadcrumb-nav li,
|
||||
/* Zibll uses flat li + li:before separators (not flex-gap nodes) */
|
||||
.breadcrumb > li,
|
||||
ul.breadcrumb > li,
|
||||
.breadcrumb-nav li,
|
||||
.breadcrumbs.breadcrumb > li {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
display: inline;
|
||||
}
|
||||
|
||||
/* Zibll flat ul.breadcrumb inserts parents with " </li><li> " — separators via content */
|
||||
.breadcrumb-nav li + li::before,
|
||||
ul.breadcrumb > li + li::before {
|
||||
content: '/';
|
||||
padding: 0 6px 0 6px;
|
||||
.breadcrumb > li + li:before,
|
||||
ul.breadcrumb > li + li:before,
|
||||
.breadcrumb-nav li + li:before {
|
||||
content: "/";
|
||||
padding: 0 0 0 6px;
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
/* Archive/nav variant may still stamp sep nodes — keep neutral */
|
||||
.breadcrumbs.breadcrumb .breadcrumbs__sep {
|
||||
padding: 0 6px;
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
.breadcrumb-nav a,
|
||||
.breadcrumb a,
|
||||
ul.breadcrumb a,
|
||||
.breadcrumb-nav a,
|
||||
.breadcrumbs a {
|
||||
color: var(--color-ink-4, #999);
|
||||
color: var(--muted-2-color, var(--color-ink-4, #999));
|
||||
text-decoration: none;
|
||||
transition: color 0.2s;
|
||||
}
|
||||
|
||||
.breadcrumb-nav a:hover,
|
||||
.breadcrumb a:hover,
|
||||
ul.breadcrumb a:hover,
|
||||
.breadcrumb-nav a:hover,
|
||||
.breadcrumbs a:hover {
|
||||
color: var(--color-primary, #f04494);
|
||||
color: var(--focus-color, var(--color-primary, #f04494));
|
||||
}
|
||||
|
||||
.breadcrumb-nav .current,
|
||||
.breadcrumb > li:last-child,
|
||||
ul.breadcrumb > li:last-child,
|
||||
.breadcrumb-nav .current,
|
||||
.breadcrumbs__item.is-current {
|
||||
color: var(--color-ink-2, #4e5358);
|
||||
font-weight: 500;
|
||||
color: var(--main-color, var(--color-ink-2, #4e5358));
|
||||
}
|
||||
|
||||
.single-cover-con .breadcrumb-nav,
|
||||
/* Cover / video footer breadcrumb — Zibll single-cover-con / single-video */
|
||||
.single-cover-con .breadcrumb,
|
||||
.single-cover-con ul.breadcrumb,
|
||||
.post-breadcrumbs .breadcrumb {
|
||||
.single-cover-con .breadcrumb-nav,
|
||||
.post-breadcrumbs .breadcrumb,
|
||||
.single-video .breadcrumb {
|
||||
font-size: 13px;
|
||||
margin: 5px 0 0 -6px;
|
||||
opacity: unset;
|
||||
padding: 0;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
/* 封面内面包屑 */
|
||||
.single-cover-con .breadcrumb-nav,
|
||||
.single-video .breadcrumb {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.single-cover-con .breadcrumb,
|
||||
.single-cover-con ul.breadcrumb,
|
||||
.single-cover-con .breadcrumb {
|
||||
.single-cover-con .breadcrumb-nav {
|
||||
color: rgba(255, 255, 255, 0.85);
|
||||
}
|
||||
|
||||
.single-cover-con .breadcrumb-nav a,
|
||||
.single-cover-con .breadcrumb a,
|
||||
.single-cover-con ul.breadcrumb a,
|
||||
.single-cover-con .breadcrumb a {
|
||||
.single-cover-con .breadcrumb-nav a {
|
||||
color: rgba(255, 255, 255, 0.85);
|
||||
}
|
||||
|
||||
.single-cover-con .breadcrumb-nav a:hover,
|
||||
.single-cover-con ul.breadcrumb a:hover {
|
||||
.single-cover-con .breadcrumb a:hover,
|
||||
.single-cover-con ul.breadcrumb a:hover,
|
||||
.single-cover-con .breadcrumb-nav a:hover {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.single-cover-con .breadcrumb-nav .current,
|
||||
.single-cover-con .breadcrumb > li:last-child,
|
||||
.single-cover-con ul.breadcrumb > li:last-child {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
/* 移动端 */
|
||||
@media (max-width: 767px) {
|
||||
.breadcrumb-nav,
|
||||
.breadcrumb,
|
||||
ul.breadcrumb,
|
||||
.breadcrumb-nav,
|
||||
.breadcrumbs-wrap {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user