跳转到内容
打开/关闭菜单
  • 451 条目
  • 798 文件
  • 22 用户
  • 8983 编辑
Blockland Wiki
打开/关闭外观设置菜单
打开/关闭个人菜单
未登录
未登录用户的IP地址会在进行任意编辑后公开展示。

MediaWiki:Kuranoka.css:修订间差异

MediaWiki界面页面
无编辑摘要
无编辑摘要
 
(未显示同一用户的10个中间版本)
第1行: 第1行:


/* ==========================================
/* ==========================================
   Kuranoka · Summer Sky Theme
   Kuranoka · 世界の彼方
   Blockland Wiki / Citizen Skin
   Blockland Wiki · Modern Aero UI OS26.2
 
  保留全站 Citizen 的玻璃设计
  只定制背景、正文、标题文字
  ========================================== */
 
 
/* ==========================================
  1. 页面背景
   ========================================== */
   ========================================== */


/* ---------- 1. 夏季晴空背景 ---------- */
body.skin-citizen.page-Kuranoka {
    background-color: #313b76 !important;


body.skin-citizen {
     background-image:
     background-image:
        linear-gradient(
            to bottom,
            rgba(145, 200, 255, 0.06),
            rgba(255, 255, 255, 0.12)
        ),
         url("https://i.postimg.cc/VL43HCvj/72af46ed-af75-4059-b45d-1123d712f39b.png") !important;
         url("https://i.postimg.cc/VL43HCvj/72af46ed-af75-4059-b45d-1123d712f39b.png") !important;


第20行: 第23行:
     background-repeat: no-repeat !important;
     background-repeat: no-repeat !important;
     background-attachment: fixed !important;
     background-attachment: fixed !important;
    background-color: #9acbf2 !important;


     /* 让默认页面底色透明 */
     /* 仅使页面基础表面透明 */
     --color-surface-0: transparent;
     --color-surface-0: transparent;
}
}


/* ---------- 2. 正文毛玻璃面板 ---------- */
 
/* ==========================================
  2. 页面外层透明
  不修改 Citizen 的布局尺寸
  ========================================== */
 
body.page-Kuranoka .citizen-page-container,
body.page-Kuranoka .citizen-body-container {
    background-color: transparent !important;
}




/* ==========================================
  3. 正文玻璃参数
  ========================================== */


/* ---------- 3. 正文内部保持透明 ---------- */
body.page-Kuranoka {


body.skin-citizen .mw-body,
    /* 白天:白色玻璃
body.skin-citizen .mw-parser-output,
      夜晚:深灰玻璃
body.skin-citizen .citizen-page-container {
      自动匹配网站的主题 */
    background-color: transparent !important;
}


/* ---------- 4. 顶部导航毛玻璃 ---------- */
    --kk-body-glass: light-dark(
        rgba(255, 255, 255, 0.5),
        rgba(38, 39, 42, 0.5)
    );


body.skin-citizen .citizen-header {
    /* 模糊程度 */
    background: rgba(255, 255, 255, 0.65) !important;
    --kk-body-blur: 4px;


     backdrop-filter: blur(16px);
     /* 边框 */
     -webkit-backdrop-filter: blur(16px);
     --kk-body-border: var(--bl-border);


    border-bottom: 1px solid rgba(255, 255, 255, 0.4);
}
}


/* ---------- 5. 正文标题与文字 ---------- */


