MediaWiki:Citizen.css
MediaWiki界面页面
更多操作
注意：在发布之后，您可能需要清除浏览器缓存才能看到所作出的更改的影响。
- Firefox或Safari：按住Shift的同时单击刷新，或按Ctrl-F5或Ctrl-R（Mac为⌘-R）
- Google Chrome：按Ctrl-Shift-R（Mac为⌘-Shift-R）
- Edge：按住Ctrl的同时单击刷新，或按Ctrl-F5。
:root, html, body {
/* Hex: #0095f0 */
--color-progressive-oklch__l: 62%;
--color-progressive-oklch__c: 0.16;
--color-progressive-oklch__h: 230;
--font-family-base: "HarmonyOS Sans SC", "MiSans", "Noto Sans SC", "Microsoft YaHei", Arial, sans-serif;
}
.citizen-section-heading :is(.mw-headline,h1,h2,h3,h4,h5,h6) {
font-family: "WenYuan Rounded SC M", "KTXP-GlowRound", var(--font-family-base);
}
/* 暗色模式背景 */
@media screen and (prefers-color-scheme: dark) {
:root.skin-theme-clientpref-os:not(.citizen-feature-pure-black-clientpref-1) {
--color-surface-0: #1a1a1f;
}
}
:root.skin-theme-clientpref-night:not(.citizen-feature-pure-black-clientpref-1) {
--color-surface-0: #1a1a1f;
}
/* 头像
.citizen-header__inner .citizen-ui-icon.mw-ui-icon-wikimedia-userAvatar[data-user]:before {
mask-size: unset;
background-image: var(--avatar-url) !important;
mask-image: unset;
background-size: contain;
border-radius: 12%;
}
*/
/* --- 信息框 --- */
.infoboxborder {
position: relative;
background-color: var(--background-color-base);
float: right;
border-radius: 0;
margin-left: 30px;
margin-top: 15px;
margin-bottom: 24px;
min-width: 300px;
z-index: 1;
border: 1.5px solid var(--color-progressive);
padding: 0 4px 4px 4px;
box-shadow: var(--box-shadow-medium);
}
.infoboxtable {
max-width: 350px;
width: 100%;
border-spacing: 2px;
}
.infoboxheader {
text-align: center;
font-size: 24px;
padding-top: 5px;
padding-bottom: 5px;
text-shadow: 0.75px 0.75px 0 rgb(0,0,0, 0.2);
}
@media screen and (prefers-color-scheme: dark) {
html.skin-theme-clientpref-os .infoboxheader {
text-shadow: 0.75px 0.75px 0 rgb(255,255,255, 0.2);
}
}
html.skin-theme-clientpref-night .infoboxheader {
text-shadow: 0.75px 0.75px 0 rgb(255,255,255, 0.2);
}
.infoboxsection {
background-color: var(--color-progressive);
vertical-align: top;
padding-left: 15px;
padding-right: 5px;
width: 105px;
border-color: var(--background-color-progressive--focus);
box-shadow: var(--box-shadow-small);
text-shadow: 1px 1px var(--background-color-progressive--hover);
color: white;
}
.infoboxsection a {
color: white;
}
.infoboxdetail {
vertical-align: top;
padding-left: 3px;
padding-right: 12px;
}
.infoboxdetail p {
margin: 0;
}
.infoboxdetail ul {
margin: 0 0 0 0.9em;
}
.infoboxborder th {
text-align: center;
}
/* 表格头部 */
.infoboxtable .infoboxtitle + .infoboxtitle td {
padding-top: 0;
font-size: 14px;
font-family: "Lato", sans-serif;
font-weight: 450;
font-style: italic;
}
.infoboxtable .infoboxtitle + .infoboxtitle td::before {
content: "";
display: none;
}
.infoboxtable .infoboxtitle:first-of-type td,
.infoboxtable .infoboxtitle:last-of-type td,
.infoboxtable .infoboxtitle:only-of-type td {
padding-bottom: 0;
}
.infoboxtitle + tr:not(.infoboxtitle) td {
padding-top: 8px;
padding-bottom: 5px;
text-align: center;
}
/* 自适应 */
@media (max-width: 650px) {
.infoboxtable tbody {
width: 100%;
}
.infoboxdetail table {
margin-top: 0;
margin-bottom: 0;
}
.infoboxborder {
width: fit-content;
width: max-content;
max-width: 100%;
float: unset;
margin: 12px auto 24px;
min-width: 100%;
overflow-x: auto;
}
.infoboxtable {
max-width: none;
}
}
/* 表格链接 */
.wikitable > * > tr > th a,
.infoboxsection a {
position: relative;
display: inline-block;
padding-right: 6px;
}
.wikitable > * > tr > th a::after,
.infoboxsection a::after {
content: "";
position: absolute;
bottom: -2px;
right: -2px;
width: 8px;
height: 8px;
background-image: url(filepath://Link to.svg);
background-size: contain;
background-repeat: no-repeat;
background-position: bottom right;
opacity: 0.95;
}
.wikitable > * > tr > th a,
.infoboxsection a {
margin-right: 0;
line-height: 1.2;
}
.infoboxsection[colspan="2"],
.infoboxsection[colspan="3"],
.infoboxsection[colspan="4"],
.infoboxsection[colspan="5"],
.infoboxsection[colspan="6"] {
padding-left: 0;
padding-right: 0;
text-align: center !important;
}
/* 物品描述 */
.infoboxdetail[colspan="2"] {
text-align: center !important;
padding-right: 3px;
padding-left: 3px;
}
/* 物品编号 */
.infoboxdetail.consolas {
overflow-wrap: anywhere;
}
/* 嵌套表格 */
.infoboxtable .subtable {
padding: 0;
border: 0;
}
.infoboxtable .subtable > table {
width: 101%;
margin: -2px;
}
/* 列表调整 */
.infoboxdetail ul {
list-style: none;
margin: 0 !important;
}
.infoboxdetail li {
padding-left: 1.65em;
text-indent: -1.65em;
}
/* 分类展示 */
.infoboxtable tr:first-child td:first-child {
position: relative;
}
/* 地图图片 */
.location {
max-width: 400px;
}
.locationimg img {
max-width: 90% !important;
height: auto;
}
/* --- 信息框 --- */
/* 收集品 */
@media (max-width: 2000px) {
.collectionlayout {
border-collapse: separate;
min-width: 100% !important;
display: block;
overflow-x: auto;
overflow-y: hidden;
height: auto;
table-layout: fixed;
}
}
/* 日历 */
@media (max-width: 768px) {
.calendarlayout {
border-collapse: separate;
min-width: 100% !important;
display: block;
overflow-x: auto;
overflow-y: hidden;
height: auto;
table-layout: fixed;
}
.calendar {
float: none;
}
}
/* Line */
.line {
width: 50%;
height: 1px;
margin: 6px auto;
background: linear-gradient(to right, transparent, var(--color-progressive) 50%, transparent);
border: none;
}
/* Navbox */
#navbox {
margin: auto;
padding: 5px;
border-radius: 11px;
clear: both;
}
@media (max-width: 650px) {
#navbox {
display: table;
}
}
@media (max-width: 650px) {
#navbox {
display: table;
}
}
/* Table */
.wikitable {
background-color: transparent;
border-collapse: separate;
border: none;
}
.wikitable>tr>th,
.wikitable>tr>td,
.wikitable>*>tr>th,
.wikitable>*>tr>td {
padding: 0.2em;
background-color: var(--background-color-base);
}
.wikitable>tr>th,
.wikitable>*>tr>th {
background-color: var(--color-progressive);
text-align: center;
border-color: var(--background-color-progressive--focus);
box-shadow: var(--box-shadow-small);
color: white;
text-shadow: 1px 1px var(--background-color-progressive--hover);
}
.wikitable>tr>th a,
.wikitable>*>tr>th a {
color: white;
}
@media (max-width: 650px) {
.wikitable>tr>th a,
.wikitable>*>tr>th a {
color: white;
}
.wikitable img {
max-width: none;
}
.wikitable {
min-width: 100% !important;
overflow-x: auto;
overflow-y: hidden;
height: auto;
table-layout: auto;
}
table {
border-collapse: separate;
min-width: 100% !important;
overflow-x: auto;
overflow-y: hidden;
height: auto;
table-layout: auto;
}
td>.no-wrap {
min-width: unset !important;
}
}
/* Thumb */
@media (max-width: 650px) {
.thumbimage {
max-width: 100% !important;
vertical-align: middle;
height: auto;
}
.thumb,
.mw-parser-output>div>a>img,
.mw-parser-output>div>div>a>img,
.mw-parser-output>p>a>img {
float: none !important;
max-width: 100%;
height: auto;
}
.thumbinner {
max-width: 100%;
height: auto;
}
}
/* 行程 */
.scheduleheader {
max-width: 100%;
width: 500px;
}
/* 页尾信息 */
.footer-beian {
font-size: 12px;
}
.footer-beian a,
.footer-beian a:visited,
.footer-beian a:hover {
text-decoration: none;
}
.footer-beian img {
vertical-align: middle;
margin-right: 5px;
margin-top: -2px;
}
.footer-beian .mw-file-element {
vertical-align: middle;
}
/* 展开 */
.wikitable th .mw-collapsible-toggle-default .mw-collapsible-text,
.infoboxsection .mw-collapsible-toggle-default .mw-collapsible-text {
color: white;
}
/* 底部 */
#footer-sitetitle .mw-logo-icon {
margin-bottom: 1em;
}
#footer-places-psbrecord {
grid-column: span 2;
}
.citizen-footer__content, .citizen-footer__bottom {
flex-wrap: wrap;
}
/* 表格链接 */
.wikitable > * > tr > th a.selflink::after, .infoboxsection a::after {
display: none;
}
/* 编辑器 */
.cm-panels.cm-panels-top {
top: 86px !important;
}
/* 链接下划线 */
#footer-places a, .search-types a {
text-decoration: none !important;
}
/* 声明页面 */
blockquote:lang(ja), blockquote:lang(ko), blockquote:lang(mn), blockquote:lang(zh) {
font-style: normal;
}
/* 注册和登录 */
label[for="mw-input-wpTerms"] {
display: inline-block;
}
.mw-userlogin-secure,
#wpSecureLogin,
.mw-htmlform .mw-secure {
display: none !important;
}
#mw-userlogin-help,
.mw-userlogin-help {
display: none !important;
}
/* 页尾细节 */
@media screen and (max-width: 550px) {
.citizen-footer li {
grid-column: span 2;
}
#footer-places ul {
display: flex;
flex-direction: column;
flex-wrap: nowrap;
}
}
@media screen and (max-width: 1119.98px) {
.citizen-footer__bottom {
padding-bottom: 7em;
}
}
/* wikitable 排序符号白色 */
@media screen {
html.client-js .sortable:not(.jquery-tablesorter) > * > tr:first-child > th.headerSort,html.client-js .jquery-tablesorter th.headerSort {
background-image: url(/resources/src/jquery.tablesorter.styles/images/sort_both_inverted.svg?d764d)
}
html.client-js .jquery-tablesorter th.headerSortUp {
background-image: url(/resources/src/jquery.tablesorter.styles/images/sort_up_inverted.svg?842ad)
}
html.client-js .jquery-tablesorter th.headerSortDown {
background-image: url(/resources/src/jquery.tablesorter.styles/images/sort_down_inverted.svg?7b5d0)
}
}
/* 设置 */
#skin-client-prefs-citizen-feature-custom-font-size {
--pref-columns: 4;
}
#skin-client-prefs-citizen-feature-pure-black .citizen-client-prefs-radio__label[for='skin-client-pref-citizen-feature-pure-black-value-1'] {
background-color: unset;
}
@media screen and (prefers-color-scheme: dark) {
html.skin-theme-clientpref-os #skin-client-prefs-citizen-feature-pure-black .citizen-client-prefs-radio__label[for='skin-client-pref-citizen-feature-pure-black-value-1'] {
background-color: #000;
}
}
html.skin-theme-clientpref-night #skin-client-prefs-citizen-feature-pure-black .citizen-client-prefs-radio__label[for='skin-client-pref-citizen-feature-pure-black-value-1'] {
background-color: #000;
}
/* 顶部装饰 */
.citizen-page-container:before {
background-image: url(filepath://NightMarket.png);
background-position: 70% center;
}
.citizen-header:before, .citizen-page-container::before, .mw-body::before, .citizen-body-container::after {
content: "";
position: absolute;
inset: 0;
pointer-events: none;
}
.citizen-header:before, .citizen-page-container::before {
background-repeat: no-repeat;
}
.citizen-page-container::before {
height: 200px;
background-size: cover;
-webkit-mask-image: linear-gradient(rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.2) 3rem, rgba(0, 0, 0, 0.05) 9rem, transparent 100%);
mask-image: linear-gradient(rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.2) 3rem, rgba(0, 0, 0, 0.05) 9rem, transparent 100%);
}
/* Collapse */
.mw-parser-output details:not(.cdx-accordion) {
border: 1px solid var(--border-color-subtle, #c8ccd1);
border-radius: 2px;
margin: 0.5em 0.0625rem;
padding: 0 12px;
}
.mw-parser-output details:not(.cdx-accordion) > summary:first-of-type {
padding: 6px 12px;
transition-property: background-color, color, border-color, box-shadow;
transition-duration: 0.25s;
transition-timing-function: ease;
list-style: none;
display: flex;
gap: 8px;
word-break: break-word;
white-space: normal;
font-weight: 700;
border-radius: 2px;
margin-inline: -12px;
}
.mw-parser-output details:not(.cdx-accordion) > summary:first-of-type::before {
content: '';
min-width: 0.75lh;
min-height: 0.75lh;
display: inline-block;
vertical-align: text-bottom;
width: 1.25em;
margin-top: calc(0.25lh / 5);
vertical-align: text-top;
transition-property: transform;
transition-duration: 0.25s;
transition-timing-function: ease;
}
@supports not ((-webkit-mask-image: none) or (mask-image: none)) {
.mw-parser-output details:not(.cdx-accordion) > summary:first-of-type::before {
background-position: center;
background-repeat: no-repeat;
background-size: calc(max(0.75lh, 0.75lh));
}
}
@supports (-webkit-mask-image: none) or (mask-image: none) {
.mw-parser-output details:not(.cdx-accordion) > summary:first-of-type::before {
-webkit-mask-position: center;
mask-position: center;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-size: calc(max(0.75lh, 0.75lh));
mask-size: calc(max(0.75lh, 0.75lh));
}
}
@supports not ((-webkit-mask-image: none) or (mask-image: none)) {
.mw-parser-output details:not(.cdx-accordion) > summary:first-of-type::before {
background-image: url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"%23000\"><path d=\"m17.5 4.75-7.5 7.5-7.5-7.5L1 6.25l9 9 9-9z\"/></svg>");
filter: invert(var(--filter-invert-icon, 0));
opacity: var(--opacity-icon-base, 0.87);
}
}
@supports (-webkit-mask-image: none) or (mask-image: none) {
.mw-parser-output details:not(.cdx-accordion) > summary:first-of-type::before {
-webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"%23000\"><path d=\"m17.5 4.75-7.5 7.5-7.5-7.5L1 6.25l9 9 9-9z\"/></svg>");
mask-image: url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"%23000\"><path d=\"m17.5 4.75-7.5 7.5-7.5-7.5L1 6.25l9 9 9-9z\"/></svg>");
background-color: var(--color-progressive, #36c);
}
}
.mw-parser-output details:not(.cdx-accordion) > summary:first-of-type:hover {
background: var(--background-color-interactive-subtle--hover, #eaecf0);
cursor: pointer;
}
.mw-parser-output details:not(.cdx-accordion)[open] {
padding-bottom: 8px;
}
.mw-parser-output details:not(.cdx-accordion)[open] > summary:first-of-type {
margin-bottom: 6px;
}
.mw-parser-output details:not(.cdx-accordion)[open] > summary:first-of-type::before {
transform: rotate(180deg);
}
.collapsed details summary::before,
.mw-parser-output .custom-tabs-panel details summary::before {
content: "";
display: none;
}
.collapsed details summary,
.mw-parser-output .custom-tabs-panel details summary {
list-style: none;
}
.collapsed details .fa-solid {
line-height: 1.6;
transition: transform 0.2s;
}
.collapsed details[open] .fa-solid {
transform: rotate(90deg);
}
.collapsed details summary {
cursor: pointer;
font-weight: bold;
color: var(--color-link, #0645ad);
}
h2 + .collapsed,
h3 + .collapsed {
margin-top: 0.5em;
}