MediaWiki:Vector.css

From Path of Exile 2 Wiki
Revision as of 02:52, 29 September 2024 by Vinifera7 (talk | contribs)
Jump to navigation Jump to search

Note: After saving, you have to bypass your browser's cache to see the changes. The simplest method that will work for most users is to hold down the ⇧ Shift key and click the Reload toolbar button. For details and other methods, see Help:Clear your browser cache.

/*
 * This stylesheet modifies the Vector theme.
 * 
 * Common styles should go in [[MediaWiki:Common.css]].
 */

/* ===== Fonts ===== */
@font-face {
    font-family: 'Fontin';
    src: local('Fontin Regular'), url(/w/media/Fontin-Regular.ttf) format('truetype');
}
@font-face {
    font-family: 'Fontin';
    src: local('Fontin Bold'), url(/w/media/Fontin-Bold.ttf) format('truetype');
    font-weight: bold;
}
@font-face {
    font-family: 'Fontin';
    src: local('Fontin Italic'), url(/w/media/Fontin-Italic.ttf) format('truetype');
    font-style: italic;
}
@font-face {
    font-family: 'FontinSmallCaps';
    src: local('Fontin SmallCaps'), url(/w/media/Fontin-SmallCaps.ttf) format('truetype');
}

/* ===== Variables ===== */
:root {
    --default-font-family: Verdana, sans-serif;

    --text-color: #a38d6d;

    --link-color: #f2c462;
    --link-active-color: #f2dcae;
    --red-link-color: #f25749;
    --red-link-active-color: #f2b4ae;

    --outer-text-color: rgb(198, 187, 179);
    --outer-link-color: rgb(232 230 227);
    --outer-link-text-shadow: 0 0 0.5rem rgba(0, 0, 0, 1), -1px -1px 0 rgba(0, 0, 0, 0.25), 1px -1px 0 rgba(0, 0, 0, 0.25), -1px 1px 0 rgba(0, 0, 0, 0.25), 1px 1px 0 rgba(0, 0, 0, 0.25);
}

/* ===== Body ===== */
body {
    font-family: var(--default-font-family);
    background: #000 url(https://pw-test2.grindinggear.com/images/9/98/Bg.jpg) no-repeat fixed left top;
    background-size: contain;
}

/* ===== Links ===== */
@media screen {
    a,
    a:visited,
    .mw-parser-output a.extiw,
    .mw-parser-output a.extiw:visited,
    .mw-parser-output a.external,
    .mw-parser-output a.external:visited {
        color: var(--link-color);
    }
    a:active,
    .mw-parser-output a.extiw:active,
    .mw-parser-output a.external:active {
        color: var(--link-active-color);
    }
    a.new,
    a.new:visited {
        color: var(--red-link-color);
    }
    a.new:active {
        color: var(--red-link-active-color);
    }
}

/* ===== Headings ===== */
.page-header__title,
.mw-body h1,
.mw-body h2,
.mw-body h3,
.mw-body h4,
.mw-body h5,
.mw-body h6 {
    color: #dfcf99;
    border-bottom-color: #5e4f45;
}

/* ===== Header ===== */
#mw-page-base {
    background: transparent;
}

/* ===== User menu ===== */
@media screen {
    .vector-user-menu-legacy a,
    .vector-user-menu-legacy a:visited{
        color: var(--outer-link-color);
        text-shadow: var(--outer-link-text-shadow);
    }
    .vector-user-menu-legacy #pt-anonuserpage,
    .vector-user-menu-legacy #pt-userpage a {
        background-position: left bottom;
    }
}

/* ===== Sidebar menu ===== */
@media screen {
    .vector-legacy-sidebar .vector-menu-portal {
        background-color: rgba(0,0,0,0.25);
    }
    .vector-legacy-sidebar .vector-menu-portal .vector-menu-heading {
        color: var(--outer-text-color);
    }
    .vector-legacy-sidebar .vector-menu-portal .vector-menu-content li a,
    .vector-legacy-sidebar .vector-menu-portal .vector-menu-content li a:visited {
        color: var(--outer-link-color);
        text-shadow: var(--outer-link-text-shadow);
    }
}

/* ===== Footer ===== */
@media screen {
    .mw-footer li {
        color: var(--outer-text-color);
    }
    .mw-footer a {
        color: var(--outer-link-color);
        text-shadow: var(--outer-link-text-shadow);
    }
}

/* ===== Page content ===== */
@media screen {
    .mw-body {
        border: 2px solid #4c3c2c;
        border-image-source: radial-gradient(at top center, #736445, #3d3326, #402f27, #3f372a, #0c0b09);
        border-image-slice: 1;
        color: var(--text-color);
        background-color: #0f0f0f;
        box-shadow: 0 1.5rem 3rem rgba(0,0,0,0.5);
    }
}

/* ===== Revision history ===== */
#pagehistory li {
    border: 1px solid transparent;
    padding: 0;
}
#pagehistory li.selected {
    outline: none;
    border: 1px dashed #16678a;
    color: inherit;
    background-color: #191b1c;
}