MediaWiki:Citizen.css

/* Fonts */ @font-face { /* Inter: SIL Open Font License 1.1 * https://github.com/rsms/inter/blob/v3.19/LICENSE.txt */ font-family: "Inter"; font-weight: 100 900; font-display: swap; font-style: oblique 0deg 10deg; src: local("Inter"), url("/resources/applewiki/Inter.var.woff2") format("woff2"); }


 * root {

--font-family-base: -apple-system, BlinkMacSystemFont, "SF Pro", Inter, sans-serif; --font-family-serif: ui-serif, Georgia, serif; --font-family-monospace: "SF Mono", ui-monospace, "JetBrains Mono", Menlo, "Cascadia Mono", monospace; }

/* Colors */
 * root {

--color-base: #000; --border-color-base: rgba(0, 0, 0, .125); --border-color-base--lighter: rgba(0, 0, 0, .08); --border-color-base--darker: rgba(0, 0, 0, .125); }


 * root.skin-citizen-dark {

--color-base: #fff; --color-surface-0: hsl(var(--color-primary__h) 20% 7%); --background-color-overlay: hsla(var(--color-primary__h) 20% 7% / 95%); --border-color-base: rgba(255, 255, 255, .2); --border-color-base--lighter: rgba(255, 255, 255, .08); --border-color-base--darker: rgba(255, 255, 255, .2); }

/* Wider default layout width */
 * root {

--width-layout: 1800px; }

/* Logo */ .citizen-drawer__siteinfo .mw-logo-wordmark { background: url(/resources/applewiki/logo-wordmark.svg) 0 0/auto 100% no-repeat; color: transparent; }

width: 270px; height: 46px; }
 * 1) footer-sitetitle img.mw-logo-wordmark {

.skin-citizen-auto #footer-sitetitle img.mw-logo-wordmark, .skin-citizen-light #footer-sitetitle img.mw-logo-wordmark { filter: none; }

.skin-citizen-dark #footer-sitetitle img.mw-logo-wordmark, .skin-citizen-dark .citizen-drawer__siteinfo .mw-logo-wordmark { filter: invert(1); }

.skin-citizen-dark .mainpageimage { display: none; }

.skin-citizen-dark .mainpageimage.mainpageimage-dark { display: block !important; }

/* Tables */ .wikitable th { text-align: center; }

.wikitable th, .wikitable td { border: 1px solid var(--border-color-base); }

/* Template:Table cell templates */ .table-yes, .table-active, .table-siteactive, .table-release-candidate { background-color: var(--background-color-success) !important; }

.table-no, .table-siteinactive, .table-failure, .table-nightly { background-color: var(--background-color-destructive) !important; }

.table-maybe, .table-partial, .table-any, .table-planned, .table-experimental, .table-beta, .table-needs, .table-depends, .table-dropped { background-color: var(--background-color-warning) !important; }

.table-rh, .table-noAttempt, .table-na, .table-unknown { background-color: var(--color-surface-3) !important; }

.table-na { color: var(--color-base--subtle) !important; }

/* Forms */ .mw-ui-button, .oo-ui-buttonElement > .oo-ui-buttonElement-button, .oo-ui-buttonElement-framed > .oo-ui-buttonElement-button { border-radius: var(--border-radius--medium); }

.oo-ui-textInputWidget .oo-ui-inputWidget-input { border-radius: var(--border-radius--small); }

.oo-ui-checkboxInputWidget [type="checkbox"] + span { border-radius: var(--border-radius--small); }

/* MediaWiki UI colors */ div.mw-warning-with-logexcerpt, div.mw-lag-warn-high, div.mw-cascadeprotectedwarning, div#mw-protect-cascadeon, div.titleblacklist-warning { background-color: var(--background-color-destructive); border-color: var(--border-color-base); }

/* Progress bar gets stuck when you navigate and then go back, just disable it */ .citizen-loading:after { display: none; }

/* Disable thin scrollbar */ @media screen and (hover: hover) { * { 		scrollbar-width: initial; } }

/* Disable hover zoom effect */ .citizen-body a.image:hover:not(.lazy):not(.new) > img, .fullImageLink > a:hover > img { transform: initial; }

@media (max-width: 720px) { table.infobox { display: revert; } }

/* Bugfix for visited redlink category links showing as red */ .catlinks li > a.new:visited { color: var(--color-base--subtle); }

/* Sidebar icons */ .citizen-drawer__menu a:before { display: block; content: ""; width: var(--size-icon); height: var(--size-icon); background: transparent center/contain no-repeat; opacity: var(--opacity-icon-base); }

.skin-citizen-dark .citizen-drawer__menu a:before { filter: invert(1); }

.citizen-drawer__menu .citizen-ui-icon { display: none; }

.citizen-drawer__menu #n-mainpage-description a:before { background-image: url(/resources/applewiki/oojs/home.svg); } .citizen-drawer__menu #n-Ground-rules a:before        { background-image: url(/resources/applewiki/oojs/article-ltr.svg); } .citizen-drawer__menu #n-portal a:before              { background-image: url(/resources/applewiki/oojs/userGroup-ltr.svg); } .citizen-drawer__menu #n-recentchanges a:before       { background-image: url(/resources/applewiki/oojs/recentChanges-ltr.svg); } .citizen-drawer__menu #n-randompage a:before          { background-image: url(/resources/applewiki/oojs/die.svg); } .citizen-drawer__menu #n-help a:before                { background-image: url(/resources/applewiki/oojs/help-ltr.svg); } .citizen-drawer__menu #n-Discord a:before             { background-image: url(/resources/applewiki/discord.svg); } .citizen-drawer__menu #t-specialpages a:before        { background-image: url(/resources/applewiki/oojs/specialPages-ltr.svg); }

.citizen-drawer__menu #n-Devices a:before             { background-image: url(/resources/applewiki/iphone.svg); } .citizen-drawer__menu #n-Filesystem a:before          { background-image: url(/resources/applewiki/oojs/folderPlaceholder-ltr.svg); } .citizen-drawer__menu #n-Firmware a:before            { background-image: url(/resources/applewiki/oojs/download.svg); } .citizen-drawer__menu #n-Firmware-Keys a:before       { background-image: url(/resources/applewiki/oojs/key.svg); } .citizen-drawer__menu #n-Jailbreak a:before           { background-image: url(/resources/applewiki/oojs/unLock.svg); } .citizen-drawer__menu #n-Protocols a:before           { background-image: url(/resources/applewiki/oojs/pageSettings.svg); } .citizen-drawer__menu #n-Timeline a:before            { background-image: url(/resources/applewiki/oojs/history.svg); }

/* Icon invert helper class */ .skin-citizen-dark .dark-mode-invert { filter: invert(1); }

/* Dock the footer to bottom of a short page */ .citizen-page-container { display: flex; flex-direction: column; min-height: 100vh; min-height: stretch; /* For iOS, excludes safe areas */ }

.mw-body, .parsoid-body { flex-grow: 1; min-height: auto; }