fix(theme): align reference layouts and restore passing contracts
Align homepage and category discovery, modern widgets, admin controls, quotes, and comments with the reference theme. Remove superseded paths and add rendering and behavior coverage. Update stale asset and finance contracts; all 760 Node tests and 139 widget assertions pass.
This commit is contained in:
kate522 committed
1 parent
b520d29368
commit
8aa116ec43
63 files changed
+1985
-2304
No files matched your search
@@ -49,6 +49,12 @@ a[href] {
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
/* FA5's later .fa rule sets 900; keep outline glyphs at their regular weight. */
|
||||
.fa.far {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.skip-link {
|
||||
position: absolute;
|
||||
left: 16px;
|
||||
|
||||
@@ -1,333 +1,13 @@
|
||||
/**
|
||||
* Homepage Fixed Layout — legacy Visual Parity
|
||||
*
|
||||
* Implements legacy's homepage visual language:
|
||||
* - System font stack with Chinese fallbacks
|
||||
* - 1200px container, 311px sidebar
|
||||
* - Post cards: list mode (190px thumb) + card mode (3-col grid)
|
||||
* - legacy shadow/radius/spacing values
|
||||
* - scale(1.02) thumbnail hover
|
||||
* - Lazy-load animations (blur/fade/scale)
|
||||
* - Full responsive: 1200/991/767/640px breakpoints
|
||||
*
|
||||
* Tab nav / tab panes / sort menu use the legacy class contract
|
||||
* (.index-tab, .ajax-option, .ajaxpager) styled by assets/css/main.css.
|
||||
*/
|
||||
|
||||
/* ================================================================
|
||||
1. HOMEPAGE CONTAINER & TYPOGRAPHY
|
||||
================================================================ */
|
||||
|
||||
/** Homepage inherits the reference navigation, widgets and pagination from main.css. */
|
||||
.aksrt-homepage {
|
||||
font-family: "Helvetica Neue", Helvetica, Arial, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
|
||||
font-size: 16px;
|
||||
font-size: 14px;
|
||||
line-height: 1.42857143;
|
||||
color: var(--main-color, #4e5358);
|
||||
background: transparent;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
/* Slightly looser than stock legacy short pages: air between stream and footer */
|
||||
padding-bottom: 28px;
|
||||
}
|
||||
|
||||
.aksrt-homepage a[href] {
|
||||
transition: color 0.2s, background 0.3s, opacity 0.3s, box-shadow 0.3s, transform 0.3s;
|
||||
}
|
||||
|
||||
/* ================================================================
|
||||
2. LAYOUT SHELL
|
||||
================================================================ */
|
||||
|
||||
.aksrt-homepage__fluid-zone.content-shell,
|
||||
.aksrt-homepage__shell.content-shell {
|
||||
max-width: min(100%, var(--container, 1200px));
|
||||
}
|
||||
|
||||
.aksrt-homepage__fluid-zone.content-shell {
|
||||
padding-top: 18px;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.aksrt-homepage__shell.content-shell {
|
||||
padding-top: 0;
|
||||
/* 36px + a bit more breathing room before footer */
|
||||
padding-bottom: 56px;
|
||||
}
|
||||
|
||||
/* Bottom fluid zone (if any) keeps a little gap above footer */
|
||||
.aksrt-homepage__fluid-zone--bottom {
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.aksrt-homepage {
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
|
||||
.aksrt-homepage__shell.content-shell {
|
||||
padding-bottom: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Dual-column geometry is owned by body.site-layout-* float rules in layout.css. */
|
||||
.aksrt-homepage__content-layout {
|
||||
display: block;
|
||||
gap: 0;
|
||||
}
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
.aksrt-homepage__fluid-zone.content-shell,
|
||||
.aksrt-homepage__shell.content-shell {
|
||||
max-width: 95%;
|
||||
}
|
||||
color: var(--main-color);
|
||||
}
|
||||
|
||||
.aksrt-homepage__content-layout,
|
||||
.aksrt-homepage__content-zone,
|
||||
.aksrt-homepage__fluid-zone,
|
||||
.aksrt-homepage__aside {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.aksrt-homepage__content-zone .widget-card:last-child,
|
||||
.aksrt-homepage__aside .widget:last-child,
|
||||
.aksrt-homepage__fluid-zone .widget-fluid:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
/* ================================================================
|
||||
3. FLUID WIDGETS
|
||||
================================================================ */
|
||||
|
||||
.aksrt-homepage__fluid-zone .widget-fluid {
|
||||
margin-bottom: 20px;
|
||||
background: transparent;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.aksrt-homepage .widget-fluid.widget_aksrt_tab_posts,
|
||||
.aksrt-homepage .widget-fluid.widget_aksrt_category_block,
|
||||
.aksrt-homepage .widget-fluid.widget_aksrt_category_tabs,
|
||||
.aksrt-homepage .widget-fluid.widget_aksrt_category_recommend {
|
||||
padding: 15px;
|
||||
background: var(--surface-1, #fff);
|
||||
border: none;
|
||||
border-radius: var(--main-radius, var(--radius, 8px));
|
||||
box-shadow: var(--shadow-sm);
|
||||
}
|
||||
|
||||
.aksrt-homepage__content-zone .widget-card,
|
||||
.aksrt-homepage__aside .widget {
|
||||
background: var(--surface-1, #fff);
|
||||
padding: 15px;
|
||||
border: none;
|
||||
border-radius: var(--main-radius, var(--radius, 8px));
|
||||
box-shadow: var(--shadow-sm);
|
||||
}
|
||||
|
||||
/* ================================================================
|
||||
4. STREAM TITLE BOX (legacy title-theme / 第N页)
|
||||
================================================================ */
|
||||
|
||||
.title-theme {
|
||||
position: relative;
|
||||
padding-left: 1.2em;
|
||||
font-size: 15px;
|
||||
font-weight: 700;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
.title-theme::before {
|
||||
position: absolute;
|
||||
top: 10%;
|
||||
bottom: 10%;
|
||||
left: 2px;
|
||||
width: 4px;
|
||||
content: "";
|
||||
background: var(--color-primary);
|
||||
border-radius: 5px;
|
||||
box-shadow: 1px 1px 3px -1px var(--color-primary);
|
||||
}
|
||||
|
||||
.flex {
|
||||
/* No !important: the site-layout-1 / fluid-widget-wrap wide-mode rule
|
||||
(.posts-item:not(.card) { display: inline-flex }) must out-rank this
|
||||
utility or the no-sidebar two-column pairing collapses back to
|
||||
half-width stacked rows. */
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.flex.xx,
|
||||
.xx {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.flex1,
|
||||
.flex-1 {
|
||||
flex: 1 1 auto;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.jsb,
|
||||
.jb {
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.ac {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* ================================================================
|
||||
5. PAGINATION
|
||||
================================================================ */
|
||||
|
||||
.aksrt-homepage .navigation.pagination .nav-links,
|
||||
.aksrt-homepage .pagination {
|
||||
gap: 0;
|
||||
margin: 20px 0 10px;
|
||||
}
|
||||
|
||||
.aksrt-homepage .navigation.pagination .page-numbers,
|
||||
.aksrt-homepage .pagination .page-numbers {
|
||||
min-width: 34px;
|
||||
height: 34px;
|
||||
padding: 0 10px;
|
||||
margin: 3px;
|
||||
border: 1px solid transparent;
|
||||
border-radius: var(--radius-xs, 3px);
|
||||
background: var(--surface-4, #eee);
|
||||
color: var(--color-ink-3, #777);
|
||||
font-size: 13px;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
.aksrt-homepage .navigation.pagination .page-numbers:hover,
|
||||
.aksrt-homepage .pagination .page-numbers:hover {
|
||||
opacity: 1;
|
||||
background: var(--color-primary-soft);
|
||||
color: var(--color-primary);
|
||||
}
|
||||
|
||||
.aksrt-homepage .navigation.pagination .current,
|
||||
.aksrt-homepage .pagination .current {
|
||||
background: var(--color-primary, var(--color-primary)) !important;
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
/* ================================================================
|
||||
6. SIDEBAR
|
||||
================================================================ */
|
||||
|
||||
.aksrt-homepage__aside > .aksrt-panel,
|
||||
.aksrt-homepage__aside > .widget {
|
||||
margin-bottom: 15px;
|
||||
padding: 15px;
|
||||
background: var(--surface-1, #fff);
|
||||
border: 0;
|
||||
border-radius: var(--main-radius, var(--radius, 8px));
|
||||
box-shadow: var(--shadow-sm);
|
||||
}
|
||||
|
||||
.aksrt-homepage__aside > .aksrt-panel:last-child,
|
||||
.aksrt-homepage__aside > .widget:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.aksrt-homepage__aside .widget-list li,
|
||||
.aksrt-homepage__aside .widget_recent_entries li,
|
||||
.aksrt-homepage__aside .recent-posts-row {
|
||||
padding-top: 8px;
|
||||
padding-bottom: 8px;
|
||||
}
|
||||
|
||||
.aksrt-homepage__aside .widget-title,
|
||||
.aksrt-homepage__content-zone .widget-title {
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.aksrt-homepage__aside .widget-title {
|
||||
position: relative;
|
||||
margin: 0 0 10px;
|
||||
padding-left: 1.2em;
|
||||
padding-bottom: 8px;
|
||||
font-size: 15px;
|
||||
font-weight: 700;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
.aksrt-homepage__aside .widget-title::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 10%;
|
||||
bottom: 10%;
|
||||
left: 2px;
|
||||
width: 4px;
|
||||
height: auto;
|
||||
background: var(--color-primary, var(--color-primary));
|
||||
border-radius: 5px;
|
||||
box-shadow: 1px 1px 3px -1px var(--color-primary, var(--color-primary));
|
||||
transition: transform 0.4s ease;
|
||||
transform-origin: left;
|
||||
}
|
||||
|
||||
.aksrt-homepage__aside .widget_recent_entries li a,
|
||||
.aksrt-homepage__aside .widget-list li a {
|
||||
font-size: 13px;
|
||||
font-weight: 500;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.aksrt-homepage__aside .widget_recent_entries li {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.aksrt-homepage__aside .widget_search .search-field {
|
||||
height: 40px;
|
||||
border-radius: 30px;
|
||||
background: var(--surface-2, #eee);
|
||||
}
|
||||
|
||||
.aksrt-homepage__aside .widget_search .search-submit {
|
||||
top: 4px;
|
||||
right: 4px;
|
||||
height: 32px;
|
||||
padding: 0 12px;
|
||||
border-radius: 30px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.aksrt-homepage__aside .tag-cloud {
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
.aksrt-homepage__aside .tag-cloud a {
|
||||
padding: 4px 10px;
|
||||
border-radius: 20px;
|
||||
font-size: 12px;
|
||||
border: 0;
|
||||
background: var(--surface-2, #eee);
|
||||
transition: background 0.2s, color 0.2s;
|
||||
}
|
||||
|
||||
.aksrt-homepage__aside .tag-cloud a:hover {
|
||||
background: var(--color-primary, var(--color-primary));
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.aksrt-homepage .widget.notop,
|
||||
.aksrt-homepage .box-body.notop {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
.aksrt-homepage .widget.nobottom,
|
||||
.aksrt-homepage .box-body.nobottom {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.aksrt-homepage .widget.widget_custom_html {
|
||||
padding: 0;
|
||||
background: transparent;
|
||||
box-shadow: none;
|
||||
border-radius: 0;
|
||||
}
|
||||
@@ -253,104 +253,13 @@ body.site-layout-3 .sidebar,
|
||||
max-width: 720px;
|
||||
}
|
||||
|
||||
.term-page-header {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
border: 1px solid var(--color-line-soft, rgba(15, 23, 42, 0.08));
|
||||
border-radius: var(--radius-lg);
|
||||
background: var(--surface-1);
|
||||
box-shadow: var(--shadow-sm, 0 1px 6px rgba(15, 23, 42, 0.04));
|
||||
/* Reference cover ratio must outrank the shared panel padding. */
|
||||
body.category .site-main {
|
||||
line-height: 1.42857143;
|
||||
}
|
||||
|
||||
.term-page-header__body {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
gap: 16px;
|
||||
padding: 24px;
|
||||
}
|
||||
|
||||
.term-page-header__eyebrow {
|
||||
margin: 0 0 8px;
|
||||
font-size: 0.8125rem;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.08em;
|
||||
text-transform: uppercase;
|
||||
color: var(--color-primary);
|
||||
}
|
||||
|
||||
.term-page-header__desc {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.term-page-header__cover {
|
||||
min-height: 140px;
|
||||
background-position: center;
|
||||
background-size: cover;
|
||||
border-top: 1px solid var(--color-line-soft, rgba(15, 23, 42, 0.08));
|
||||
}
|
||||
|
||||
.term-page-header--simple .term-page-header__cover {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Card style: accent top border, slightly more padding */
|
||||
.term-page-header--card {
|
||||
border-top: 3px solid var(--color-primary, #f04494);
|
||||
}
|
||||
|
||||
.term-page-header--card .term-page-header__body {
|
||||
padding: 28px 24px;
|
||||
}
|
||||
|
||||
/* Cover style: full-width hero with background image */
|
||||
.term-page-header--cover {
|
||||
border: none;
|
||||
border-radius: var(--radius-lg);
|
||||
background: transparent;
|
||||
box-shadow: none;
|
||||
min-height: 220px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.term-page-header__cover-bg {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
background-position: center;
|
||||
background-size: cover;
|
||||
border-radius: var(--radius-lg);
|
||||
}
|
||||
|
||||
.term-page-header__cover-overlay {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
background: linear-gradient(135deg, rgba(0, 0, 0, 0.55) 0%, rgba(0, 0, 0, 0.25) 100%);
|
||||
border-radius: var(--radius-lg);
|
||||
}
|
||||
|
||||
.term-page-header--cover .term-page-header__body {
|
||||
flex: 1;
|
||||
align-items: flex-end;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.term-page-header__body--overlay .entry-title,
|
||||
.term-page-header__body--overlay .term-page-header__desc,
|
||||
.term-page-header__body--overlay .term-page-header__eyebrow {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.term-page-header__body--overlay .term-page-header__eyebrow {
|
||||
color: rgba(255, 255, 255, 0.8);
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.term-page-header--cover {
|
||||
min-height: 160px;
|
||||
}
|
||||
.page-cover.aksrt-panel {
|
||||
padding: 0 0 calc(25% + 80px);
|
||||
}
|
||||
|
||||
.aksrt-admin-quicklink {
|
||||
@@ -375,103 +284,18 @@ body.site-layout-3 .sidebar,
|
||||
background: var(--color-primary-soft, rgba(59, 130, 246, 0.08));
|
||||
}
|
||||
|
||||
.archive-filter-bar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 16px;
|
||||
flex-wrap: wrap;
|
||||
margin: -8px 0 24px;
|
||||
padding: 16px 18px;
|
||||
border-radius: var(--radius-lg);
|
||||
background: var(--surface-2);
|
||||
border: 1px solid var(--color-line-soft, rgba(15, 23, 42, 0.06));
|
||||
}
|
||||
|
||||
.archive-filter-bar__main {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.archive-filter-bar__label {
|
||||
color: var(--color-ink-4);
|
||||
font-size: 0.8125rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.archive-filter-bar__chips {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.archive-filter-bar__chip {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
min-height: 34px;
|
||||
padding: 0 12px;
|
||||
border-radius: var(--radius-pill, 999px);
|
||||
background: var(--surface-1);
|
||||
color: var(--color-ink-2);
|
||||
text-decoration: none;
|
||||
font-size: 0.875rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.archive-filter-bar__chip.is-active,
|
||||
.archive-filter-bar__chip:hover {
|
||||
background: var(--color-primary);
|
||||
color: var(--color-on-primary, #fff);
|
||||
}
|
||||
|
||||
.archive-filter-bar__meta {
|
||||
color: var(--color-ink-4);
|
||||
font-size: 0.8125rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.archive-filter-bar__sort {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.archive-filter-bar__main--tags {
|
||||
border-top: 1px solid var(--color-line-soft, rgba(15, 23, 42, 0.06));
|
||||
padding-top: 10px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
/* §3.4 custom_filter dimension rows */
|
||||
.archive-filter-bar__main--custom {
|
||||
border-top: 1px solid var(--color-line-soft, rgba(15, 23, 42, 0.06));
|
||||
padding-top: 10px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
|
||||
.content-stream {
|
||||
display: grid;
|
||||
gap: 20px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.content-main--archive,
|
||||
.content-main--tag,
|
||||
.content-main--category,
|
||||
.content-main--search,
|
||||
.content-main--single {
|
||||
display: grid;
|
||||
gap: 20px;
|
||||
}
|
||||
|
||||
.content-stream__list {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.content-stream__empty {
|
||||
padding: 28px 24px;
|
||||
border-radius: var(--radius-lg);
|
||||
@@ -489,12 +313,6 @@ body.site-layout-3 .sidebar,
|
||||
全站只有一套加载语言。 */
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.term-page-header__body {
|
||||
flex-direction: column;
|
||||
align-items: stretch;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.aksrt-admin-quicklink {
|
||||
width: fit-content;
|
||||
}
|
||||
|
||||
@@ -13,6 +13,33 @@
|
||||
box-shadow: var(--card-shadow, 0 2px 8px rgba(0, 0, 0, .06));
|
||||
}
|
||||
|
||||
.aksrt-yiyan[data-aksrt-yiyan] {
|
||||
cursor: pointer;
|
||||
transition: box-shadow .2s ease, opacity .2s ease;
|
||||
}
|
||||
|
||||
.aksrt-yiyan[data-aksrt-yiyan]:hover,
|
||||
.aksrt-yiyan[data-aksrt-yiyan]:focus-visible {
|
||||
box-shadow: inset 0 0 5px 0 var(--focus-shadow-color, rgba(253, 83, 161, .3));
|
||||
}
|
||||
|
||||
.aksrt-yiyan .yiyan {
|
||||
line-height: 1.8;
|
||||
}
|
||||
|
||||
.aksrt-yiyan .yiyan .en {
|
||||
font-size: .9em;
|
||||
opacity: .8;
|
||||
}
|
||||
|
||||
.aksrt-yiyan.is-loading {
|
||||
opacity: .65;
|
||||
}
|
||||
|
||||
.aksrt-yiyan.is-error .cn {
|
||||
color: var(--muted-color, #777);
|
||||
}
|
||||
|
||||
/* ---- Front / After content insertion ---- */
|
||||
.article-front-content,
|
||||
.article-after-content {
|
||||
|
||||
Reference in new issue
Block a user