MediaWiki:Citizen.css
MediaWiki interface page
More actions
Note: After publishing, you may have to bypass your browser's cache to see the changes.
- Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
- Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
- Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.
/* All CSS here will be loaded for users of the Citizen skin */
:root {
--color-progressive-oklch__h: 220;
--font-family-citizen-base: sans-serif;
--space-unit: 1.2rem;
--transform-image-hover: unset;
--border-radius-base: 0;
--gold-1: oklch(0.8 0.15 85);
--gold-2: oklch(0.9 0.1 85);
--gold-3: oklch(0.95 0.05 85);
}
@font-face {
font-family: 'Libre Caslon';
src:
url('resources/assets/Libre_Caslon_Text/LibreCaslonText-Regular.ttf');
}
.citizen-menu__heading, .mw-list-item {
font-family: 'Libre Caslon';
}
.citizen-menu__heading {
margin-left: calc(var(--space-unit));
}
/* Page headings */
.citizen-page-header-inner {
/*border-bottom: 3px solid var(--color-base);*/
padding-bottom: 0;
}
#firstHeading {
padding-bottom: calc(var(--space-unit) / 8);
}
h1, h2, h3 {
font-family: 'Libre Caslon';
font-weight: 400;
}
.mw-heading2 {
border-bottom: 1px solid;
border-image: linear-gradient(90deg, transparent 1.8em, var(--color-emphasized) 3.6em, transparent 90%) 30;
}
.mw-heading2 h2 {
margin-left: calc(var(--space-unit) / 2);
margin-bottom: calc(var(--space-unit) / 8);
}
.mw-heading3 .mw-editsection,
.mw-heading4 .mw-editsection {
display: none;
}
/* Image customisations. */
.info-image.info-image figcaption,
.mw-default-size.mw-default-size figcaption {
text-align: center;
font-style: italic;
padding-bottom: var(--space);
font-family: 'Shippori Mincho';
}
.info-image,
.mw-default-size {
display: flex;
flex-direction: column;
align-items: center;
padding: calc(var(--space-unit) / 2);
margin-bottom: calc(var(--space-unit) / 2);
border: 2px solid;
border-image: linear-gradient(90deg, var(--color-emphasized), transparent 30%, transparent 70%, var(--color-emphasized)) 30;
background-image: repeating-conic-gradient(from 45deg at 50% 50%, transparent 25% 50%, var(--color-surface-3) 50% 75%);
background-clip: padding-box;
background-size: 18px 18px;
background-position: 50% 100%;
box-sizing: border-box;
}
/* Moves notification area down. */
.mw-notification-area {
margin-top: 6em;
}
/* Extension:Moderation adjustments. */
#mw-editing-your-version {
color: var(--color-surface-0);
}
/* Hides the UI icons from specific menus */
.citizen-menu__card-content .citizen-ui-icon {
display: none;
}
/* Hides the short description */
#siteSub {
display: none;
}
/* Adjusts the lower logo and wordmark */
#footer-sitetitle {
flex-direction: row;
align-items: center;
}
#footer-sitetitle .mw-logo-wordmark {
height: 2.4rem;
}