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

MediaWiki:Kuranoka.css:修订间差异

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


/* ============================================
/* ==========================================
   Kuranoka · 世界の彼方
   Kuranoka · 世界の彼方
   Blockland Wiki / Citizen Skin
   Blockland Wiki · Modern Aero UI OS26.2
  Sky Glass Theme
  ============================================ */


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


body.skin-citizen.page-Kuranoka {
    --kk-glass-bg: rgba(22, 29, 65, 0.38);
    --kk-glass-blur: 3px;
    --kk-glass-border: rgba(215, 225, 255, 0.13);
    --kk-text: #f2f5ff;
    --kk-heading: #ffffff;
    --kk-link: #a9cfff;
    --kk-link-visited: #c5baff;
    --color-surface-0: transparent;
}


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


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


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


     background-position: center center !important;
     background-position: center center !important;
第34行: 第23行:
     background-repeat: no-repeat !important;
     background-repeat: no-repeat !important;
     background-attachment: fixed !important;
     background-attachment: fixed !important;
    /* 仅使页面基础表面透明 */
    --color-surface-0: transparent;
}
}


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


body.page-Kuranoka .citizen-page-container,
body.page-Kuranoka .citizen-page-container,
body.page-Kuranoka .citizen-body-container,
body.page-Kuranoka .citizen-body-container {
body.page-Kuranoka main.mw-body {
     background-color: transparent !important;
     background: transparent !important;
 
    border: none !important;
    box-shadow: none !important;
 
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}
}


/* ===== 4. 正文独立玻璃 ===== */


body.page-Kuranoka #bodyContent.citizen-body {
/* ==========================================
    box-sizing: border-box;
  3. 正文玻璃参数
    min-width: 0;
  ========================================== */


    background: var(--kk-glass-bg) !important;
body.page-Kuranoka {


     backdrop-filter: blur(var(--kk-glass-blur));
     /* 白天:白色玻璃
    -webkit-backdrop-filter: blur(var(--kk-glass-blur));
      夜晚:深灰玻璃
      自动匹配网站的主题 */


     border: 1px solid var(--kk-glass-border);
     --kk-body-glass: light-dark(
     border-radius: 12px;
        rgba(255, 255, 255, 0.5),
        rgba(38, 39, 42, 0.5)
     );


     box-shadow:
     /* 模糊程度 */
        0 8px 30px rgba(8, 12, 45, 0.10);
    --kk-body-blur: 4px;


     padding: 20px;
     /* 边框 */
 
     --kk-body-border: var(--bl-border);
     color: var(--kk-text);
 
    --color-base: var(--kk-text);
    --color-emphasized: #ffffff;
    --color-subtle: #c5cde5;


    --color-link: var(--kk-link);
    --color-link--visited: var(--kk-link-visited);
}
}


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


body.page-Kuranoka #mw-content-text,
/* ==========================================
body.page-Kuranoka .mw-parser-output {
  4. 正文毛玻璃
    background: transparent !important;
  只作用于 #bodyContent
}
  ========================================== */


/* ===== 6. 正文标题统一白色 ===== */
body.page-Kuranoka #bodyContent.citizen-body {


body.page-Kuranoka #bodyContent .mw-heading h2,
    box-sizing: border-box;
body.page-Kuranoka #bodyContent .mw-heading h3,
    min-width: 0;
body.page-Kuranoka #bodyContent .mw-heading h4,
body.page-Kuranoka #bodyContent .mw-heading h5,
body.page-Kuranoka #bodyContent .mw-heading h6 {
    color: var(--kk-heading) !important;
}


/* ===== 7. 正文文字 ===== */
    background: var(--kk-body-glass) !important;


body.page-Kuranoka #mw-content-text {
    backdrop-filter:
    color: var(--kk-text);
        blur(var(--kk-body-blur)) !important;
}


body.page-Kuranoka #mw-content-text p,
    -webkit-backdrop-filter:
body.page-Kuranoka #mw-content-text li {
        blur(var(--kk-body-blur)) !important;
    color: inherit;
}


/* 链接使用浅蓝色 */
     border:
body.page-Kuranoka #mw-content-text a:not(.new) {
        1px solid var(--kk-body-border) !important;
     --color-link: var(--kk-link);
    --color-link--visited: var(--kk-link-visited);
}


/* ===== 8. 页面顶部标题 ===== */
    border-radius: 12px;


