MediaWiki:Common.css: Difference between revisions

Revision as of 22:37, 9 August 2026

:root {
    --background-opacity: 0.05;
    --background-color: rgb(47 47 47);

    --primary-color: rgb(31 31 31);
    --secondary-color: rgb(63 63 63);
    --tertiary-color: rgb(15 15 15);
    --accent-color: rgb(255 255 255);

    --border-radius: 8px;
    --border-radius-vh: 0.8vh;

    --paragraph-font: "Quicksand", sans-serif;
    --heading-font: "Puffet", sans-serif;

    --surface-opacity: 0.7;
}


/* =========================================================
   BACKGROUND
   ========================================================= */

html,
body {
    background-color: var(--tertiary-color);
}

body {
    background-image:
        linear-gradient(
            rgba(15, 15, 15, var(--background-opacity)),
            rgba(15, 15, 15, var(--background-opacity))
        ),
        url("https://blacket.wiki/images/2/26/Background.png");

    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed;

    color: var(--accent-color);
    font-family: var(--paragraph-font);
}


/* =========================================================
   VECTOR 2022 THEME
   ========================================================= */

.skin-vector-2022 {
    --background-color-base: rgb(
        31 31 31 / var(--surface-opacity)
    );

    --background-color-neutral: rgb(
        63 63 63 / var(--surface-opacity)
    );

    --background-color-neutral-subtle: rgb(
        15 15 15 / var(--surface-opacity)
    );

    --color-base: var(--accent-color);
    --color-emphasized: var(--accent-color);
    --color-subtle: var(--accent-color);

    --border-color-base: rgb(
        255 255 255 / 0.15
    );
}


/* =========================================================
   MAIN CONTENT
   ========================================================= */

#bodyContent {
    background: transparent;
    color: var(--accent-color);
}

.vector-body {
    color: var(--accent-color);
}

.mw-page-title-main {
    color: var(--accent-color);
    font-family: var(--heading-font);
}


/* =========================================================
   LINKS
   ========================================================= */

a {
    color: var(--accent-color);
}


/* =========================================================
   ROUNDED ELEMENTS
   ========================================================= */

#bodyContent,
.vector-body {
    border-radius: var(--border-radius);
}