MediaWiki:Kuranoka.css
MediaWiki界面页面
更多操作
注意:在发布之后,您可能需要清除浏览器缓存才能看到所作出的更改的影响。
- Firefox或Safari:按住Shift的同时单击刷新,或按Ctrl-F5或Ctrl-R(Mac为⌘-R)
- Google Chrome:按Ctrl-Shift-R(Mac为⌘-Shift-R)
- Edge:按住Ctrl的同时单击刷新,或按Ctrl-F5。
/* ============================================
Kuranoka · 世界の彼方
Blockland Wiki / Citizen Skin
Sky Glass Theme
============================================ */
/* ===== 1. 主题参数 ===== */
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. 页面背景 ===== */
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;
}
/* ===== 3. Citizen 外层透明 ===== */
body.page-Kuranoka .citizen-page-container,
body.page-Kuranoka .citizen-body-container,
body.page-Kuranoka main.mw-body {
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;
min-width: 0;
background: var(--kk-glass-bg) !important;
backdrop-filter: blur(var(--kk-glass-blur));
-webkit-backdrop-filter: blur(var(--kk-glass-blur));
border: 1px solid var(--kk-glass-border);
border-radius: 12px;
box-shadow:
0 8px 30px rgba(8, 12, 45, 0.10);
padding: 20px;
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 {
background: transparent !important;
}
/* ===== 6. 正文标题统一白色 ===== */
body.page-Kuranoka #bodyContent .mw-heading h2,
body.page-Kuranoka #bodyContent .mw-heading h3,
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. 正文文字 ===== */
body.page-Kuranoka #mw-content-text {
color: var(--kk-text);
}
body.page-Kuranoka #mw-content-text p,
body.page-Kuranoka #mw-content-text li {
color: inherit;
}
/* 链接使用浅蓝色 */
body.page-Kuranoka #mw-content-text a:not(.new) {
--color-link: var(--kk-link);
--color-link--visited: var(--kk-link-visited);
}
/* ===== 8. 页面顶部标题 ===== */
body.page-Kuranoka #citizen-page-header {
background: rgba(16, 24, 60, 0.30) !important;
backdrop-filter: blur(4px);
-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. 右侧目录 ===== */
body.page-Kuranoka #citizen-toc {
background: rgba(20, 28, 65, 0.30) !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. 信息框维持正常可读性 ===== */
/* 你的信息框本来就是浅蓝、白色设计,
所以不强制改成深色。 */
body.page-Kuranoka .mw-parser-output .infobox {
color: #253650;
}
body.page-Kuranoka .mw-parser-output .infobox a {
--color-link: #347ac0;
--color-link--visited: #706cba;
}
/* ===== 11. 深色模式 ===== */
/* 深色模式沿用蓝紫玻璃,不再变成白色 */
html.skin-theme-clientpref-night
body.page-Kuranoka {
--kk-glass-bg: rgba(16, 22, 55, 0.46);
--kk-text: #f2f5ff;
--kk-heading: #ffffff;
--kk-link: #b2d5ff;
--kk-link-visited: #cebdff;
}
/* ===== 12. 浅色模式 ===== */
/* 浅色模式保持清透玻璃,
使用深色文字保证对比度。 */
html:not(.skin-theme-clientpref-night)
body.page-Kuranoka {
--kk-glass-bg: rgba(246, 248, 255, 0.48);
--kk-text: #263750;
--kk-heading: #ffffff;
--kk-link: #337cbd;
--kk-link-visited: #7568b3;
}
/* 浅色模式的正文标题改成深蓝,
避免在浅色玻璃上看不清。 */
html:not(.skin-theme-clientpref-night)
body.page-Kuranoka #bodyContent .mw-heading h2,
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 (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;
}
}
/* ===== 14. 减少动态效果 ===== */
@media (prefers-reduced-motion: reduce) {
body.page-Kuranoka {
background-attachment: scroll !important;
}
}