MediaWiki:Citizen.css

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)
• Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
• Opera: Press Ctrl-F5.

/* All CSS here will be loaded for users of the Citizen skin */

/* Primary colour override and new variable defines */
:root {
    --color-primary__h: 270;
    --color-primary__s: 50;
    --color-primary__l: 40;
    --color-dark-purple: hsl(var(--color-primary__h),40%,35%)
}

/* Colour overrides for all themes */
:root.skin-theme-clientpref-os,
:root.skin-theme-clientpref-light,
:root.skin-theme-clientpref-night {
    --color-link: #efbf04;
    --color-link--hover: #efbf04;
}

/* Overrides for specific classes */
.invert {
    filter: var( --filter-invert );
}

/* Main page box override */
.main-page-box .thumbinner > a:first-child:not(.image) {
    padding: 0;
}

/* Comments extension overrides */
.c-item, .c-avatar img {
    border-color: var(--border-color-base);
}

/* Pagination template overrides */
.pagination td:has(.mw-selflink) {
    background-color: var(--color-dark-purple) !important;
    border-bottom: 4px solid var(--color-dark-purple) !important;
}

/* Move edit button next to title names */
.mw-editsection {
    float: none;
    display: inline-block;
    text-indent: -9999px;
}

/* Dark theme */
@media screen and (prefers-color-scheme: dark) {
    :root.skin-theme-clientpref-os {
        --color-surface-0: #1a1a1f;
        --color-surface-1: #1f1f24;
        --color-surface-2: #23232e;
        --color-surface-3: #282833;
        --color-surface-4: #2c2c3c;
        --color-surface-5: #313142;
    }
}

:root.skin-theme-clientpref-night {
    --color-surface-0: #1a1a1f;
    --color-surface-1: #1f1f24;
    --color-surface-2: #23232e;
    --color-surface-3: #282833;
    --color-surface-4: #2c2c3c;
    --color-surface-5: #313142;
}

.skin-theme-clientpref-night {
    .citizen-typeahead-list-item-image {
        background-color: black;
    .citizen-footer {
        background-image: radial-gradient(rgba(0,0,0,0.75), var(--color-surface-2) 70%), url(https://medievil.wiki/images/5/59/MediEvilWikiBackground.jpg);
        background-size: cover;
    }
}

/***
 * HEADER IMAGE
 */
.citizen-page-container::before {
    background-image: url('https://medievil.wiki/images/7/7c/Mediawiki-header-bg-image.jpg');
    content: '';
    height: 200px;
    background-position: center 35%;
    background-repeat: no-repeat;
    -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%);
    position: absolute;
    inset: 0;
    pointer-events: none;
}

/***
 * NOTEBOX
 */
.notebox {
    margin: var(--space-md) 0;
    font-size: var(--font-size-small);
    border-radius: var(--border-radius-medium);
    border: 1px solid var(--border-color-base);
    padding: 10px;
}