注意:在发布之后,您可能需要清除浏览器缓存才能看到所作出的变更的影响。
- Firefox或Safari:按住Shift的同时单击刷新,或按Ctrl-F5或Ctrl-R(Mac为⌘-R)
- Google Chrome:按Ctrl-Shift-R(Mac为⌘-Shift-R)
- Internet Explorer或Edge:按住Ctrl的同时单击刷新,或按Ctrl-F5
- Opera:按 Ctrl-F5。
/* 这里所有CSS都会加载给Citizen皮肤的用户
* This stylesheet only contains site-wide styles.
* For template styles, check the specific template documentation.
*/
/* Adjust primary color */
:root {
--color-primary__h: 40;
}
/* Adjust contrast since we changed primary color */
:root {
--color-primary__l: 45%;
}
:root.skin-theme-clientpref-night {
--color-primary__l: 50%;
}
/*
* Menu
* Rich format menu to have more hierarchy
*/
/* Remove bottom spacing as it is handled in footer portlet */
.citizen-drawer__menu {
margin-bottom: 0;
padding-bottom: 0;
}
.mw-portlet-外部 {
position: sticky;
bottom: 0;
margin-top: var( --space-md );
padding: var( --space-xs ) 0;
border-top: 1px solid var( --border-color-base );
background: var( --color-surface-1 );
font-size: var( --font-size-x-small );
grid-column: 1 / -1;
white-space: nowrap;
}
.mw-portlet-外部 .citizen-menu__heading {
display: none;
}
.mw-portlet-外部 ul {
display: flex;
overflow: auto;
}
.mw-portlet-外部 .mw-list-item a {
gap: 0;
}
/* Label */
.citizen-drawer__menu [id^="n-sidebar-label-"] a {
pointer-events: none;
margin-left: var( --space-xs );
padding-left: var( --space-md );
padding-right: var( --space-xs );
border-left: 1px solid var( --border-color-base );
border-radius: 0;
letter-spacing: 0.05em;
font-weight: var( --font-weight-normal );
color: var( --color-base--subtle ) !important;
}
/* Icons */
.citizen-drawer__menu [id^="n-sidebar-icon-"] a {
font-size: 0;
}
.citizen-drawer__menu [id^="n-sidebar-icon-"] a:before {
display: block;
content: "";
width: var( --size-icon );
height: var( --size-icon );
background: transparent center/contain no-repeat;
opacity: var( --opacity-icon-base );
filter: var( --filter-invert );
}
#n-sidebar-icon-discord a:before {
background-image: url( https://static.miraheze.org/zhtardiswiki/7/77/Discord_-_Simple_Icons.svg )
}
/*
* Footer icons
* We use custom footer icons so we need to fine tune it
*/
#footer-icons a {
opacity: var( --opacity-icon-base );
transition: opacity 250ms ease;
}
#footer-icons a:hover {
opacity: var( --opacity-icon-base--hover );
}
#footer-icons a:active {
opacity: var( --opacity-icon-base--active );
}
/* More space between icons */
#footer-icons ul,
#footer-icons li {
gap: var( --space-md );
}
#footer-icons img {
width: auto;
height: 32px;
}
/* Divide footer links into two columns */
#footer-places {
column-count: 2;
align-content: end;
}
/* Fix misalignment in Safari and Firefox when using two columns */
#footer-places ul {
display: initial;
}
/* Moved to [[MediaWiki:Citizen-footer-tagline]] */
#footer-places-donate {
display: none;
}
/* Move main page page actions to the bottom of the page */
.page-首页 .citizen-body-container {
grid-template-areas:
'content'
'header'
'footer';
}
.page-首页 .page-actions .citizen-menu__card {
bottom: 100%;
}
.page-首页.citizen-page-header--sticky .citizen-page-header {
border-bottom-color: transparent;
}
.page-首页.citizen-page-header--sticky .citizen-page-header::before {
background-color: transparent;
backdrop-filter: unset;
}
@media screen and (max-width: 1119px) {
.page-首页 .citizen-page-header {
display: none;
}
}
/*
* Very important checkmark
* Blue checkmark near wordmark
*/
.mw-logo-wordmark {
display: flex;
align-items: center;
gap: var( --space-sm );
}
.mw-logo-wordmark:after {
content: "";
width: 1em;
height: 1em;
display: block;
background-image: url( https://static.miraheze.org/zhtardiswiki/1/19/TW-Verified.svg );
}
/* CookieWarning tweaks */
.mw-cookiewarning-container {
max-width: 480px;
}
.mw-cookiewarning-text {
gap: var(--space-xs);
}
.mw-cookiewarning-text::before {
content: '🍪';
font-size: 2rem;
}
/* hide on pageload to prevent FoUC */
.client-js .mw-cookiewarning-container {
opacity: 0;
visibility: hidden;
transition: opacity 250ms ease, visibility 250ms ease;
}
/* citizen-animations-ready is added when scripts are loaded */
.client-js.citizen-animations-ready .mw-cookiewarning-container {
opacity: 1;
visibility: visible;
}
/* Dark mode page backgroud */
.citizen-feature-pure-black-clientpref-0.skin-citizen-dark .citizen-sitenotice-container::before {
content: "";
position: absolute;
z-index: 0;
height: 220px;
background-image: linear-gradient(to top, var(--color-surface-0), transparent), var(--site-background);
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
width: fill-available;
width: -webkit-fill-available;
width: -moz-available;
}
.citizen-body, .citizen-page-sidebar, .citizen-page-footer {
position: relative;
}
/* Dark mode Main Page backgroud */
.citizen-feature-pure-black-clientpref-0.skin-citizen-dark .page-首页 .citizen-page-container {
background-image: linear-gradient(to bottom, var(--color-surface-0) 10%, transparent 15%), var(--main-background);
}
/* Change primary edit button on talk pages */
#ca-edit.istalk > a {
color: var(--color-base);
background-color: transparent;
}
#ca-edit.istalk > a .citizen-ui-icon::before {
opacity: var(--opacity-icon-base);
}
#ca-edit.istalk > a:hover {
color: var(--color-base--emphasized);
background-color: var(--background-color-quiet--hover);
}
#ca-edit.istalk > a:hover .citizen-ui-icon::before {
opacity: var(--opacity-icon-base--hover);
}
#ca-edit.istalk > a:active {
color: var(--color-base--subtle);
background-color: var(--background-color-quiet--active);
}
#ca-edit.istalk > a:active .citizen-ui-icon::before {
opacity: var(--opacity-icon-base--active);
}
#ca-addsection > a {
color: #fff;
background-color: var(--color-primary);
}
#ca-addsection > a:hover {
background-color: var(--color-primary--hover);
}
#ca-addsection > a:active {
background-color: var(--color-primary--active)
}
#ca-addsection .citizen-ui-icon::before {
filter: invert(1);
opacity: 1;
}
/* Revert em styles to avoid some strange issues */
:lang(zh) em {
font-style: revert;
text-emphasis: revert;
}
/* unset mw-indicator filter to adapt {{top icon}} styles */
.mw-indicator {
filter: unset;
}
/* Temp fix: Move the variants before the languages */
#p-variants {
order: -1;
}
/* Temp fix: Citizen's reading preferences panel */
.citizen-client-prefs-radio__label {
white-space: nowrap;
}
/* Temp fix: Image revert */
.skin-theme-clientpref-night .skin-invert {
filter: var(--filter-invert);
}
.skin-theme-clientpref-night .skin-invert-image img {
filter: var(--filter-invert);
}