body.page-Kuranoka #citizen-page-header {
    box-shadow:
    background: rgba(16, 24, 60, 0.30) !important;
        0 6px 24px
        var(--bl-shadow-color-sm);


     backdrop-filter: blur(4px);
     padding: 20px;
    -webkit-backdrop-filter: blur(4px);
 
    border-bottom: 1px solid rgba(255,255,255,0.12);


    --color-base: #ffffff;
    --color-emphasized: #ffffff;
    --color-subtle: #d3ddf5;
}
}


/* Kuranoka 主标题 */
body.page-Kuranoka #firstHeading,
body.page-Kuranoka #firstHeading span,
body.page-Kuranoka #siteSub {
    color: #ffffff !important;
}


/* ===== 9. 右侧目录 ===== */
/* ==========================================
  5. 正文内部保持透明
  ========================================== */


body.page-Kuranoka #citizen-toc {
body.page-Kuranoka #mw-content-text,
    background: rgba(20, 28, 65, 0.30) !important;
body.page-Kuranoka .mw-parser-output {
 
     background-color: transparent !important;
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
 
    border: 1px solid rgba(220,230,255,0.12);
    border-radius: 12px;
 
    box-shadow:
        0 6px 24px rgba(10, 15, 50, 0.08);
 
    color: #eef3ff;
 
    --color-base: #eef3ff;
     --color-emphasized: #ffffff;
    --color-subtle: #c5cde5;
    --color-link: #b5d5ff;
    --color-link--visited: #c5baff;
}
}


/* ===== 10. 信息框维持正常可读性 ===== */


/* 你的信息框本来就是浅蓝、白色设计,
/* ==========================================
   所以不强制改成深色。 */
   6. 页面标题:白色文字
  不修改标题栏背景
  ========================================== */


body.page-Kuranoka .mw-parser-output .infobox {
body.page-Kuranoka #firstHeading,
     color: #253650;
body.page-Kuranoka #firstHeading span {
     color: #ffffff !important;
}
}


body.page-Kuranoka .mw-parser-output .infobox a {
/* 标题下方的小字 */
     --color-link: #347ac0;
body.page-Kuranoka #siteSub {
    --color-link--visited: #706cba;
     color: rgba(255, 255, 255, 0.85) !important;
}
}


/* ===== 11. 深色模式 ===== */


/* 深色模式沿用蓝紫玻璃,不再变成白色 */
/* ==========================================
html.skin-theme-clientpref-night
  7. 目录:不修改外观
body.page-Kuranoka {
  仅隐藏内部滚动条
    --kk-glass-bg: rgba(16, 22, 55, 0.46);
  ========================================== */


    --kk-text: #f2f5ff;
/* Firefox */
    --kk-heading: #ffffff;


    --kk-link: #b2d5ff;
body.page-Kuranoka #citizen-toc {
     --kk-link-visited: #cebdff;
     scrollbar-width: none !important;
}
}


/* ===== 12. 浅色模式 ===== */
/* Chrome、Edge、Safari */
 
/* 浅色模式保持清透玻璃,
  使用深色文字保证对比度。 */


html:not(.skin-theme-clientpref-night)
body.page-Kuranoka
body.page-Kuranoka {
#citizen-toc::-webkit-scrollbar {
    --kk-glass-bg: rgba(246, 248, 255, 0.48);
     display: none !important;
 
     width: 0 !important;
    --kk-text: #263750;
     height: 0 !important;
     --kk-heading: #ffffff;
 
     --kk-link: #337cbd;
     --kk-link-visited: #7568b3;
}
}


/* 浅色模式的正文标题改成深蓝,
  避免在浅色玻璃上看不清。 */


html:not(.skin-theme-clientpref-night)
/* ==========================================
body.page-Kuranoka #bodyContent .mw-heading h2,
  8. 移动端
html:not(.skin-theme-clientpref-night)
  ========================================== */
body.page-Kuranoka #bodyContent .mw-heading h3,
html:not(.skin-theme-clientpref-night)
body.page-Kuranoka #bodyContent .mw-heading h4 {
    color: #294c79 !important;
}


/* ===== 13. 移动端 ===== */
@media screen and (max-width: 768px) {


@media (max-width: 768px) {
     body.page-Kuranoka {
     body.page-Kuranoka {
         background-attachment: scroll !important;
         background-attachment: scroll !important;
第222行: 第154行:
     }
     }


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


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


@media (prefers-reduced-motion: reduce) {
@media (prefers-reduced-motion: reduce) {
     body.page-Kuranoka {
     body.page-Kuranoka {
         background-attachment: scroll !important;
         background-attachment: scroll !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;
    }

}