Files
wordpress-theme-aksrt/assets/css/frontend/layout.css
T
kate522andClaude Opus 5 35bb96e82f refactor: rename the theme brand and every identifier from AKSRT to Jio
Full-project rename. `git grep -i aksrt` is now empty apart from the
DBMigrator 3.3.0 changelog note that documents the rename itself.

Code identifiers
- PHP namespace AKSRT\ -> Jio\ (composer PSR-4 + 378 declarations)
- global constants AKSRT_* -> JIO_* (VERSION/DIR/URI, PAY_TYPE_*, CAPTCHA_*)
- procedural functions, hooks, options, meta keys, table names,
  cookies, query vars, ajax actions and nonces: aksrt_ -> jio_
- text domain aksrt -> jio; Theme Name -> Jio
- JS globals: aksrtData/aksrtAdminData/... -> jioData/jioAdminData/...,
  window.AKSRTCaptcha & friends -> window.JioCaptcha, Aksrt* -> Jio*
- Vue components Aks*.vue -> Jio*.vue (15 files renamed + imports)
- CSS classes/data-attrs/custom properties: aksrt- -> jio-
- REST namespace aksrt/v1 -> jio/v1 (incl. payment gateway callbacks)

Storage layer
- DB tables {prefix}aksrt_* -> {prefix}jio_*; SCHEMA_VERSION 3.2.0 -> 3.3.0
  so dbDelta creates the new names on install
- widget id_base aksrt_widget_* -> jio_widget_*
- uninstall.php drop list rebuilt from the actual migrator tables
  (dropped 3 stale entries, added the 17 missing ones)

Removed
- hardcoded https://api.aksrt.com/version.json default update endpoint;
  get_endpoint() now reads the 「更新端点」 setting and do_check() no-ops
  when it is empty

Files renamed: inc/helpers/aksrt-*.php -> jio-*.php (54),
assets/admin/src/components/form/Aks*.vue -> Jio*.vue (15).
Build artifacts regenerated: assets/css/build, assets/js/runtime,
assets/admin/build.

Verified: audit-psr4-paths errors=0, audit-admin-contracts errors=0
(warnings=56, unchanged baseline), 813/813 widget-system tests,
44/44 phpunit, php -l clean across all PHP.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
2026-11-01 20:05:04 +08:00

408 lines
9.5 KiB
CSS

