|
|
| (52 intermediate revisions by the same user not shown) |
| Line 1: |
Line 1: |
|
| |
|
| | .mw-logo-wordmark { |
| | display: none !important; |
| | } |
| | |
| | .mw-anon-user #vector-page-tools-dropdown, |
| | .mw-anon-user #p-tb, |
| | .mw-anon-user .vector-column-end { |
| | display: none !important; |
| | } |
| | |
| | .mw-page-container, |
| | .mw-content-container, |
| | .vector-sticky-header { |
| | max-width: none !important; |
| | } |
|
| |
|
| :root {
| | .mw-logo-icon { |
| color-scheme: dark;
| | width: 160px !important; |
| /*------------------
| | height: 160px !important; |
| BASE COLORS
| | } |
| ----------------*/
| |
| --theme-sticky-nav-background-color: #666666;
| |
| --theme-success-color: #0c742f;
| |
| --theme-success-color--secondary: #0e8b38;
| |
| --theme-sticky-nav-text-color: #fff;
| |
| --theme-sticky-nav-text-color--hover: #cccccc;
| |
| --theme-page-background-color: #3D3D3D;
| |
| --theme-page-background-color--secondary: #352626;
| |
| --theme-page-text-color: #e6e6e6;
| |
| --theme-page-text-color--hover: #b3b3b3;
| |
| --theme-page-text-mix-color: #7c7373;
| |
| --theme-page-text-mix-color-95: #545454;
| |
| --theme-page-accent-mix-color: #424242;
| |
| --theme-page-headings-font: 'Inknut Antiqua';
| |
| --theme-link-label-color: #000;
| |
| --theme-accent-color: #a6a6a6;
| |
| --theme-accent-color--hover: #ec4448;
| |
| --theme-accent-label-color: #fff;
| |
| --theme-border-color: #463a3a;
| |
| --theme-alert-color: #bf0017;
| |
| --theme-alert-color--hover: #fe2540;
| |
| --theme-alert-color--secondary: #ec001c;
| |
| --theme-alert-label: #fff;
| |
| --theme-warning-color: #cf721c;
| |
| --theme-warning-color--secondary: #cf721c;
| |
| --theme-warning-label: #000;
| |
| --theme-success-label: #fff;
| |
| --theme-message-color: #913f82;
| |
| --theme-message-label: #fff;
| |
| --theme-community-header-color: #C8AA6E;
| |
| --theme-community-header-color--hover: #8a5407;
| |
|
| |
| /*------------------
| |
| THEME VARIABLES
| |
| ------------------*/
| |
| --body-main: #151414;
| |
| --body-light: #222121;
| |
| --body-mid: #171717;
| |
| --body-dark: var(--body-mid);
| |
| --body-border: #463a3a;
| |
| --body-background-color: #65090b; /* Background color outside the main content div */
| |
| --button-background: pink;
| |
| --button-color: #980000;
| |
| --button-border: #b00000;
| |
| --button-dark: #65090b;
| |
| --button-light: blue;
| |
| --sidebar: #565656;
| |
| --background-text-color: white;
| |
| --background-link-color: var(--link-color);
| |
| --heading-color: #E8E8EC;
| |
| --notification: var(--body-main);
| |
| --link-color: #adadad;
| |
| --link-color--hover:#f7bb66; /*TODO*/
| |
| --redlink-color: #e18284;
| |
| --text-color: #ccc;
| |
| --color-base: var(--text-color);
| |
| --byline-color: grey;
| |
| --subtle-color: grey;
| |
| --thumb-bg: #282828;
| |
| --thumb-caption-bg: var(--body-light);
| |
| --sourceeditor-input-background: var(--body-dark);
| |
| --sourceeditor-background: var(--body-light);
| |
| --sourceeditor-background-secondary: var(--body-mid);
| |
| --sourceeditor-border: var(--body-mid);
| |
| --codemirror-gutter-background: var(--body-mid);
| |
| --mw-code-background-color: var(--body-dark);
| |
| --background-color-neutral-subtle: var(--body-light);
| |
|
| |
| /* Wikitables */
| |
| --wikitable-header-bg: var(--body-light);
| |
| --wikitable-header-bg-border: var(--body-border);
| |
| --wikitable-bg: var(--body-main);
| |
| --wikitable-bg-lighter: var(--body-mid);
| |
| --wikitable-color: var(--text-color);
| |
| --wikitable-border: var(--body-border);
| |
|
| |
| /* msgbox */
| |
| --errorbox-bg: #9f261e;
| |
| --errorbox-border: #65090b;
| |
| --warningbox-bg: #342a14; | |
| --warningbox-border: #765816; | |
| --successbox-bg: #2e5e05;
| |
| --successbox-border: #3c780a;
| |
|
| |
|
| /* diff */
| | /* Full-width banner at the absolute top, behind everything */ |
| --diff-context-border-color: var(--body-mid);
| | body { |
| --diff-context-background: var(--body-mid); | | background-image: url('https://wiki.thehumanserver.org/images/9/9e/Wiki_background_top.png'); |
| --diff-addedline-background: var(--rc-positive-color);
| | background-repeat: no-repeat; |
| --diff-addedline-border-color: var(--rc-positive-color);
| | background-position: center top; |
| --diff-addedline-color: #fff;
| | background-size: 100% auto; /* Forces image to fit screen width */ |
| --diff-deletedline-background: var(--rc-negative-color);
| | background-attachment: scroll; /* Use 'fixed' if you want it to stay when scrolling */ |
| --diff-deletedline-border-color: var(--rc-negative-color);
| | } |
| --diff-deletedline-color: #fff;
| |
| --diff-inline-deletedline: #9f261e;
| |
|
| |
| /* Tabber */
| |
| --tabber-tab-bg: var(--body-main);
| |
| --tabber-tab-border-color: var(--link-color);
| |
| --tabber-active-tab-bg: var(--body-main);
| |
| --tabber-active-tab-color: var(--link-color);
| |
| --tabber-active-tab-hover-bg: var(--body-light);
| |
| --tabber-active-tab-hover-border-color: transparent;
| |
| --tabber-active-tab-hover-color: var(--text-color);
| |
| --tabber-active-tab-border-hider-color: var(--body-light);
| |
| --tabber-inactive-tab-bg: var(--body-main);
| |
| --tabber-inactive-tab-border-color: transparent;
| |
| --tabber-inactive-tab-color: #7c7373;
| |
| --tabber-inactive-tab-hover-bg: var(--body-light);
| |
| --tabber-inactive-tab-hover-border-color: transparent;
| |
|
| |
| /* OOUI */
| |
| --ooui-text: var(--text-color);
| |
| --ooui-interface: var(--body-light);
| |
| --ooui-interface-border: var(--body-border);
| |
| --ooui-window-background: rgba(0, 0, 0, 0.5); /* Overlay color when full screen popup occurs */
| |
| --ooui-normal: var(--body-mid); /* Match body light to reduce contrast, this is used for "show preview" */
| |
| --ooui-normal--hover: var(--body-light); /* Slightly lighter than above color */
| |
| --ooui-normal-border: var(--body-border); | |
| --ooui-progressive: var(--button-color); | |
| --ooui-progressive--hover: var(--button-border); /* Slightly lighter than above color */ | |
| --ooui-accent: var(--link-color);
| |
| --ooui-input: var(--body-light); /* Text boxes, unchecked boxes */
| |
| --ooui-input-border: var(--body-border);
| |
| --ooui-input-border--hover: var(--body-border); /* Slightly lighter than above color */
| |
| --ooui-disabled: #7c7373; | |
| --ooui-disabled-border: #c2b9ab;
| |
| --ooui-disabled-text: var(--subtle-color);
| |
| --ooui-destructive-text: white;
| |
| --ooui-pending-background-image: repeating-linear-gradient(-45deg, var(--notification), var(--notification) 20px, var(--body-main) 20px, var(--body-main) 30px);
| |
|
| |
| /* 1.43 */
| |
| --background-color-interactive-subtle: var(--ooui-interface);
| |
| --border-color-base: var(--ooui-interface-border);
| |
| --color-subtle: var(--subtle-color);
| |
| --background-color-disabled-subtle: var(--ooui-interface);
| |
| --background-color-base: var(--ooui-interface);
| |
| --background-color-notice-subtle: var(--ooui-normal);
| |
|
| |
|
| /* Messageboxes */
| | /* Vector-2022 Specific: Make the skin's main containers transparent to reveal the banner */ |
| --messagebox-notice-border: #eab759;
| | .mw-page-container, |
|
| | .mw-header, |
| /* Template:Quote */
| | .vector-sticky-header { |
| --pull-quote-max-width: 80%;
| | background-color: transparent !important; |
| --pull-quote-text-color: var(--text-color);
| |
| --pull-quote-mark-color: var(--messagebox-notice-border);
| |
| --pull-quote-mark-font: "Times New Roman", serif;
| |
| --pull-quote-hyphens: auto;
| |
| --pull-quote-frame-color: #bbb; | |
|
| |
| /* Recent changes */
| |
| --rc-positive-color: #407813;
| |
| --rc-negative-color: #b41e0f;
| |
| --rc-highlight-c1: #232746; /* blue */
| |
| --rc-highlight-c2: #143d31; /* green */
| |
| --rc-highlight-c3: #594a2b; /* yellow */
| |
| --rc-highlight-c4: #5c3a23; /* orange */
| |
| --rc-highlight-c5: #4a1313; /* red */
| |
| --rc-highlight-grey: #423636;
| |
|
| |
| /* Extra classes */
| |
| --text-color-red: #f8948a;
| |
| --text-color-orange: #f9b575;
| |
| --text-color-yellow: #fbe062;
| |
| --text-color-green: #a8de7a;
| |
| --text-color-blue: #7cc5f0;
| |
| --text-color-purple: #b097e6;
| |
| --text-color-pink: #ed9ddd;
| |
| --text-color-grey: #c5d2da;
| |
| --table-bg-blue: #0b5884;
| |
| --table-bg-green: #3c780a;
| |
| --table-bg-yellow: #a48900;
| |
| --table-bg-orange: #b55e0c;
| |
| --table-bg-red: #9f261e;
| |
| --table-bg-pink: #984c89;
| |
| --table-bg-grey: #5d6773;
| |
|
| |
| /* SVG */
| |
| --arrow-down: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M11.05 3.996l-.965-1.053-4.035 3.86-3.947-3.86L1.05 3.996l5 5 5-5' fill='%23cbd9f4'/%3E%3C/svg%3E");
| |
| } | | } |
|
| |
|
| /* --------------------
| |
| body
| |
| -------------------- */
| |
|
| |
|
| | .mw-header { |
| | margin-top: 10px; |
| | } |
| | #content { |
| | background-color: #2f2f2f; |
| | } |
| | .vector-user-links { |
| | position: fixed; |
| | top: 10px; |
| | right: 20px; |
| | z-index: 1000; |
| | transform: scale(1.2); |
| | transform-origin: top right; |
| | background: rgba(0, 0, 0, 0.5); |
| | padding: 5px 10px; |
| | border-radius: 8px; |
| | } |
|
| |
|
| .toc, #toc { | | .vector-user-links .vector-icon { |
| display: none !important; | | width: 24px; |
| | height: 24px; |
| | } |
| | |
| | a { |
| | color: #d1d1d1 !important; |
| | } |
| | |
| | |
| | a:visited { |
| | color: #A8A9AD !important; |
| | } |
| | |
| | a:hover { |
| | color: #e0e0e0 !important; |
| | text-decoration: underline; |
| | } |
| | |
| | |
| | @media screen and (max-width: 1919px) { |
| | |
| | .mobile-card-table, |
| | .mobile-card-table tbody, |
| | .mobile-card-table tr, |
| | .mobile-card-table td { |
| | display: block !important; |
| | width: 100% !important; |
| | box-sizing: border-box; |
| | border: none !important; |
| | } |
| | |
| | .mobile-card-table tr { |
| | |
| | padding: 10px; |
| | background: rgba(255, 255, 255, 0.05); |
| | border: none !important; |
| | } |
| | |
| | } |
| | |
| | .portable-infobox { |
| | float: right; |
| | clear: right; |
| | margin-top: 1% !important; |
| | margin-right: 2.5% !important; |
| | margin-left: 20px; |
| | margin-bottom: 10px; |
| | border-radius: 1.2%; |
| | border: 6px solid #aaa; |
| | overflow: hidden; |
| | width: 350px !important; |
| | box-shadow: 0 4px 10px rgba(0,0,0,0.15); |
| | background-color: 232323 !important; |
| | } |
| | |
| | .portable-infobox .pi-title { |
| | border-top-left-radius: 15px; |
| | border-top-right-radius: 15px; |
| | } |
| | @media screen and (max-width: 1219px) { |
| | .portable-infobox { |
| | float: none !important; |
| | width: 100% !important; |
| | max-width: 100% !important; |
| | margin: 1em 0 !important; |
| | box-sizing: border-box !important; |
| | display: block !important; |
| | } |
| | |
| | |
| | .portable-infobox .wds-tabs__wrapper { |
| | overflow-x: auto !important; |
| | white-space: nowrap !important; |
| | width: 100% !important; |
| | } |
| | |
| | .portable-infobox .pi-image img { |
| | max-width: 100% !important; |
| | height: auto !important; |
| | width: auto !important; |
| | } |
| | |
| | @media screen and (max-width: 450px) { |
| | .portable-infobox .pi-data { |
| | display: block !important; |
| | } |
| | .portable-infobox .pi-data-label { |
| | width: 100% !important; |
| | text-align: left !important; |
| | padding-bottom: 2px; |
| | } |
| | .portable-infobox .pi-data-value { |
| | width: 100% !important; |
| | text-align: left !important; |
| | padding-left: 10px; |
| | } |
| | } |
| } | | } |