body.skin-citizen .mw-body {
/* ==========================================
    color: #253951;
  4. 正文毛玻璃
}
  只作用于 #bodyContent
  ========================================== */


body.skin-citizen .mw-body h1,
body.page-Kuranoka #bodyContent.citizen-body {
body.skin-citizen .mw-body h2,
body.skin-citizen .mw-body h3,
body.skin-citizen .mw-body h4 {
    color: #203650;
}


/* ---------- 6. 链接主题色 ---------- */
    box-sizing: border-box;
    min-width: 0;


body.skin-citizen {
     background: var(--kk-body-glass) !important;
     --color-primary: #428fda;
    --color-link: #327bc8;
    --color-link--visited: #6b7fca;
}


/* ---------- 7. 目录与正文协调 ---------- */
    backdrop-filter:
        blur(var(--kk-body-blur)) !important;


body.skin-citizen .citizen-toc {
    -webkit-backdrop-filter:
    background: rgba(255, 255, 255, 0.88) !important;
        blur(var(--kk-body-blur)) !important;


     backdrop-filter: blur(18px);
     border:
    -webkit-backdrop-filter: blur(18px);
        1px solid var(--kk-body-border) !important;


    border: 1px solid rgba(255, 255, 255, 0.5);
     border-radius: 12px;
     border-radius: 12px;


     box-shadow:
     box-shadow:
         0 6px 24px rgba(40, 85, 135, 0.10);
         0 6px 24px
        var(--bl-shadow-color-sm);
 
    padding: 20px;
 
}
}


/* ---------- 8. 深色模式 ---------- */


html.skin-theme-clientpref-night body.skin-citizen {
/* ==========================================
     --color-surface-0: transparent;
  5. 正文内部保持透明
  ========================================== */
 
body.page-Kuranoka #mw-content-text,
body.page-Kuranoka .mw-parser-output {
     background-color: transparent !important;
}
}


html.skin-theme-clientpref-night
body.skin-citizen .citizen-body-container {
    background: rgba(24, 34, 52, 0.88) !important;


     border-color: rgba(180, 210, 255, 0.12);
/* ==========================================
  6. 页面标题:白色文字
  不修改标题栏背景
  ========================================== */
 
body.page-Kuranoka #firstHeading,
body.page-Kuranoka #firstHeading span {
     color: #ffffff !important;
}
}


html.skin-theme-clientpref-night
/* 标题下方的小字 */
body.skin-citizen .mw-body,
body.page-Kuranoka #siteSub {
html.skin-theme-clientpref-night
     color: rgba(255, 255, 255, 0.85) !important;
body.skin-citizen .mw-body h1,
html.skin-theme-clientpref-night
body.skin-citizen .mw-body h2,
html.skin-theme-clientpref-night
body.skin-citizen .mw-body h3 {
     color: #e8f1ff;
}
}


/* ---------- 9. 移动端优化 ---------- */


@media (max-width: 768px) {
/* ==========================================
  7. 目录:不修改外观
  仅隐藏内部滚动条
  ========================================== */
 
/* Firefox */
 
body.page-Kuranoka #citizen-toc {
    scrollbar-width: none !important;
}


    body.skin-citizen {
/* Chrome、Edge、Safari */
        background-attachment: scroll !important;
    }


    body.skin-citizen .citizen-body-container {
body.page-Kuranoka
        border-radius: 8px;
#citizen-toc::-webkit-scrollbar {
        backdrop-filter: blur(10px);
    display: none !important;
        -webkit-backdrop-filter: blur(10px);
    width: 0 !important;
    }
    height: 0 !important;
}
}


/* ---------- 10. 减少动态效果 ---------- */


@media (prefers-reduced-motion: reduce) {
/* ==========================================
     body.skin-citizen {
  8. 移动端
  ========================================== */
 
@media screen and (max-width: 768px) {
 
     body.page-Kuranoka {
         background-attachment: scroll !important;
         background-attachment: scroll !important;
        background-position: center top !important;
     }
     }
}


    body.page-Kuranoka
    #bodyContent.citizen-body {
        padding: 12px;
        border-radius: 8px;
    }


/* ===============================
  Kuranoka 正文独立毛玻璃
  =============================== */
/* 大容器恢复透明 */
body.skin-citizen .citizen-body-container {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}
}