/* Breadcrumb chrome lives in breadcrumb.css (single source). */
/* ========== 主布局 ========== */
.content-main {
width: 100%;
}
.content-main--single {
max-width: 100%;
}
.content-shell {
width: 100%;
margin: 0 auto;
padding: 32px 16px 48px;
max-width: var(--container);
}
/* 用户中心(双栏)铺满视口:左栏 320 + 间距 20 + 右栏需要横向空间,被
* 阅读宽度收窄会在左右两侧留下大片空白。只有 page-profile.php 的 main 带
* .jio-profile(公开主页的该类只打在 body 上),因此不会误伤其它路由。 */
.site-main.content-shell.jio-profile {
max-width: 100%;
box-sizing: border-box;
}
/* 公开主页是单栏,继续沿用后台「内容最大宽度」。顶部多功能组件位于
* main 之前;main 的通用 32/40px 上内边距会把资料卡与组件人为拉开,
* 这里仅对公开主页清除该段重复空白。 */
.site-main.content-shell.jio-user-home {
max-width: var(--container, 1440px);
padding-top: 0;
box-sizing: border-box;
}
@media (min-width: 768px) {
.content-shell {
padding: 40px 24px 56px;
}
}
/* page.php 专用:阅读宽度收窄 */
.content-shell--page {
max-width: var(--container-page, 860px);
}
.content-shell--cms {
max-width: 100%;
padding: 0;
}
/* page.php 内的元素 */
.entry-page .entry-thumb {
margin: 0 0 var(--space-6, 24px);
border-radius: var(--radius-lg, 12px);
overflow: hidden;
}
.entry-page .page-links {
margin-top: var(--space-6, 24px);
font-size: var(--text-sm, 0.875rem);
color: var(--color-ink-3, var(--color-ink-3));
}
.entry-page .page-links-title {
margin-right: 8px;
font-weight: 600;
}
/* ============================================================
* Site shell — site-layout-1/2/3 dual-column
* DOM: main.container > .content-wrap + .sidebar (siblings)
* body.site-layout-1 = no sidebar
* body.site-layout-2 = sidebar right
* body.site-layout-3 = sidebar left
*
* This intentionally uses legacy's float/negative-margin ownership model.
* Below 992px the sidebar is hidden and the content margins collapse.
* ============================================================ */
main.container,
main.content-shell,
.site-main.container {
position: relative;
}
/* content-shell is a padding shell for non-dual pages; when it also hosts
* the float dual-column, kill horizontal padding so negative-margin math matches legacy. */
main.container.content-shell,
main.content-shell.container,
.site-main.container.content-shell {
padding-left: 0;
padding-right: 0;
max-width: var(--container, var(--mian-max-width, 1200px));
width: 100%;
box-sizing: border-box;
}
main.container::after,
main.content-shell::after,
.site-main.container::after {
content: "";
display: table;
clear: both;
}
/* Float/negative-margin compatibility fallback.
*
* Critical: .content-layout must NOT set width:100%. Under box-sizing:border-box
* a 100% width + margin-right gutter keeps the border-box at full container
* width, so the gutter never shrinks the content box and .sidebar (margin-left:-311px)
* sits under the main column (overlap). legacy only sets margin on .content-layout;
* width stays auto so margin carves out the column. */
.content-wrap {
float: left;
width: 100%;
min-width: 0;
display: block;
box-sizing: border-box;
}
.content-layout {
display: block;
/* width:auto — never 100%; margin must shrink the used width */
width: auto;
min-width: 0;
max-width: none;
margin-right: 0;
margin-left: 0;
box-sizing: border-box;
}
.content-layout__primary {
min-width: 0;
max-width: 100%;
}
/* Base sidebar column (legacy .sidebar defaults) — layout variants override below */
.sidebar {
float: left;
width: 311px; /* legacy hard 311px; --sidebar-width kept in sync via runtime vars */
width: var(--sidebar-width, 311px);
min-width: 0;
position: relative;
box-sizing: border-box;
display: block;
}
.content-layout__aside {
min-width: 0;
}
/* No sidebar */
body.site-layout-1 .sidebar,
.site-layout-1 .sidebar {
display: none;
}
body.site-layout-1 .content-layout,
body.site-layout-1 .content-layout--no-sidebar,
.site-layout-1 .content-layout {
margin-left: 0;
margin-right: 0;
}
/* Compat: templates may still stamp content-layout--no-sidebar */
.content-layout--no-sidebar {
margin-left: 0 !important;
margin-right: 0 !important;
}
/* Sidebar RIGHT (layout 2) — legacy: margin-right: calc(311px + 15px) only */
body.site-layout-2 .content-layout,
.site-layout-2 .content-layout {
margin-right: calc(311px + 15px);
margin-right: calc(var(--sidebar-width, 311px) + 15px);
margin-left: 0;
width: auto;
}
body.site-layout-2 .sidebar,
.site-layout-2 .sidebar {
float: left;
width: 311px;
width: var(--sidebar-width, 311px);
margin-left: -311px;
margin-left: calc(0px - var(--sidebar-width, 311px));
position: unset;
}
/* Sidebar LEFT (layout 3) */
body.site-layout-3 .content-layout,
.site-layout-3 .content-layout {
margin-left: calc(311px + 15px);
margin-left: calc(var(--sidebar-width, 311px) + 15px);
margin-right: unset;
width: auto;
}
body.site-layout-3 .sidebar,
.site-layout-3 .sidebar {
float: left;
width: 311px;
width: var(--sidebar-width, 311px);
margin-left: -100%;
position: unset;
}
/* Sticky widgets inside sidebar */
@media (min-width: 992px) {
.sidebar .content-layout__aside,
.content-layout__aside {
position: sticky;
top: calc(var(--nav-height, 60px) + 16px);
}
.has-static-nav .content-layout__aside {
top: 16px;
}
}
/* Mobile collapse (legacy max-width: 991px) */
@media (max-width: 991.98px) {
body.site-layout-2 .content-layout,
body.site-layout-3 .content-layout,
.site-layout-2 .content-layout,
.site-layout-3 .content-layout {
margin-left: auto;
margin-right: auto;
}
body.site-layout-2 .sidebar,
body.site-layout-3 .sidebar,
.site-layout-2 .sidebar,
.site-layout-3 .sidebar,
.sidebar {
display: none;
}
}
/* ========== 页面标题区 ========== */
.page-header {
margin-bottom: 28px;
}
.page-header .entry-title {
margin-bottom: 8px;
}
.page-header p {
color: var(--color-ink-3);
margin: 0;
max-width: 720px;
}
/* Reference cover ratio must outrank the shared panel padding. */
body.category .site-main {
line-height: 1.42857143;
}
.page-cover.jio-panel {
padding: 0 0 calc(25% + 80px);
}
.jio-admin-quicklink {
display: inline-flex;
align-items: center;
gap: 8px;
min-height: 36px;
padding: 0 14px;
border: 1px solid var(--color-line);
border-radius: var(--radius-pill, 999px);
background: var(--surface-2);
color: var(--color-ink-2);
text-decoration: none;
white-space: nowrap;
font-size: 0.875rem;
font-weight: 600;
}
.jio-admin-quicklink:hover {
color: var(--color-primary);
border-color: var(--color-primary);
background: var(--color-primary-soft, rgba(59, 130, 246, 0.08));
}
.content-stream {
display: block;
}
.content-main--archive,
.content-main--tag,
.content-main--search,
.content-main--single {
display: grid;
gap: 20px;
}
.content-stream__empty {
padding: 28px 24px;
border-radius: var(--radius-lg);
background: var(--surface-1);
border: 1px solid var(--color-line-soft, rgba(15, 23, 42, 0.08));
}
.article-shell {
overflow: hidden;
}
/* 归档面 AJAX 筛选的加载态与首页共用同一套骨架契约:
.post_ajax_loader 容器 + .is-loading 开关(见 frontend/modal-runtime.css)。
原先本文件另有一套独立 spinner 遮罩与 opacity 淡出,已删除 ——
全站只有一套加载语言。 */
@media (max-width: 767px) {
.jio-admin-quicklink {
width: fit-content;
}
}
/* ========== AJAX 分页(加载更多 / 无限滚动) ========== */
.jio-pagination-ajax {
display: flex;
flex-direction: column;
align-items: center;
gap: 16px;
margin: 40px 0 8px;
}
.jio-load-more-btn {
min-width: 180px;
height: 44px;
padding: 0 32px;
border-radius: var(--radius-btn);
border: 1px solid var(--color-line);
background: var(--surface-page);
color: var(--color-ink);
font-size: 14px;
font-weight: 600;
cursor: pointer;
transition: border-color 0.2s, color 0.2s, background 0.2s;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
}
.jio-load-more-btn:hover {
border-color: var(--color-primary);
color: var(--color-primary);
}
.jio-load-more-btn:disabled {
opacity: 0.5;
pointer-events: none;
}
.jio-loading-indicator {
display: none;
align-items: center;
gap: 8px;
font-size: 14px;
color: var(--color-ink-4);
}
.jio-loading-indicator i {
font-size: 16px;
}
.jio-scroll-sentinel {
width: 100%;
height: 1px;
pointer-events: none;
}
/* ========== 移动端/平板隐藏侧栏(与 legacy 一致:991px 以下隐藏) ========== */
@media (max-width: 991px) {
.content-layout__aside {
display: none;
}
}
.content-layout__primary--cms {
min-width: 0;
}
/* ============================================================
* Phase 2 — 侧栏 widget 内链接增强
* ============================================================ */
.content-layout__aside .widget a {
transition: color var(--dur-fast, 0.15s) var(--ease);
}
.content-layout__aside .widget a:hover {
color: var(--color-primary);
}
/* ============================================================
* Phase 5 — 文章操作卡片增强
* ============================================================ */
/* ============================================================
* Phase 6 — 评论卡片容器
* ============================================================ */
.comments-card {
overflow: hidden;
}