MediaWiki:Common.css:修订间差异
MediaWiki界面页面
更多操作
无编辑摘要 标签:已被回退 |
无编辑摘要 标签:已被回退 |
||
| 第1行: | 第1行: | ||
/* =================================================== | |||
* 【方案一】 琉璃幻紫 (现代极简悬浮风) | |||
* =================================================== */ | |||
:root { | :root { | ||
--brand- | --brand-purple: #7e22ce; /* 核心主题紫 */ | ||
--brand- | --brand-purple-light: #f3e8ff; /* 极浅呼吸紫(用于高亮底色) */ | ||
--brand- | --brand-purple-shadow: rgba(126, 34, 206, 0.08); /* 紫色弥散阴影 */ | ||
-- | --brand-bg: #fafafa; /* 全局网页背景色(极浅灰) */ | ||
} | } | ||
body { | body { background-color: var(--brand-bg) !important; } | ||
.mw-parser-output a { color: var(--brand-purple); text-decoration: none; font-weight: 500; } | |||
.mw-parser-output a:hover { color: #9333ea; text-decoration: underline; } | |||
} | |||
/* --- | /* --- 1. 顶部导航 (Header) --- */ | ||
/* | /* 纯白背景,底部带有极微弱的紫边和阴影 */ | ||
.citizen- | .citizen-header { | ||
background-color: #ffffff !important; | |||
border-bottom: 1px solid var(--brand-purple-light) !important; | |||
box-shadow: 0 4px 24px var(--brand-purple-shadow) !important; | |||
} | } | ||
.citizen-search-box { background-color: var(--brand-bg) !important; border-radius: 20px !important; } | |||
.citizen-search-box:focus-within { background-color: #ffffff !important; border: 1px solid var(--brand-purple) !important; box-shadow: 0 0 0 3px var(--brand-purple-light) !important; } | |||
/* --- | /* --- 2. 侧边信息框 (Infobox) --- */ | ||
. | /* 无边框设计,大圆角,悬浮阴影,极度干净 */ | ||
.mw-parser-output table.infobox { | |||
background-color: #ffffff !important; | background-color: #ffffff !important; | ||
border | border: none !important; | ||
border-radius: 16px !important; | |||
padding: 20px !important; | |||
box-shadow: 0 | box-shadow: 0 8px 32px var(--brand-purple-shadow) !important; | ||
} | } | ||
.mw-parser-output table.infobox th { background-color: var(--brand-purple-light) !important; color: var(--brand-purple) !important; border-radius: 8px !important; } | |||
.mw-parser-output table.infobox th.infobox-header { background-color: var(--brand-purple) !important; color: #ffffff !important; border-radius: 8px 8px 0 0 !important; } | |||
.mw-parser-output table.infobox td { border-bottom: 1px dashed #eaeaea !important; } | |||
/* --- 3. 底部导航栏 (Navbox) --- */ | |||
.mw-parser-output table.navbox { | |||
background-color: #ffffff !important; | |||
border: none !important; | |||
border-radius: 16px !important; | |||
. | box-shadow: 0 8px 32px var(--brand-purple-shadow) !important; | ||
overflow: hidden !important; | |||
border | |||
} | } | ||
.mw-parser-output table.navbox th.navbox-title { background-color: var(--brand-purple) !important; color: #ffffff !important; } | |||
.mw-parser-output table.navbox td.navbox-group { background-color: var(--brand-purple-light) !important; color: var(--brand-purple) !important; } | |||
.mw-parser-output table.navbox td.navbox-list { border-bottom: 1px solid var(--brand-purple-light) !important; } | |||
/* --- 4. | /* --- 4. 底部页脚 (Footer) --- */ | ||
/* | /* 极简白底,链接为主题紫 */ | ||
.citizen-footer { background-color: #ffffff !important; border-top: 1px solid var(--brand-purple-light) !important; padding: 40px 0 !important; } | |||
.citizen- | #footer-places a { color: var(--brand-purple) !important; font-weight: bold !important; } | ||
} | |||
} | |||
2026年6月3日 (三) 16:58的版本
/* ===================================================
* 【方案一】 琉璃幻紫 (现代极简悬浮风)
* =================================================== */
:root {
--brand-purple: #7e22ce; /* 核心主题紫 */
--brand-purple-light: #f3e8ff; /* 极浅呼吸紫(用于高亮底色) */
--brand-purple-shadow: rgba(126, 34, 206, 0.08); /* 紫色弥散阴影 */
--brand-bg: #fafafa; /* 全局网页背景色(极浅灰) */
}
body { background-color: var(--brand-bg) !important; }
.mw-parser-output a { color: var(--brand-purple); text-decoration: none; font-weight: 500; }
.mw-parser-output a:hover { color: #9333ea; text-decoration: underline; }
/* --- 1. 顶部导航 (Header) --- */
/* 纯白背景,底部带有极微弱的紫边和阴影 */
.citizen-header {
background-color: #ffffff !important;
border-bottom: 1px solid var(--brand-purple-light) !important;
box-shadow: 0 4px 24px var(--brand-purple-shadow) !important;
}
.citizen-search-box { background-color: var(--brand-bg) !important; border-radius: 20px !important; }
.citizen-search-box:focus-within { background-color: #ffffff !important; border: 1px solid var(--brand-purple) !important; box-shadow: 0 0 0 3px var(--brand-purple-light) !important; }
/* --- 2. 侧边信息框 (Infobox) --- */
/* 无边框设计,大圆角,悬浮阴影,极度干净 */
.mw-parser-output table.infobox {
background-color: #ffffff !important;
border: none !important;
border-radius: 16px !important;
padding: 20px !important;
box-shadow: 0 8px 32px var(--brand-purple-shadow) !important;
}
.mw-parser-output table.infobox th { background-color: var(--brand-purple-light) !important; color: var(--brand-purple) !important; border-radius: 8px !important; }
.mw-parser-output table.infobox th.infobox-header { background-color: var(--brand-purple) !important; color: #ffffff !important; border-radius: 8px 8px 0 0 !important; }
.mw-parser-output table.infobox td { border-bottom: 1px dashed #eaeaea !important; }
/* --- 3. 底部导航栏 (Navbox) --- */
.mw-parser-output table.navbox {
background-color: #ffffff !important;
border: none !important;
border-radius: 16px !important;
box-shadow: 0 8px 32px var(--brand-purple-shadow) !important;
overflow: hidden !important;
}
.mw-parser-output table.navbox th.navbox-title { background-color: var(--brand-purple) !important; color: #ffffff !important; }
.mw-parser-output table.navbox td.navbox-group { background-color: var(--brand-purple-light) !important; color: var(--brand-purple) !important; }
.mw-parser-output table.navbox td.navbox-list { border-bottom: 1px solid var(--brand-purple-light) !important; }
/* --- 4. 底部页脚 (Footer) --- */
/* 极简白底,链接为主题紫 */
.citizen-footer { background-color: #ffffff !important; border-top: 1px solid var(--brand-purple-light) !important; padding: 40px 0 !important; }
#footer-places a { color: var(--brand-purple) !important; font-weight: bold !important; }