|
|
| Line 1: |
Line 1: |
| :root:has(>.wgl-theme-light) {
| |
| color-scheme: light;
| |
|
| |
| /*------------------
| |
| BASE COLORS
| |
| ----------------*/
| |
| --lotus-blue: #1B4D6D;
| |
| --lotus-blue-slight-light: #246B8F;
| |
| --lotus-blue-light: #5BB7E5;
| |
| --lotus-blue-lighter: #89C6E5;
| |
| --lotus-blue-lightest: #B7D5E5;
| |
| --lotus-blue-dark: #153D57;
| |
| --lotus-blue-darker: #0d2534;
| |
| --lotus-blue-gray-dark: #19262f;
| |
|
| |
| --almost-black: #0f0f0f;
| |
| --darker-gray: #171717;
| |
| --light-darker-gray: #232323;
| |
| --dark-gray: #6a6a6a;
| |
| --gray: #c4c4c4;
| |
| --light-gray: #d5d5d5;
| |
| --bright-gray: #eeeeee;
| |
| --almost-white: #f9f9f9;
| |
|
| |
| --pale-blue: #deffff;
| |
| --dark-blue: #0148c2;
| |
| --dark-red: #861c10;
| |
| --red: #ee4231;
| |
| --light-red: #ea7f74;
| |
| --pink: #fbc0ba;
| |
| --dark-green: #205826;
| |
| --green: #379541;
| |
| --light-green: #c1edbf;
| |
| --lightest-green: #d8f0d3;
| |
| --transparent-black: rgba(0, 0, 0, 0.61);
| |
|
| |
| /*------------------
| |
| THEME VARIABLES
| |
| ------------------*/
| |
| --body-main: var(--bright-gray); /**/
| |
| --body-light: var(--almost-white); /**/
| |
| --body-mid: var(--light-gray); /**/
| |
| --body-dark: var(--gray); /**/
| |
| --body-border: var(--almost-black);
| |
| --body-background-image: url('filepath://Warframe_Wiki_background_light.png'); /**/
| |
| --body-background-color: var(--light-gray); /**/
| |
| --button-background: var(--lotus-blue);
| |
| --button-color: white;
| |
| --button-border: var(--lotus-blue-dark);
| |
| --button-dark: var(--lotus-blue-dark);
| |
| --button-light: var(--lotus-blue-slight-light);
| |
| --sidebar: var(--almost-white);
| |
| --background-text-color: var(--darker-gray); /**/
| |
| --background-link-color: var(--lotus-blue-dark); /**/
| |
| --search-box: var(--lotus-blue);
| |
| --link-color: var(--lotus-blue); /**/
| |
| --redlink-color: var(--dark-red); /**/
| |
| --text-color: var(--almost-black); /**/
| |
| --byline-color: var(--gray);
| |
| --subtle-color: var(--gray);
| |
| --thumb-bg: var(--lighter-gray); /**/
| |
| --thumb-caption-bg: var(--lighter-gray); /**/
| |
| --sourceeditor-input-background: black;
| |
| --sourceeditor-background: var(--body-light);
| |
| --sourceeditor-background-secondary: var(--body-light);
| |
| --sourceeditor-border: var(--dark-gray);
| |
| --codemirror-gutter-background: var(--body-mid);
| |
|
| |
|
| /* Templates */
| |
| --template-background-color-1: var(--light-gray); /**/
| |
| --template-background-color-2: var(--gray); /**/
| |
| --template-background-color-2-link: var(--lotus-blue-darkest); /**/
| |
| --template-text-color-1: var(--darker-gray); /**/
| |
| --template-text-color-2: var(--almost-black);
| |
|
| |
| /* Wikitables */
| |
| --wikitable-header-bg: var(--gray); /**/
| |
| --wikitable-border: var(--lotus-blue);
| |
| --wikitable-bg: var(--light-gray); /**/
| |
| --wikitable-bg-lighter: var(--almost-white); /**/
| |
| --wikitable-color: var(--text-color);
| |
|
| |
| /* Navbox colors */
| |
| --navbox-title-background: var(--wikitable-header-bg);
| |
| --navbox-group-title-background: var(--wikitable-header-bg);
| |
| --navbox-background: var(--wikitable-bg);
| |
| --navbox-border: var(--wikitable-border);
| |
| --navbox-footer-background: var(--wikitable-header-bg);
| |
|
| |
| /* msgbox */
| |
| --errorbox-bg: #FFBBBB;
| |
| --errorbox-border: #FF7777;
| |
| --warningbox-bg: #FFFFDD;
| |
| --warningbox-border: #FFDD00;
| |
| --successbox-bg: #86CC9D;
| |
| --successbox-border: #45AD66;
| |
|
| |
| /* diff */
| |
| --diff-addedline-border-color: var(--lotus-blue-slight-light);
| |
| --diff-addedline-background: var(--lotus-blue-lightest);
| |
| --diff-addedline-color: #000;
| |
| --diff-deletedline-border-color: var(--green);
| |
| --diff-deletedline-background: var(--light-green);
| |
| --diff-deletedline-color: #000;
| |
| --diff-context-border-color: var(--body-mid);
| |
| --diff-context-background: var(--body-dark);
| |
| --diff-inline-deletedline: var(--pink);
| |
|
| |
| /* Tabber */
| |
| --tabber-tab-bg: var(--template-background-color-1);
| |
| --tabber-tab-border-color: var(--body-border);
| |
| --tabber-active-tab-bg: var(--body-light);
| |
| --tabber-active-tab-color: var(--text-color);
| |
| --tabber-active-tab-hover-bg: var(--body-light);
| |
| --tabber-active-tab-hover-border-color: var(--body-border);
| |
| --tabber-active-tab-hover-color: var(--text-color);
| |
| --tabber-active-tab-border-hider-color: var(--body-light);
| |
| --tabber-inactive-tab-bg: var(--body-background-color);
| |
| --tabber-inactive-tab-border-color: var(--body-border);
| |
| --tabber-inactive-tab-color: var(--text-color);
| |
| --tabber-inactive-tab-hover-bg: var(--body-light);
| |
| --tabber-inactive-tab-hover-border-color: var(--body-border);
| |
|
| |
| /* OOUI */
| |
| --ooui-text: var(--text-color);
| |
| --ooui-interface: var(--body-light);
| |
| --ooui-interface-border: var(--body-border);
| |
| --ooui-window-background: rgba(255, 255, 255, 0.5);
| |
| --ooui-normal: var(--lotus-blue-light);
| |
| --ooui-normal--hover: var(--lotus-blue);
| |
| --ooui-normal-border: var(--dark-gray);
| |
| --ooui-progressive: var(--lotus-blue-dark);
| |
| --ooui-progressive--hover: var(--lotus-blue);
| |
| --ooui-accent: var(--link-color);
| |
| --ooui-input: white; /**/
| |
| --ooui-input-border: var(--lotus-blue);
| |
| --ooui-input-border--hover: var(--lotus-blue-dark);
| |
| --ooui-disabled:var(--light-gray);
| |
| --ooui-disabled-border: var(--gray);
| |
| --ooui-disabled-text: var(--subtle-color);
| |
| --ooui-pending-background-image: repeating-linear-gradient(-45deg, var(--search-box), var(--search-box) 20px, var(--body-main) 20px, var(--body-main) 30px);
| |
|
| |
| /* Some additional below editor functionality */
| |
| --background-color-interactive-subtle: var(--ooui-progressive);
| |
| --color-progressive: var(--link-color);
| |
| --border-color-interactive: var(--ooui-normal-border);
| |
|
| |
| /* Messageboxes */
| |
| --messagebox-obsolete-background: var(--gray);
| |
| --messagebox-obsolete-border: var(--dark-gray);
| |
| --messagebox-obsolete-color: var(--text-color);
| |
| --messagebox-obsolete-link-color: var(--dark-gray);
| |
| --messagebox-info-background: var(--almost-white);
| |
| --messagebox-info-border: var(--dark-gray);
| |
| --messagebox-info-color: var(--text-color);
| |
| --messagebox-info-link-color: var(--dark-gray);
| |
| --messagebox-action-background: var(--lotus-blue-lightest);
| |
| --messagebox-action-border: var(--lotus-blue-slight-light);
| |
| --messagebox-action-color: var(--text-color);
| |
| --messagebox-action-link-color: var(--lotus-blue);
| |
| --messagebox-warn-background: var(--pink);
| |
| --messagebox-warn-border: var(--dark-red);
| |
| --messagebox-warn-color: var(--text-color);
| |
| --messagebox-warn-link-color: var(--dark-red);
| |
| --messagebox-safe-background: var(--lightest-green);
| |
| --messagebox-safe-border: var(--green);
| |
| --messagebox-safe-color: var(--text-color);
| |
| --messagebox-safe-link-color: var(--green);
| |
| --messagebox-disambig-background: var(--almost-white);
| |
| --messagebox-disambig-border: var(--dark-gray);
| |
| --messagebox-disambig-color: var(--text-color);
| |
| --messagebox-disambig-link-color: var(--dark-gray);
| |
|
| |
| --messagebox-discord-background: #5865f2;
| |
| --messagebox-discord-border: #4c57d0;
| |
| --messagebox-discord-link-color: #d2e5fc;
| |
|
| |
| /* Recent changes */
| |
| --rc-positive-color: var(--dark-green);
| |
| --rc-negative-color: var(--dark-red);
| |
|
| |
| /* Module Editor */
| |
| --sourceeditor-input-background: var(--body);
| |
| --sourceeditor-background: var(--body-light);
| |
| --sourceeditor-background-secondary: var(--body-light);
| |
| --sourceeditor-border: var(--body-border);
| |
| --codemirror-gutter-background: var(--body-light);
| |
|
| |
| /* Editor arrows */
| |
| --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='%23444'/%3E%3C/svg%3E");
| |
|
| |
| /* Left side bar (e.g. .p-navigation) */
| |
| --sidebar-heading-background: var(--lotus-blue-light);
| |
| --sidebar-heading-text-color: var(--bright-gray);
| |
| --sidebar-content-background: var(--pale-blue);
| |
| --sidebar-content-link-color: var(--background-link-color);
| |
| }
| |