kate522
9496db5171
Drop the invented .post-breadcrumbs wrapper and echo the breadcrumb inside the reference's flex jsb at row; split .single-video .breadcrumb out of the cover-overlay rule (-6px pull and opacity reset belong to title-over-cover contexts only) and restore the legacy 15px footer padding. Pin the structure in the cover contract test and rebuild the homepage aggregates.
122 lines
2.8 KiB
CSS
122 lines
2.8 KiB
CSS
/* ========== 面包屑导航 — 对齐 legacy .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: 0 0 12px;
|
||
opacity: 0.6;
|
||
line-height: 1.8;
|
||
list-style: none;
|
||
}
|
||
|
||
.breadcrumb-nav ol,
|
||
.breadcrumb-nav ul,
|
||
ul.breadcrumb,
|
||
.breadcrumbs.breadcrumb {
|
||
list-style: none;
|
||
margin: 0;
|
||
padding: 0;
|
||
display: block;
|
||
}
|
||
|
||
/* legacy uses flat li + li:before separators (not flex-gap nodes) */
|
||
.breadcrumb > li,
|
||
ul.breadcrumb > li,
|
||
.breadcrumb-nav li,
|
||
.breadcrumbs.breadcrumb > li {
|
||
display: inline;
|
||
}
|
||
|
||
.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 a,
|
||
ul.breadcrumb a,
|
||
.breadcrumb-nav a,
|
||
.breadcrumbs a {
|
||
color: var(--muted-2-color, var(--color-ink-4, #999));
|
||
text-decoration: none;
|
||
transition: color 0.2s;
|
||
}
|
||
|
||
.breadcrumb a:hover,
|
||
ul.breadcrumb a:hover,
|
||
.breadcrumb-nav a:hover,
|
||
.breadcrumbs a:hover {
|
||
color: var(--focus-color, var(--color-primary, #f04494));
|
||
}
|
||
|
||
.breadcrumb > li:last-child,
|
||
ul.breadcrumb > li:last-child,
|
||
.breadcrumb-nav .current,
|
||
.breadcrumbs__item.is-current {
|
||
color: var(--main-color, var(--color-ink-2, #4e5358));
|
||
}
|
||
|
||
/* Cover overlay breadcrumb — legacy .single-cover-con：标题叠加封面，
|
||
面包屑需要 -6px 左拉与不透明度还原。 */
|
||
.single-cover-con .breadcrumb,
|
||
.single-cover-con ul.breadcrumb,
|
||
.single-cover-con .breadcrumb-nav {
|
||
font-size: 13px;
|
||
margin: 5px 0 0 -6px;
|
||
opacity: unset;
|
||
padding: 0;
|
||
background: transparent;
|
||
}
|
||
|
||
/* Video footer breadcrumb — legacy .single-video .breadcrumb：标题在下方
|
||
footer（flex jsb at 行）不叠加封面，只归零内边距，保留基础弱化样式
|
||
（opacity .6 与 12px 下边距），对齐 zibll main.css。 */
|
||
.single-video .breadcrumb {
|
||
padding: 0;
|
||
}
|
||
|
||
.single-cover-con .breadcrumb,
|
||
.single-cover-con ul.breadcrumb,
|
||
.single-cover-con .breadcrumb-nav {
|
||
color: rgba(255, 255, 255, 0.85);
|
||
}
|
||
|
||
.single-cover-con .breadcrumb a,
|
||
.single-cover-con ul.breadcrumb a,
|
||
.single-cover-con .breadcrumb-nav a {
|
||
color: rgba(255, 255, 255, 0.85);
|
||
}
|
||
|
||
.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 > li:last-child,
|
||
.single-cover-con ul.breadcrumb > li:last-child {
|
||
color: #fff;
|
||
}
|
||
|
||
@media (max-width: 767px) {
|
||
.breadcrumb,
|
||
ul.breadcrumb,
|
||
.breadcrumb-nav,
|
||
.breadcrumbs-wrap {
|
||
font-size: 12px;
|
||
}
|
||
}
|