Jump to content
Toggle menu
Toggle preferences menu
Toggle personal menu
Not logged in
Your IP address will be publicly visible if you make any edits.

MediaWiki:Citizen.css: Difference between revisions

MediaWiki interface page
No edit summary
No edit summary
Line 118: Line 118:
}
}


/* Make collapsible section headings look clickable */
/* Collapsible section headings */
.mw-heading {
.mw-heading {
     background:
     position: relative;
        linear-gradient(
    margin-top: 1.25rem;
            90deg,
    padding: 0.45rem 0;
            rgba(255,109,178,0.10),
    z-index: 0;
            rgba(255,159,87,0.08),
}
            rgba(255,217,94,0.06),
 
            rgba(115,227,125,0.06),
/* Background without changing text alignment */
            rgba(102,217,255,0.08),
.mw-heading::before {
            rgba(185,140,255,0.10)
    content: "";
        ),
    position: absolute;
        var(--color-surface-3);
    z-index: -1;
 
    top: 0;
    bottom: 0;
    left: -0.85rem;
    right: -0.85rem;


    background: var(--color-surface-3);
     border-radius: 10px;
     border-radius: 10px;
     padding: 0.45rem 0.85rem;
 
     transition: background-color 0.15s ease;
}
}


/* Slightly brighter on hover */
.mw-heading:hover::before {
.mw-heading:hover {
     background: #273244;
     background: #273244;
}
}

Revision as of 00:02, 7 October 2026

/* All CSS here will be loaded for users of the Citizen skin */
/* Hide the Discussion button, including its sticky-header version */
#ca-talk,
#ca-talk-sticky-header {
    display: none !important;
}

/* Hide the entire site footer */
#footer,
.citizen-footer {
    display: none !important;
}

/* Hide page-management controls by default */
#ca-viewsource,
#ca-history,
#ca-talk,
#citizen-page-more-dropdown,
#citizen-sticky-header-more {
    display: none !important;
}

:root {
    /* Blimpuf rainbow palette */
    --blimpuf-pink: #ff6db2;
    --blimpuf-orange: #ff9f57;
    --blimpuf-yellow: #ffd95e;
    --blimpuf-green: #73e37d;
    --blimpuf-cyan: #66d9ff;
    --blimpuf-blue: #6ea8ff;
    --blimpuf-purple: #b98cff;
}

/* Citizen dark mode */
:root.skin-theme-clientpref-night {
    --color-surface-0: #0b0f16;
    --color-surface-1: #111827;
    --color-surface-2: #161d29;
    --color-surface-3: #1d2635;

    --color-base: #e8eefc;
    --color-emphasized: #ffffff;
    --color-subtle: #a9b7d1;

    /* Main Citizen accent */
    --color-progressive-oklch__h: 205;
}

/* Automatic theme when the OS is dark */
@media screen and (prefers-color-scheme: dark) {
    :root.skin-theme-clientpref-os {
        --color-surface-0: #0b0f16;
        --color-surface-1: #111827;
        --color-surface-2: #161d29;
        --color-surface-3: #1d2635;

        --color-base: #e8eefc;
        --color-emphasized: #ffffff;
        --color-subtle: #a9b7d1;

        --color-progressive-oklch__h: 205;
    }
}

.firstHeading {
    background: linear-gradient(
        90deg,
        var(--blimpuf-pink),
        var(--blimpuf-orange),
        var(--blimpuf-yellow),
        var(--blimpuf-green),
        var(--blimpuf-cyan),
        var(--blimpuf-blue),
        var(--blimpuf-purple)
    );

    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.mw-parser-output a {
    color: var(--blimpuf-cyan);
}

.mw-parser-output a:hover {
    color: var(--blimpuf-pink);
}

#ca-edit a {
    background: linear-gradient(
        90deg,
        var(--blimpuf-blue),
        var(--blimpuf-purple)
    ) !important;

    border: none !important;
}

#content::before {
    content: "";
    display: block;
    height: 3px;
    margin-bottom: 1.5rem;

    background: linear-gradient(
        90deg,
        var(--blimpuf-pink),
        var(--blimpuf-orange),
        var(--blimpuf-yellow),
        var(--blimpuf-green),
        var(--blimpuf-cyan),
        var(--blimpuf-blue),
        var(--blimpuf-purple)
    );

    border-radius: 999px;
}

/* Collapsible section headings */
.mw-heading {
    position: relative;
    margin-top: 1.25rem;
    padding: 0.45rem 0;
    z-index: 0;
}

/* Background without changing text alignment */
.mw-heading::before {
    content: "";
    position: absolute;
    z-index: -1;

    top: 0;
    bottom: 0;
    left: -0.85rem;
    right: -0.85rem;

    background: var(--color-surface-3);
    border-radius: 10px;

    transition: background-color 0.15s ease;
}

.mw-heading:hover::before {
    background: #273244;
}

/* Hide the "Last modified" information block */
#footer-info-lastmod,
.citizen-page-info {
    display: none !important;
}

/* Hide the top-right "Last modified" panel */
#citizen-page-aside-lastmod {
    display: none !important;
}