Jump to content

MediaWiki:Vector-2022.css: Difference between revisions

← Older editNewer edit →
Line 1: Line 1:
/* 🌌 Base Variables for Medium Theme */
/* 🌌 Base Variables for Medium Theme */
:root {
:root {
     --color-deep-slate: #2F4F4F; /* Deep Slate */
     --color-deep-slate: #2F4F4F;
     --color-slate: #708090;     /* Slate */
     --color-slate: #708090;
     --color-shale: #6B7C7C;     /* Shale */
    --color-medium-slate: #536872;
     --color-azure: #007FFF;     /* Azure */
     --color-shale: #6B7C7C;
     --color-cerulean: #007BA7;   /* Cerulean */
     --color-dark-teal: #006D77;
     --color-cerulean: #007BA7;
     --color-white: #FFFFFF;
     --color-white: #FFFFFF;
     --color-light-gray: #D3D3D3;
     --color-light-gray: #B0BFCB;
     --color-dark-gray: #1E1E1E;
     --color-dark-gray: #1E1E1E;
}
}
Line 22: Line 23:
.mw-body h1, .mw-body-content h1,
.mw-body h1, .mw-body-content h1,
.mw-logo-wordmark, #firstHeadingTitle {
.mw-logo-wordmark, #firstHeadingTitle {
     color: var(--color-azure);
     color: var(--color-dark-teal);
     font-family: 'Metamorphous', cursive;
     font-family: 'Metamorphous', cursive;
}
}
Line 28: Line 29:
/* 🔗 Links */
/* 🔗 Links */
a {
a {
     color: var(--color-azure);
     color: var(--color-dark-teal);
     text-decoration: none;
     text-decoration: none;
}
}
Line 39: Line 40:
/* 📊 Sidebar */
/* 📊 Sidebar */
#mw-panel {
#mw-panel {
     background-color: var(--color-slate);
     background-color: var(--color-medium-slate);
     color: var(--color-white);
     color: var(--color-white);
}
}


#mw-panel a {
#mw-panel a {
     color: var(--color-azure);
     color: var(--color-dark-teal);
}
}


Line 54: Line 55:
#content {
#content {
     background-color: var(--color-shale);
     background-color: var(--color-shale);
     border: 1px solid var(--color-cerulean);
     border: 1px solid var(--color-dark-teal);
     padding: 20px;
     padding: 20px;
     color: var(--color-white);
     color: var(--color-white);
Line 61: Line 62:
/* 📋 Table of Contents */
/* 📋 Table of Contents */
#toc {
#toc {
     background-color: var(--color-slate);
     background-color: var(--color-medium-slate);
     border: 2px solid var(--color-azure);
     border: 2px solid var(--color-dark-teal);
     border-radius: 8px;
     border-radius: 8px;
     padding: 10px;
     padding: 10px;
Line 69: Line 70:


#toc h2 {
#toc h2 {
     color: var(--color-azure);
     color: var(--color-dark-teal);
     text-align: center;
     text-align: center;
}
}
Line 75: Line 76:
/* 🟢 Buttons */
/* 🟢 Buttons */
.mw-ui-button {
.mw-ui-button {
     background-color: var(--color-azure);
     background-color: var(--color-dark-teal);
     color: var(--color-white);
     color: var(--color-white);
     border: none;
     border: none;
Line 89: Line 90:
/* 📋 Infobox */
/* 📋 Infobox */
.infobox {
.infobox {
     background-color: var(--color-slate);
     background-color: var(--color-medium-slate);
     border: 2px solid var(--color-cerulean);
     border: 2px solid var(--color-cerulean);
     color: var(--color-white);
     color: var(--color-white);
Line 100: Line 101:


.infobox th {
.infobox th {
     background-color: var(--color-azure);
     background-color: var(--color-dark-teal);
     color: var(--color-white);
     color: var(--color-white);
     text-align: center;
     text-align: center;
Line 111: Line 112:
/* 📬 Messages */
/* 📬 Messages */
.mw-message-box {
.mw-message-box {
     background-color: var(--color-slate);
     background-color: var(--color-medium-slate);
     border-left: 4px solid var(--color-azure);
     border-left: 4px solid var(--color-dark-teal);
     color: var(--color-white);
     color: var(--color-white);
}
}


.mw-message-box-warning {
.mw-message-box-warning {
     background-color: var(--color-azure);
     background-color: var(--color-dark-teal);
     color: var(--color-dark-gray);
     color: var(--color-dark-gray);
}
}
Line 136: Line 137:


::-webkit-scrollbar-thumb {
::-webkit-scrollbar-thumb {
     background-color: var(--color-azure);
     background-color: var(--color-dark-teal);
     border-radius: 10px;
     border-radius: 10px;
     border: 3px solid var(--color-deep-slate);
     border: 3px solid var(--color-deep-slate);
Line 147: Line 148:
/* 📋 VisualEditor Toolbar */
/* 📋 VisualEditor Toolbar */
body.ve-active .oo-ui-toolbar {
body.ve-active .oo-ui-toolbar {
     background-color: var(--color-slate);
     background-color: var(--color-medium-slate);
     border-bottom: 2px solid var(--color-azure);
     border-bottom: 2px solid var(--color-dark-teal);
}
}


body.ve-active .oo-ui-toolbar .oo-ui-buttonWidget {
body.ve-active .oo-ui-toolbar .oo-ui-buttonWidget {
     background-color: var(--color-azure);
     background-color: var(--color-dark-teal);
     color: var(--color-white);
     color: var(--color-white);
}
}
Line 163: Line 164:
/* 💡 Portable Infobox */
/* 💡 Portable Infobox */
.portable-infobox .pi-secondary-background {
.portable-infobox .pi-secondary-background {
     background-color: var(--color-slate);
     background-color: var(--color-medium-slate);
     border: 1px solid var(--color-azure);
     border: 1px solid var(--color-dark-teal);
}
}


Line 173: Line 174:


.portable-infobox .pi-data-label {
.portable-infobox .pi-data-label {
     color: var(--color-azure);
     color: var(--color-dark-teal);
}
}


Line 182: Line 183:
/* 📖 Code Blocks */
/* 📖 Code Blocks */
pre, code {
pre, code {
     background-color: #1E1E1E;
     background-color: var(--color-dark-gray);
     color: var(--color-light-gray);
     color: var(--color-light-gray);
     border: 1px solid var(--color-azure);
     border: 1px solid var(--color-dark-teal);
     border-radius: 4px;
     border-radius: 4px;
     padding: 6px;
     padding: 6px;
Line 190: Line 191:


/* 🖌️ Syntax Highlighting */
/* 🖌️ Syntax Highlighting */
.cm-keyword { color: var(--color-azure); font-weight: bold; }
.cm-keyword { color: var(--color-dark-teal); font-weight: bold; }
.cm-string { color: #7FDBFF; }
.cm-string { color: #7FDBFF; }
.cm-comment { color: #AAAAAA; font-style: italic; }
.cm-comment { color: #AAAAAA; font-style: italic; }
Line 201: Line 202:
     background-color: var(--color-shale);
     background-color: var(--color-shale);
     color: var(--color-white);
     color: var(--color-white);
     border: 1px solid var(--color-azure);
     border: 1px solid var(--color-dark-teal);
}
}


Line 211: Line 212:
/* 🌟 Sticky Header */
/* 🌟 Sticky Header */
.vector-sticky-header {
.vector-sticky-header {
     background-color: var(--color-slate);
     background-color: var(--color-medium-slate);
     border-bottom: 2px solid var(--color-azure);
     border-bottom: 2px solid var(--color-dark-teal);
     box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
     box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
}
}


.vector-sticky-header a {
.vector-sticky-header a {
     color: var(--color-azure);
     color: var(--color-dark-teal);
}
}


Retrieved from "https://continuum-universes.com/wiki/MediaWiki:Vector-2022.css"