MediaWiki:Common.css：修订间差异
SeniorDeveloper（留言 | 贡献） 修复左侧栏目录错位：隐藏侧栏内的TOC，保持正文目录正常 |
v3.1 抽屉滚动兜底 |
||
| （未显示3个用户的3个中间版本） | |||
| 第124行： | 第124行： | ||
display: none !important; | display: none !important; | ||
} | } | ||
/* ===== 自定义侧栏导航 xn-* 古风样式（2026-07-30）===== */ | |||
#mw-panel { | |||
font-family: "Noto Serif SC", "Source Han Serif SC", "Songti SC", "STSong", "SimSun", serif; | |||
} | |||
/* 搜索框 */ | |||
.xn-search { padding: 0 12px 10px; } | |||
.xn-search-input { | |||
width: 100%; | |||
box-sizing: border-box; | |||
padding: 6px 10px; | |||
background: #FBF7F0; | |||
border: 1px solid #E0D5C5; | |||
border-radius: 6px; | |||
font-family: "Noto Serif SC", "Songti SC", "SimSun", serif; | |||
font-size: 0.85em; | |||
color: #5a4a3a; | |||
transition: border-color .2s ease, box-shadow .2s ease; | |||
} | |||
.xn-search-input:focus { | |||
outline: none; | |||
border-color: #C41E3A; | |||
box-shadow: 0 0 0 2px rgba(196,30,58,0.12); | |||
} | |||
.xn-search-input::placeholder { color: #B0A090; } | |||
/* 分组容器 */ | |||
.xn-section { margin-bottom: 2px; } | |||
/* 分组标题 */ | |||
.xn-header { | |||
padding: 8px 12px 6px; | |||
font-size: 0.82em; | |||
font-weight: bold; | |||
letter-spacing: .08em; | |||
color: #9B182D; | |||
border-bottom: 1px solid rgba(196,30,58,0.15); | |||
cursor: pointer; | |||
user-select: none; | |||
transition: background-color .2s ease; | |||
position: relative; | |||
} | |||
.xn-header:hover { background: rgba(196,30,58,0.05); } | |||
.xn-header::before { | |||
content: ''; | |||
display: inline-block; | |||
width: 3px; | |||
height: 0.9em; | |||
background: #C41E3A; | |||
margin-right: 7px; | |||
vertical-align: middle; | |||
border-radius: 2px; | |||
} | |||
.xn-header::after { | |||
content: '▾'; | |||
float: right; | |||
color: #B0A090; | |||
font-size: 0.9em; | |||
transition: transform .2s ease; | |||
} | |||
.xn-header.xn-collapsed::after { | |||
transform: rotate(-90deg); | |||
} | |||
/* 子分组标题 */ | |||
.xn-subheader, .xn-subsubheader { | |||
padding: 5px 12px 4px 22px; | |||
font-size: 0.8em; | |||
font-weight: bold; | |||
color: #7a2a3a; | |||
cursor: pointer; | |||
user-select: none; | |||
} | |||
.xn-subheader::after, .xn-subsubheader::after { | |||
content: '▾'; | |||
float: right; | |||
color: #C0B0A0; | |||
font-size: 0.85em; | |||
transition: transform .2s ease; | |||
} | |||
.xn-subheader.xn-collapsed::after, .xn-subsubheader.xn-collapsed::after { | |||
transform: rotate(-90deg); | |||
} | |||
/* 链接条目 */ | |||
.xn-body, .xn-subbody, .xn-subsubbody { overflow: hidden; } | |||
.xn-link { padding: 0; } | |||
.xn-link a { | |||
display: block; | |||
padding: 4px 12px 4px 22px; | |||
color: #4a3a2a; | |||
font-size: 0.82em; | |||
line-height: 1.5; | |||
transition: background-color .15s ease, color .15s ease, padding-left .15s ease; | |||
} | |||
.xn-link a:hover { | |||
color: #C41E3A; | |||
background: rgba(196,30,58,0.06); | |||
padding-left: 26px; | |||
} | |||
.xn-subbody .xn-link a { padding-left: 34px; } | |||
.xn-subbody .xn-link a:hover { padding-left: 38px; } | |||
.xn-subsubbody .xn-link a { padding-left: 46px; } | |||
.xn-subsubbody .xn-link a:hover { padding-left: 50px; } | |||
/* 缺失页面 */ | |||
.xn-missing a { color: #b07070; font-style: italic; } | |||
.xn-missing a:hover { color: #C41E3A; } | |||
/* ＋ 新增按钮 */ | |||
.xn-plus { | |||
display: inline-block; | |||
margin-left: 4px; | |||
color: #2E5A3B !important; | |||
font-weight: bold; | |||
font-size: 0.85em; | |||
opacity: 0.5; | |||
transition: opacity .2s ease; | |||
} | |||
.xn-plus:hover { opacity: 1; } | |||
/* 单独链接（共创入口）*/ | |||
.xn-single { | |||
margin: 6px 12px; | |||
padding: 8px 10px; | |||
text-align: center; | |||
background: rgba(196,30,58,0.06); | |||
border: 1px solid rgba(196,30,58,0.2); | |||
border-radius: 6px; | |||
transition: background-color .2s ease; | |||
} | |||
.xn-single a { | |||
color: #C41E3A; | |||
font-weight: bold; | |||
letter-spacing: .05em; | |||
} | |||
.xn-single:hover { background: rgba(196,30,58,0.12); } | |||
/* 当前页高亮 */ | |||
.xn-active { | |||
color: #C41E3A !important; | |||
font-weight: bold; | |||
background: rgba(196,30,58,0.1) !important; | |||
border-left: 3px solid #C41E3A; | |||
padding-left: 19px !important; | |||
} | |||
/* 加载状态 */ | |||
.xn-loading { | |||
padding: 8px 12px 8px 22px; | |||
color: #B0A090; | |||
font-size: 0.8em; | |||
font-style: italic; | |||
} | |||
/* 发现更多作品 */ | |||
.xn-add-work a { | |||
color: #2E5A3B; | |||
font-size: 0.8em; | |||
text-align: center; | |||
font-style: italic; | |||
padding: 6px 12px; | |||
} | |||
/* ===== 作品层级样式（xn-work-title，2026-07-30）===== */ | |||
/* 作品标题：缩进一级，字号略小，颜色稍淡 */ | |||
.xn-work-title { | |||
padding: 5px 12px 4px 22px; | |||
font-size: 0.8em; | |||
font-weight: bold; | |||
color: #7a2a3a; | |||
cursor: pointer; | |||
user-select: none; | |||
transition: background-color .2s ease; | |||
} | |||
.xn-work-title:hover { background: rgba(196,30,58,0.04); } | |||
.xn-work-title::after { | |||
content: '\25BE'; | |||
float: right; | |||
color: #C0B0A0; | |||
font-size: 0.85em; | |||
transition: transform .2s ease; | |||
} | |||
.xn-work-title.xn-collapsed::after { | |||
transform: rotate(-90deg); | |||
} | |||
/* 作品子项整体缩进：比作品标题再深一级 */ | |||
.xn-work .xn-body > .xn-link a { padding-left: 34px; } | |||
.xn-work .xn-body > .xn-link a:hover { padding-left: 38px; } | |||
/* 剧情层标题跟作品子项对齐 */ | |||
.xn-work .xn-body > .xn-subsection > .xn-subheader { padding-left: 34px; } | |||
/* 剧情层下段落标题再深一级 */ | |||
.xn-work .xn-body > .xn-subsection > .xn-subbody > .xn-subsubsection > .xn-subsubheader { padding-left: 46px; } | |||
/* 段落详情条目最深 */ | |||
.xn-work .xn-body > .xn-subsection > .xn-subbody > .xn-subsubsection > .xn-subsubbody .xn-link a { padding-left: 58px; } | |||
.xn-work .xn-body > .xn-subsection > .xn-subbody > .xn-subsubsection > .xn-subsubbody .xn-link a:hover { padding-left: 62px; } | |||
/* ===== 移动端（Minerva 皮肤）自定义导航适配（2026-07-30 v3）===== */ | |||
.xn-mobile { | |||
padding: 10px 0; | |||
border-bottom: 1px solid rgba(196,30,58,0.15); | |||
margin-bottom: 10px; | |||
font-family: "Noto Serif SC", "Source Han Serif SC", "Songti SC", "STSong", "SimSun", serif; | |||
} | |||
.xn-mobile .xn-search { padding: 4px 16px 12px; } | |||
.xn-mobile .xn-search-input { font-size: 16px; padding: 11px 12px; } | |||
.xn-mobile .xn-header { font-size: 1rem; padding: 14px 16px 12px; } | |||
.xn-mobile .xn-header::before { width: 4px; height: 1em; margin-right: 8px; } | |||
.xn-mobile .xn-link a { padding: 13px 16px 13px 28px; font-size: 1rem; line-height: 1.4; } | |||
.xn-mobile .xn-link a:hover { padding-left: 32px; } | |||
.xn-mobile .xn-subbody .xn-link a { padding-left: 40px; } | |||
.xn-mobile .xn-subbody .xn-link a:hover { padding-left: 44px; } | |||
.xn-mobile .xn-subsubbody .xn-link a { padding-left: 52px; } | |||
.xn-mobile .xn-subsubbody .xn-link a:hover { padding-left: 56px; } | |||
.xn-mobile .xn-work-title { font-size: 0.95rem; padding: 13px 16px 11px 28px; } | |||
.xn-mobile .xn-subheader, .xn-mobile .xn-subsubheader { padding: 12px 16px 10px 32px; font-size: 0.92rem; } | |||
.xn-mobile .xn-single { margin: 12px 16px; padding: 13px 10px; } | |||
.xn-mobile .xn-active { padding-left: 25px !important; } | |||
.xn-mobile .xn-loading { padding: 12px 16px 12px 28px; font-size: 0.9em; } | |||
.xn-mobile .xn-add-work a { padding: 10px 16px; } | |||
/* 抽屉滚动兜底：自定义导航插入后内容变长，保证抽屉可滚动、底部条目不被截断 */ | |||
#mw-mf-page-left.menu { overflow-y: auto; -webkit-overflow-scrolling: touch; } | |||
/* 展开/折叠动画走 GPU 合成层，保持 60fps */ | |||
.xn-mobile .xn-body, .xn-mobile .xn-subbody, .xn-mobile .xn-subsubbody { will-change: height; } | |||