MediaWiki:Citizen.css

/* Fonts */
 * 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, 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; --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); }

@media (prefers-color-scheme: dark) { :root.skin-citizen-auto { --color-base: #fff; --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); } }

/* 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); }

@media (prefers-color-scheme: dark) { .skin-citizen-auto #footer-sitetitle img.mw-logo-wordmark, .skin-citizen-auto .citizen-drawer__siteinfo .mw-logo-wordmark { filter: invert(1); } }

/* 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); }

/* 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; } }