MediaWiki:Citizen.css：修订间差异

2026年1月29日 (四) 20:01的版本

/* =========================================================

   Blockland Wiki 终极视觉修正 (去蓝纯净版)

   功能：1000px搜索框 + 弹性动画 + 纯白/深灰配色 + 强制去色

   ========================================================= */



/* 1. 全局核心：强制覆盖 Citizen 的颜色计算逻辑 */

:root {

    /* 背景绝对纯白/浅灰，不带任何色相 */

    --color-surface-0: #fafafa !important;

    --color-surface-1: #ffffff !important;

    --color-surface-2: #ffffff !important;

    --color-surface-search: #ffffff !important;

    

    /* 文字颜色：深黑灰，确保对比度 */

    --color-base-0: #202122 !important;

    --color-base-30: #54595d !important;

    --color-heading: #000000 !important;



    /* 链接颜色：保留蓝色作为交互提示，但平时不干扰 */

    --color-primary: #0056b3 !important;

    

    /* 【关键】杀掉 Citizen 默认的“品牌色混合透明层” */

    --background-color-interactive-subtle: rgba(0, 0, 0, 0.05) !important;

    --color-primary-opacity-10: rgba(0, 0, 0, 0.05) !important;

}



/* 2. 搜索面板 (1000px 宽 + 彻底去蓝) */

.citizen-command-palette {

    position: fixed !important;

    width: 1000px !important;

    max-width: 95vw !important;

    top: 50% !important;

    left: 50% !important;

    margin: 0 !important;

    z-index: 10000 !important;

    

    /* 动画初始状态 */

    opacity: 0 !important;

    transform: translate(-50%, -50%) scale(0.95) !important;



    /* 【核心去蓝修复】 */

    /* 1. 背景色提高不透明度到 0.9，用纯白压住底色 */

    background-color: rgba(255, 255, 255, 0.9) !important;

    /* 2. 饱和度设为 0% (saturate(0%))！这是关键，它会把透出来的任何蓝色都变成灰色 */

    backdrop-filter: blur(20px) saturate(0%) !important;

    -webkit-backdrop-filter: blur(20px) saturate(0%) !important;

    

    border-radius: 16px !important;

    border: 1px solid rgba(0, 0, 0, 0.08) !important;

    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25) !important;

    

    transition: opacity 0.3s ease-out, transform 0.3s cubic-bezier(0.18, 0.89, 0.32, 1.28) !important;

}



/* 动画激活态 */

.citizen-command-palette.glass-show {

    opacity: 1 !important;

    transform: translate(-50%, -50%) scale(1) !important;

}



/* 3. 搜索框内部元素去色 */

.citizen-command-palette__search,

.citizen-command-palette__results,

.citizen-command-palette__footer,

.cdx-text-input__input {

    background: transparent !important;

    background-color: transparent !important;

    border: none !important;

    box-shadow: none !important;

    color: #202122 !important; /* 强制黑字 */

}



/* 4. 侧边栏/菜单/个人中心 (统一去蓝风) */

.citizen-menu__card,

#citizen-preferences__card,

.citizen-sticky-header-background,

.citizen-drawer {

    background-color: rgba(255, 255, 255, 0.8) !important;

    /* 同样使用饱和度0%，防止菜单泛蓝 */

    backdrop-filter: blur(12px) saturate(0%) !important;

    -webkit-backdrop-filter: blur(12px) saturate(0%) !important;

    border: 1px solid rgba(0, 0, 0, 0.05) !important;

}