99 lines
3.6 KiB
CSS
99 lines
3.6 KiB
CSS
/**
|
|
* Zibll Variable Compatibility Layer — Global Bridge
|
|
*
|
|
* Maps Zibll CSS variable names to AKSRT design tokens.
|
|
* This file allows existing Zibll-style markup and third-party components
|
|
* that reference Zibll variables to work correctly in AKSRT.
|
|
*
|
|
* @package AKSRT
|
|
*/
|
|
|
|
/* ============================================================
|
|
* Global bridge (all pages)
|
|
* Maps Zibll variables → AKSRT tokens so any Zibll-style markup works.
|
|
* ============================================================ */
|
|
:root {
|
|
/* Layout (zibll typo preserved for compat) */
|
|
--mian-max-width: var(--container, 1200px);
|
|
|
|
/* Theme color — now matches zibll #f04494 */
|
|
--theme-color: var(--color-primary, #f04494);
|
|
--focus-color: var(--color-primary, #f04494);
|
|
/* zibll focus glow = fixed #fd53a1 @ 0.4 (not the faint primary-soft) */
|
|
--focus-shadow-color: rgba(253, 83, 161, 0.4);
|
|
|
|
/* zibll --focus-color-opacityX — theme-color at fixed alphas.
|
|
Tracks the runtime theme via --color-primary-rgb (injected by
|
|
AKSRT_Scripts::inline_css_vars); fallback RGB = #f04494. */
|
|
--focus-color-opacity1: rgba(var(--color-primary-rgb, 240, 68, 148), 0.1);
|
|
--focus-color-opacity05: rgba(var(--color-primary-rgb, 240, 68, 148), 0.05);
|
|
--focus-color-opacity3: rgba(var(--color-primary-rgb, 240, 68, 148), 0.3);
|
|
|
|
/* Text hierarchy */
|
|
--key-color: var(--color-ink);
|
|
--main-color: var(--color-ink-2);
|
|
--muted-color: var(--color-ink-3);
|
|
--muted-2-color: var(--color-ink-4);
|
|
--muted-3-color: #b1b1b1;
|
|
--muted-4-color: #d2d2d2;
|
|
|
|
/* Surfaces & borders */
|
|
--body-bg-color: var(--surface-page);
|
|
--main-bg-color: var(--surface-1);
|
|
--muted-bg-color: var(--surface-2);
|
|
--main-border-color: var(--color-line);
|
|
--muted-border-color: var(--color-line-soft);
|
|
--main-shadow: rgba(116, 116, 116, 0.08);
|
|
--main-radius: var(--radius, 8px);
|
|
|
|
/* Radius variants */
|
|
--mini-radius: calc(var(--main-radius) / 1.4);
|
|
|
|
/* Blur / glass */
|
|
--blur-bg: rgba(255, 255, 255, 0.8);
|
|
--float-btn-bg: rgba(200, 200, 200, 0.4);
|
|
|
|
/* Header / footer composites */
|
|
--header-bg: var(--blur-bg);
|
|
--header-color: var(--color-ink-2);
|
|
--footer-bg: var(--surface-1);
|
|
--footer-color: var(--color-ink-4);
|
|
|
|
/* Cards — 对齐 zibll 70% */
|
|
--posts-card-scale: 70%;
|
|
--posts-list-scale: 70%;
|
|
--single-cover-scale: 35%;
|
|
}
|
|
|
|
/* zibll --this-* context-coloring DEFAULTS live with the .but system in
|
|
* assets/css/core/buttons.css — they must precede the .b-*/.jb-* color
|
|
* modifiers in source order for the cascade to resolve colored variants
|
|
* correctly, so they cannot sit in this later-loaded bridge file.
|
|
* (Scoped to .but/.badg there, never :root, so .float-btn stays intact.) */
|
|
|
|
/* ============================================================
|
|
* Dark mode bridge — 对齐 zibll dark theme
|
|
* ============================================================ */
|
|
html.dark,
|
|
body.dark-theme {
|
|
--theme-color: var(--color-primary);
|
|
--focus-color: var(--color-primary);
|
|
--focus-shadow-color: rgba(253, 83, 161, 0.25);
|
|
--key-color: var(--color-ink);
|
|
--main-color: var(--color-ink-2);
|
|
--muted-color: var(--color-ink-3);
|
|
--muted-2-color: var(--color-ink-4);
|
|
--muted-3-color: #636469;
|
|
--muted-4-color: #43454a;
|
|
--body-bg-color: var(--surface-page);
|
|
--main-bg-color: var(--surface-1);
|
|
--muted-bg-color: var(--surface-2);
|
|
--main-border-color: var(--color-line);
|
|
--muted-border-color: var(--color-line-soft);
|
|
--main-shadow: rgba(24, 24, 24, 0.1);
|
|
--blur-bg: rgba(50, 51, 53, 0.8);
|
|
--float-btn-bg: rgba(70, 70, 70, 0.4);
|
|
--header-color: var(--color-ink-2);
|
|
--footer-color: var(--color-ink-4);
|
|
}
|