/* 只给正文文章区域添加白色毛玻璃 */
body.skin-citizen .mw-body {
    background: rgba(255, 255, 255, 0.86) !important;


    backdrop-filter: blur(18px);
/* ==========================================
    -webkit-backdrop-filter: blur(18px);
  9. 系统减少动态效果
  ========================================== */


    border: 1px solid rgba(255, 255, 255, 0.55);
@media (prefers-reduced-motion: reduce) {
    border-radius: 14px;


     box-shadow: 0 8px 32px rgba(40, 85, 135, 0.12);
     body.page-Kuranoka {
 
        background-attachment: scroll !important;
     padding: 24px;
     }
}


/* 避免正文内部再次叠加背景 */
body.skin-citizen .mw-parser-output {
    background: transparent !important;
}
}

2026年10月20日 (二) 00:23的最新版本


/* ==========================================
   Kuranoka · 世界の彼方
   Blockland Wiki · Modern Aero UI OS26.2

   保留全站 Citizen 的玻璃设计
   只定制背景、正文、标题文字
   ========================================== */


/* ==========================================
   1. 页面背景
   ========================================== */

body.skin-citizen.page-Kuranoka {
    background-color: #313b76 !important;

    background-image:
        url("https://i.postimg.cc/VL43HCvj/72af46ed-af75-4059-b45d-1123d712f39b.png") !important;

    background-position: center center !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;

    /* 仅使页面基础表面透明 */
    --color-surface-0: transparent;
}


/* ==========================================
   2. 页面外层透明
   不修改 Citizen 的布局尺寸
   ========================================== */

body.page-Kuranoka .citizen-page-container,
body.page-Kuranoka .citizen-body-container {
    background-color: transparent !important;
}


/* ==========================================
   3. 正文玻璃参数
   ========================================== */

body.page-Kuranoka {

    /* 白天:白色玻璃
       夜晚:深灰玻璃
       自动匹配网站的主题 */

    --kk-body-glass: light-dark(
        rgba(255, 255, 255, 0.5),
        rgba(38, 39, 42, 0.5)
    );

    /* 模糊程度 */
    --kk-body-blur: 4px;

    /* 边框 */
    --kk-body-border: var(--bl-border);

}


/* ==========================================
   4. 正文毛玻璃
   只作用于 #bodyContent
   ========================================== */

body.page-Kuranoka #bodyContent.citizen-body {

    box-sizing: border-box;
    min-width: 0;

    background: var(--kk-body-glass) !important;

    backdrop-filter:
        blur(var(--kk-body-blur)) !important;

    -webkit-backdrop-filter:
        blur(var(--kk-body-blur)) !important;

    border:
        1px solid var(--kk-body-border) !important;

    border-radius: 12px;

    box-shadow:
        0 6px 24px
        var(--bl-shadow-color-sm);

    padding: 20px;

}


/* ==========================================
   5. 正文内部保持透明
   ========================================== */

body.page-Kuranoka #mw-content-text,
body.page-Kuranoka .mw-parser-output {
    background-color: transparent !important;
}


/* ==========================================
   6. 页面标题:白色文字
   不修改标题栏背景
   ========================================== */

body.page-Kuranoka #firstHeading,
body.page-Kuranoka #firstHeading span {
    color: #ffffff !important;
}

/* 标题下方的小字 */
body.page-Kuranoka #siteSub {
    color: rgba(255, 255, 255, 0.85) !important;
}


/* ==========================================
   7. 目录:不修改外观
   仅隐藏内部滚动条
   ========================================== */

/* Firefox */

body.page-Kuranoka #citizen-toc {
    scrollbar-width: none !important;
}

/* Chrome、Edge、Safari */

body.page-Kuranoka
#citizen-toc::-webkit-scrollbar {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
}


/* ==========================================
   8. 移动端
   ========================================== */

@media screen and (max-width: 768px) {

    body.page-Kuranoka {
        background-attachment: scroll !important;
        background-position: center top !important;
    }

    body.page-Kuranoka
    #bodyContent.citizen-body {
        padding: 12px;
        border-radius: 8px;
    }

}


/* ==========================================
   9. 系统减少动态效果
   ========================================== */

@media (prefers-reduced-motion: reduce) {

    body.page-Kuranoka {
        background-attachment: scroll !important;
    }

}