|
|
(102 intermediate revisions by the same user not shown) |
Line 1: |
Line 1: |
| /* ================================ | | @import url('https://fonts.googleapis.com/css2?family=Bona+Nova:ital,wght@0,400;0,700;1,400&family=EB+Garamond:ital,wght@0,400..800;1,400..800&family=Goudy+Bookletter+1911&family=Metamorphous&family=Modern+Antiqua&family=Uncial+Antiqua&family=Almendra:ital,wght@0,400;0,700;1,400;1,700&display=swap'); |
| 🌟 BASE.CSS - Continuum Skin
| |
| Uses Variables from Mode-Specific CSS
| |
| ================================ */
| |
|
| |
|
| /* Import Google Fonts */
| | @font-face { |
| @import url('https://fonts.googleapis.com/css2?family=Bona+Nova:ital,wght@0,400;0,700;1,400&family=Metamorphous&display=swap'); | | font-family: 'Goudy Mediaeval Regular'; |
| | | src: url('https://continuum-universes.com/images/7/7f/GoudyMediaeval-Regular.woff2') format('woff2'); |
| /* === Typography === */
| | font-weight: normal; |
| .bona-nova-regular { font-family: "Bona Nova", serif; font-weight: 400; font-style: normal; }
| | font-style: normal; |
| .bona-nova-bold { font-family: "Bona Nova", serif; font-weight: 700; font-style: normal; }
| |
| .bona-nova-regular-italic { font-family: "Bona Nova", serif; font-weight: 400; font-style: italic; }
| |
| .metamorphous-regular { font-family: "Metamorphous", serif; font-style: normal; }
| |
| | |
| /* === Global Variables (Defined in -mode.css) === */ | |
| :root, .skin-continuum, .notheme {
| |
| /* Color Variables */
| |
| --color-text-primary: var(--color-base, #FFFFFF);
| |
| --color-text-secondary: var(--color-base--hover, #FFB84D);
| |
| --color-text-emphasized: var(--color-emphasized, #FFFFFF);
| |
| --color-text-muted: var(--color-subtle, #FF851B);
| |
| --color-placeholder: var(--color-placeholder, #FFB84D);
| |
| --color-link: var(--color-progressive, #FF851B);
| |
| --color-link-hover: var(--color-progressive--hover, #FFB84D);
| |
| --color-link-active: var(--color-progressive--active, #FF6300);
| |
| --color-link-focus: var(--color-progressive--focus, #FF851B);
| |
| --color-error: var(--color-error, #FF4500);
| |
| --color-success: var(--color-success, #177860);
| |
| --color-warning: var(--color-warning, #FFB84D);
| |
| | |
| /* Background Variables */
| |
| --background-primary: var(--background-color-base, #001F3F);
| |
| --background-secondary: var(--background-color-neutral, #002855);
| |
| --background-tertiary: var(--background-color-neutral-subtle, #001933);
| |
| --background-interactive: var(--background-color-interactive, #002B5C);
| |
| --background-inverted: var(--background-color-inverted, #101418);
| |
| | |
| /* Borders */
| |
| --border-primary: var(--border-color-base, #FF851B);
| |
| --border-hover: var(--border-color-progressive--hover, #FFB84D);
| |
| --border-active: var(--border-color-progressive--active, #FF6300);
| |
| --border-error: var(--border-color-error, #FF4500);
| |
| | |
| /* Shadows */
| |
| --box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
| |
| | |
| /* Opacity */
| |
| --opacity-disabled: 0.5;
| |
| } | | } |
| | | @font-face { |
| /* === General Body === */
| | font-family: 'Goudy Mediaeval Alternative'; |
| body {
| | src: url('https://continuum-universes.com/images/4/43/GoudyMedieval-Alternate.woff2') format('woff2'); |
| margin: 0;
| | font-weight: normal; |
| padding: 0;
| | font-style: normal; |
| background-color: var(--background-primary);
| |
| color: var(--color-text-primary);
| |
| font-family: 'Bona Nova', serif;
| |
| } | | } |
| | | .bona-nova-regular { |
| /* === Headers === */
| | font-family: "Bona Nova", serif; |
| h1, h2, h3, h4, h5, h6 {
| | font-weight: 400; |
| font-family: 'Metamorphous', cursive;
| | font-style: normal; |
| color: var(--color-link-active);
| |
| } | | } |
|
| |
|
| /* === Links === */
| | .bona-nova-bold { |
| a {
| | font-family: "Bona Nova", serif; |
| color: var(--color-link);
| | font-weight: 700; |
| text-decoration: none;
| | font-style: normal; |
| transition: color 0.3s ease;
| |
| } | | } |
|
| |
|
| a:hover {
| | .bona-nova-regular-italic { |
| color: var(--color-link-hover);
| | font-family: "Bona Nova", serif; |
| text-decoration: underline;
| | font-weight: 400; |
| | font-style: italic; |
| } | | } |
| | | .goudy-bookletter-1911-regular { |
| /* === Personal User Links === */
| | font-family: "Goudy Bookletter 1911", serif; |
| #p-personal {
| | font-weight: 400; |
| background-color: var(--background-tertiary);
| | font-style: normal; |
| border-radius: 4px;
| |
| padding: 4px 8px;
| |
| } | | } |
| | | .eb-garamond { |
| #p-personal li {
| | font-family: "EB Garamond", serif; |
| display: inline-block;
| | font-optical-sizing: auto; |
| margin-left: 8px;
| | font-weight: 400; |
| }
| | font-style: normal; |
| | |
| #p-personal a {
| |
| color: var(--color-link);
| |
| font-weight: bold;
| |
| }
| |
| | |
| #p-personal a:hover {
| |
| color: var(--color-link-hover);
| |
| }
| |
| | |
| /* === Main Structure === */
| |
| .mw-header {
| |
| background-color: var(--background-secondary);
| |
| border-bottom: 3px solid var(--border-primary);
| |
| }
| |
| | |
| #mw-panel {
| |
| background-color: var(--background-secondary);
| |
| }
| |
| | |
| #content {
| |
| background-color: var(--background-tertiary);
| |
| border: 1px solid var(--border-primary);
| |
| padding: 20px;
| |
| color: var(--color-text-primary);
| |
| }
| |
| | |
| .mw-body { | |
| background-color: var(--background-primary);
| |
| }
| |
| | |
| /* === Table of Contents (TOC) === */
| |
| #toc {
| |
| background-color: var(--background-interactive);
| |
| border: 2px solid var(--border-primary);
| |
| border-radius: 8px;
| |
| padding: 10px;
| |
| color: var(--color-text-primary);
| |
| }
| |
| | |
| #toc h2 {
| |
| font-family: 'Metamorphous', cursive;
| |
| color: var(--color-link-active);
| |
| }
| |
| | |
| #toc a {
| |
| color: var(--color-link);
| |
| }
| |
| | |
| #toc a:hover {
| |
| color: var(--color-link-hover);
| |
| }
| |
| | |
| /* === Buttons === */
| |
| .mw-ui-button {
| |
| background-color: var(--color-link);
| |
| color: var(--color-text-primary);
| |
| border: none;
| |
| padding: 8px 16px;
| |
| border-radius: 4px;
| |
| cursor: pointer;
| |
| transition: background-color 0.3s ease;
| |
| }
| |
| | |
| .mw-ui-button:hover {
| |
| background-color: var(--color-link-hover);
| |
| }
| |
| | |
| /* === Notifications & Alerts === */
| |
| .mw-notice {
| |
| background-color: var(--background-secondary);
| |
| color: var(--color-text-primary);
| |
| border-left: 4px solid var(--border-primary);
| |
| padding: 8px;
| |
| border-radius: 4px;
| |
| }
| |
| | |
| .mw-warning {
| |
| background-color: var(--color-warning);
| |
| color: var(--background-primary);
| |
| }
| |
| | |
| .mw-error {
| |
| background-color: var(--color-error);
| |
| color: var(--color-text-primary);
| |
| }
| |
| | |
| /* === Code Editors (Ace & CodeMirror) === */
| |
| .ace_editor, .CodeMirror {
| |
| background-color: var(--background-tertiary);
| |
| color: var(--color-text-primary);
| |
| border: 1px solid var(--border-primary);
| |
| border-radius: 4px;
| |
| }
| |
| | |
| /* Syntax Highlighting */
| |
| .ace_keyword, .cm-keyword { color: var(--color-link); font-weight: bold; }
| |
| .ace_string, .cm-string { color: #7FDBFF; }
| |
| .ace_comment, .cm-comment { color: #AAAAAA; font-style: italic; }
| |
| .ace_variable, .cm-variable { color: #FFD700; }
| |
| .ace_error, .cm-error { text-decoration: underline; text-decoration-color: var(--color-error); }
| |
| | |
| /* Cursor & Selection */
| |
| .CodeMirror-cursor { border-left: 1px solid var(--color-link); }
| |
| .CodeMirror-selected { background-color: rgba(255, 133, 27, 0.3); }
| |
| | |
| /* === Scrollbar === */
| |
| ::-webkit-scrollbar {
| |
| width: 12px;
| |
| }
| |
| | |
| ::-webkit-scrollbar-track {
| |
| background: var(--background-primary);
| |
| }
| |
| | |
| ::-webkit-scrollbar-thumb {
| |
| background-color: var(--color-link);
| |
| border-radius: 10px;
| |
| border: 3px solid var(--background-primary);
| |
| }
| |
| | |
| ::-webkit-scrollbar-thumb:hover {
| |
| background-color: var(--color-link-hover);
| |
| }
| |
| | |
| /* === Navbar === */
| |
| #top-navbar {
| |
| background-color: var(--background-interactive);
| |
| border-bottom: 3px solid var(--border-primary);
| |
| padding: 10px 20px;
| |
| display: flex;
| |
| align-items: center;
| |
| justify-content: space-between;
| |
| position: sticky;
| |
| top: 0;
| |
| z-index: 999;
| |
| box-shadow: var(--box-shadow);
| |
| }
| |
| | |
| .navbar-logo a {
| |
| font-family: 'Metamorphous', cursive;
| |
| color: var(--color-link);
| |
| font-size: 1.5em;
| |
| text-decoration: none;
| |
| }
| |
| | |
| .navbar-links a {
| |
| color: var(--color-text-primary);
| |
| text-decoration: none;
| |
| font-weight: bold;
| |
| }
| |
| | |
| .navbar-links a:hover {
| |
| color: var(--color-link-hover);
| |
| }
| |
| | |
| /* === Responsive Navbar === */
| |
| @media screen and (max-width: 768px) {
| |
| #top-navbar {
| |
| flex-direction: column;
| |
| align-items: flex-start;
| |
| }
| |
| | |
| .navbar-links {
| |
| flex-direction: column;
| |
| width: 100%;
| |
| }
| |
| | |
| .navbar-links li {
| |
| margin: 10px 0;
| |
| }
| |
| }
| |
| | |
| /* === Infobox === */
| |
| .infobox {
| |
| border: 2px solid var(--border-primary);
| |
| background-color: var(--background-interactive);
| |
| color: var(--color-text-primary);
| |
| width: 250px;
| |
| font-size: 90%;
| |
| float: right;
| |
| margin: 0 0 1em 1em;
| |
| padding: 10px;
| |
| border-radius: 8px;
| |
| }
| |
| | |
| .infobox th {
| |
| background-color: var(--background-secondary);
| |
| color: var(--color-text-secondary);
| |
| text-align: center;
| |
| border-bottom: 1px solid var(--border-primary);
| |
| }
| |
| | |
| .infobox td {
| |
| padding: 5px;
| |
| border-top: 1px solid var(--border-primary);
| |
| }
| |
| | |
| .infobox caption {
| |
| font-family: 'Metamorphous', cursive;
| |
| font-size: 1.2em;
| |
| color: var(--color-text-secondary);
| |
| text-align: center;
| |
| }
| |
| | |
| /* === Images === */
| |
| img {
| |
| display: block;
| |
| width: auto;
| |
| height: auto;
| |
| max-width: 100%;
| |
| max-height: 100%;
| |
| opacity: 1;
| |
| border: none;
| |
| transition: opacity 0.3s ease, filter 0.3s ease;
| |
| }
| |
| | |
| img:hover {
| |
| opacity: 0.9;
| |
| } | | } |
| | | .uncial-antiqua-regular { |
| /* SVG Glow */
| | font-family: "Uncial Antiqua", system-ui; |
| img[src$=".svg"] {
| | font-weight: 400; |
| filter: drop-shadow(0 0 5px rgba(255, 133, 27, 0.7));
| | font-style: normal; |
| } | | } |
| | | .modern-antiqua-regular { |
| /* === Icons === */
| | font-family: "Modern Antiqua", serif; |
| .continuum-icon {
| | font-weight: 400; |
| background-color: #FFB800;
| | font-style: normal; |
| } | | } |
| | | .metamorphous-regular { |
| /* === Editing Interface === */
| | font-family: "Metamorphous", serif; |
| .mw-editinginterface { | | font-weight: 400; |
| color: var(--color-text-primary);
| | font-style: normal; |
| } | | } |
| | | .almendra-regular { |
| .cdx-message--error { | | font-family: "Almendra", serif; |
| background-color: var(--background-primary);
| | font-weight: 400; |
| | font-style: normal; |
| } | | } |
|
| |
|
| .vehide { | | .almendra-bold { |
| display: none;
| | font-family: "Almendra", serif; |
| }
| | font-weight: 700; |
| #theme-switcher-container {
| | font-style: normal; |
| position: fixed;
| |
| top: 10px;
| |
| right: 20px;
| |
| z-index: 1000;
| |
| } | | } |
|
| |
|
| #theme-switcher {
| | .almendra-regular-italic { |
| padding: 5px;
| | font-family: "Almendra", serif; |
| border-radius: 4px;
| | font-weight: 400; |
| border: 1px solid var(--border-color-base);
| | font-style: italic; |
| background-color: var(--background-color-neutral);
| |
| color: var(--color-base);
| |
| } | | } |
| /* CSS placed here will be app/* ================================
| |
| 🌟 BASE.CSS - Continuum Skin
| |
| Uses Variables from Mode-Specific CSS
| |
| ================================ */
| |
|
| |
|
| /* Import Google Fonts */
| | .almendra-bold-italic { |
| @import url('https://fonts.googleapis.com/css2?family=Bona+Nova:ital,wght@0,400;0,700;1,400&family=Metamorphous&display=swap');
| | font-family: "Almendra", serif; |
| | | font-weight: 700; |
| /* === Typography === */
| | font-style: italic; |
| .bona-nova-regular { font-family: "Bona Nova", serif; font-weight: 400; font-style: normal; }
| |
| .bona-nova-bold { font-family: "Bona Nova", serif; font-weight: 700; font-style: normal; }
| |
| .bona-nova-regular-italic { font-family: "Bona Nova", serif; font-weight: 400; font-style: italic; }
| |
| .metamorphous-regular { font-family: "Metamorphous", serif; font-style: normal; }
| |
| | |
| /* === Global Variables (Defined in -mode.css) === */
| |
| :root, .skin-continuum, .notheme {
| |
| /* Color Variables */
| |
| --color-text-primary: var(--color-base, #FFFFFF);
| |
| --color-text-secondary: var(--color-base--hover, #FFB84D);
| |
| --color-text-emphasized: var(--color-emphasized, #FFFFFF);
| |
| --color-text-muted: var(--color-subtle, #FF851B);
| |
| --color-placeholder: var(--color-placeholder, #FFB84D);
| |
| --color-link: var(--color-progressive, #FF851B);
| |
| --color-link-hover: var(--color-progressive--hover, #FFB84D);
| |
| --color-link-active: var(--color-progressive--active, #FF6300);
| |
| --color-link-focus: var(--color-progressive--focus, #FF851B);
| |
| --color-error: var(--color-error, #FF4500);
| |
| --color-success: var(--color-success, #177860);
| |
| --color-warning: var(--color-warning, #FFB84D);
| |
| | |
| /* Background Variables */
| |
| --background-primary: var(--background-color-base, #001F3F);
| |
| --background-secondary: var(--background-color-neutral, #002855);
| |
| --background-tertiary: var(--background-color-neutral-subtle, #001933);
| |
| --background-interactive: var(--background-color-interactive, #002B5C);
| |
| --background-inverted: var(--background-color-inverted, #101418);
| |
| | |
| /* Borders */
| |
| --border-primary: var(--border-color-base, #FF851B);
| |
| --border-hover: var(--border-color-progressive--hover, #FFB84D);
| |
| --border-active: var(--border-color-progressive--active, #FF6300);
| |
| --border-error: var(--border-color-error, #FF4500);
| |
| | |
| /* Shadows */
| |
| --box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
| |
| | |
| /* Opacity */
| |
| --opacity-disabled: 0.5;
| |
| } | | } |
|
| |
|
| /* === General Body === */ | | /* ===== Global Styles ===== */ |
| body { | | body { |
| margin: 0;
| | font-family: 'Almendra', serif !important; |
| padding: 0;
| |
| background-color: var(--background-primary);
| |
| color: var(--color-text-primary);
| |
| font-family: 'Bona Nova', serif; | |
| }
| |
| | |
| /* === Headers === */
| |
| h1, h2, h3, h4, h5, h6 {
| |
| font-family: 'Metamorphous', cursive;
| |
| color: var(--color-link-active);
| |
| }
| |
| | |
| /* === Links === */
| |
| a {
| |
| color: var(--color-link);
| |
| text-decoration: none;
| |
| transition: color 0.3s ease;
| |
| } | | } |
| | | pre, code { /* Internal spacing */ |
| a:hover {
| | font-family: 'Courier New', 'Consolas', monospace !important; /* Monospace font */ /* Horizontal scroll if needed */ |
| color: var(--color-link-hover);
| |
| text-decoration: underline;
| |
| }
| |
| | |
| /* === Personal User Links === */ | |
| #p-personal {
| |
| background-color: var(--background-tertiary);
| |
| border-radius: 4px;
| |
| padding: 4px 8px;
| |
| }
| |
| | |
| #p-personal li {
| |
| display: inline-block;
| |
| margin-left: 8px;
| |
| }
| |
| | |
| #p-personal a {
| |
| color: var(--color-link);
| |
| font-weight: bold;
| |
| }
| |
| | |
| #p-personal a:hover {
| |
| color: var(--color-link-hover);
| |
| }
| |
| | |
| /* === Main Structure === */ | |
| .mw-header {
| |
| background-color: var(--background-secondary);
| |
| border-bottom: 3px solid var(--border-primary);
| |
| }
| |
| | |
| #mw-panel {
| |
| background-color: var(--background-secondary);
| |
| }
| |
| | |
| #content {
| |
| background-color: var(--background-tertiary);
| |
| border: 1px solid var(--border-primary);
| |
| padding: 20px;
| |
| color: var(--color-text-primary);
| |
| }
| |
| | |
| .mw-body {
| |
| background-color: var(--background-primary);
| |
| }
| |
| | |
| /* === Table of Contents (TOC) === */ | |
| #toc {
| |
| background-color: var(--background-interactive);
| |
| border: 2px solid var(--border-primary);
| |
| border-radius: 8px;
| |
| padding: 10px;
| |
| color: var(--color-text-primary);
| |
| } | | } |
|
| |
|
| #toc h2 { | | #toc h2 { |
| font-family: 'Metamorphous', cursive; | | font-family: 'Modern Antiqua', cursive !important; |
| color: var(--color-link-active);
| |
| } | | } |
| | | .mw-changeslist-legend h2 { |
| #toc a {
| | font-family: 'Modern Antiqua', cursive !important; |
| color: var(--color-link); | |
| } | | } |
| | | /* ===== UI Elements Still Use Custom Font ===== */ |
| #toc a:hover {
| | .wikiEditor-ui-toolbar, |
| color: var(--color-link-hover); | | .wikiEditor-ui-toolbar .group .tool a, |
| | .wikiEditor-ui-dialog { |
| | font-family: 'Bona Nova', serif !important; /* Keep custom font for UI */ |
| } | | } |
| | | /* ===== Ace Editor Base Styling ===== */ |
| /* === Buttons === */ | | .ace_editor { |
| .mw-ui-button { | | font-family: 'Courier New', 'Consolas', monospace !important; /* Monospace for cursor alignment */ |
| background-color: var(--color-link); | |
| color: var(--color-text-primary);
| |
| border: none;
| |
| padding: 8px 16px;
| |
| border-radius: 4px;
| |
| cursor: pointer;
| |
| transition: background-color 0.3s ease;
| |
| } | | } |
|
| |
|
| .mw-ui-button:hover {
| | /* ===== CodeEditor - General Editor Styling ===== */ |
| background-color: var(--color-link-hover);
| | .ace_editor { |
| }
| | font-family: 'Courier New', 'Consolas', monospace !important; |
| | |
| /* === Notifications & Alerts === */ | |
| .mw-notice {
| |
| background-color: var(--background-secondary);
| |
| color: var(--color-text-primary);
| |
| border-left: 4px solid var(--border-primary);
| |
| padding: 8px;
| |
| border-radius: 4px;
| |
| }
| |
| | |
| .mw-warning {
| |
| background-color: var(--color-warning);
| |
| color: var(--background-primary);
| |
| }
| |
| | |
| .mw-error {
| |
| background-color: var(--color-error);
| |
| color: var(--color-text-primary);
| |
| }
| |
| | |
| /* === Code Editors (Ace & CodeMirror) === */
| |
| .ace_editor, .CodeMirror { | |
| background-color: var(--background-tertiary); | |
| color: var(--color-text-primary);
| |
| border: 1px solid var(--border-primary);
| |
| border-radius: 4px;
| |
| }
| |
| | |
| /* Syntax Highlighting */
| |
| .ace_keyword, .cm-keyword { color: var(--color-link); font-weight: bold; }
| |
| .ace_string, .cm-string { color: #7FDBFF; }
| |
| .ace_comment, .cm-comment { color: #AAAAAA; font-style: italic; }
| |
| .ace_variable, .cm-variable { color: #FFD700; }
| |
| .ace_error, .cm-error { text-decoration: underline; text-decoration-color: var(--color-error); }
| |
| | |
| /* Cursor & Selection */
| |
| .CodeMirror-cursor { border-left: 1px solid var(--color-link); }
| |
| .CodeMirror-selected { background-color: rgba(255, 133, 27, 0.3); }
| |
| | |
| /* === Scrollbar === */
| |
| ::-webkit-scrollbar {
| |
| width: 12px;
| |
| }
| |
| | |
| ::-webkit-scrollbar-track {
| |
| background: var(--background-primary);
| |
| }
| |
| | |
| ::-webkit-scrollbar-thumb {
| |
| background-color: var(--color-link);
| |
| border-radius: 10px;
| |
| border: 3px solid var(--background-primary);
| |
| }
| |
| | |
| ::-webkit-scrollbar-thumb:hover {
| |
| background-color: var(--color-link-hover);
| |
| }
| |
| | |
| /* === Navbar === */
| |
| #top-navbar {
| |
| background-color: var(--background-interactive);
| |
| border-bottom: 3px solid var(--border-primary);
| |
| padding: 10px 20px;
| |
| display: flex;
| |
| align-items: center;
| |
| justify-content: space-between;
| |
| position: sticky;
| |
| top: 0;
| |
| z-index: 999;
| |
| box-shadow: var(--box-shadow);
| |
| } | | } |
|
| |
|
| | /* Navbar Logo */ |
| .navbar-logo a { | | .navbar-logo a { |
| font-family: 'Metamorphous', cursive; | | font-family: 'Modern Antiqua', cursive !important; |
| color: var(--color-link);
| |
| font-size: 1.5em;
| |
| text-decoration: none;
| |
| } | | } |
| | | /* Infobox Title */ |
| .navbar-links a { | | .portable-infobox .pi-title { |
| color: var(--color-text-primary);
| | font-family: 'Modern Antiqua' !important; |
| text-decoration: none;
| |
| font-weight: bold; | |
| } | | } |
|
| |
|
| .navbar-links a:hover { | | h3.pi-data-label { |
| color: var(--color-link-hover); | | font-family: 'Almendra' !important; |
| } | | } |
| | | .oo-ui-labelElement, input { |
| /* === Responsive Navbar === */
| | font-family: 'Almendra' !important; |
| @media screen and (max-width: 768px) {
| |
| #top-navbar {
| |
| flex-direction: column;
| |
| align-items: flex-start;
| |
| }
| |
| | |
| .navbar-links {
| |
| flex-direction: column;
| |
| width: 100%;
| |
| }
| |
| | |
| .navbar-links li {
| |
| margin: 10px 0;
| |
| }
| |
| } | | } |
| | | a { |
| /* === Infobox === */
| | font-family: 'Almendra'; |
| .infobox {
| |
| border: 2px solid var(--border-primary);
| |
| background-color: var(--background-interactive);
| |
| color: var(--color-text-primary);
| |
| width: 250px;
| |
| font-size: 90%;
| |
| float: right;
| |
| margin: 0 0 1em 1em;
| |
| padding: 10px;
| |
| border-radius: 8px;
| |
| } | | } |
| | | /* ===== Headers (Orange Variants) ===== */ |
| .infobox th { | | h1, h2, h3, h4, h5, h6, |
| background-color: var(--background-secondary);
| | h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, |
| color: var(--color-text-secondary);
| | .mw-body h1, |
| text-align: center;
| | .mw-body .mw-heading1, |
| border-bottom: 1px solid var(--border-primary); | | .mw-body-content h1, |
| | .mw-body-content .mw-heading1, |
| | .mw-body-content h2, .pi-title h2, |
| | .mw-body-content .mw-heading2, |
| | .mw-logo-wordmark, |
| | #firstHeadingTitle { |
| | font-family: 'Modern Antiqua', cursive !important; |
| } | | } |
|
| |
|
| .infobox td { | | .mwe-popups-extract p { |
| padding: 5px; | | display: block !important; |
| border-top: 1px solid var(--border-primary); | | visibility: visible !important; |
| } | | } |
|
| |
|
| .infobox caption { | | .mwe-popups-extract .portable-infobox { |
| font-family: 'Metamorphous', cursive;
| | display: none !important; /* Ensure infobox doesn't interfere */ |
| font-size: 1.2em;
| |
| color: var(--color-text-secondary);
| |
| text-align: center; | |
| } | | } |
| | | .copyright-warning { |
| /* === Images === */
| | color: var(--color-base); |
| img {
| | font-size: 11px; |
| display: block; | | margin: 0 0 10px; |
| width: auto; | | width: 700px; |
| height: auto; | |
| max-width: 100%; | | max-width: 100%; |
| max-height: 100%;
| |
| opacity: 1;
| |
| border: none;
| |
| transition: opacity 0.3s ease, filter 0.3s ease;
| |
| }
| |
|
| |
| img:hover {
| |
| opacity: 0.9;
| |
| }
| |
|
| |
| /* SVG Glow */
| |
| img[src$=".svg"] {
| |
| filter: drop-shadow(0 0 5px rgba(255, 133, 27, 0.7));
| |
| }
| |
|
| |
| /* === Icons === */
| |
| .continuum-icon {
| |
| background-color: #FFB800;
| |
| }
| |
|
| |
| /* === Editing Interface === */
| |
| .mw-editinginterface {
| |
| color: var(--color-text-primary);
| |
| } | | } |
| | | .create-title { |
| .cdx-message--error { | | color: var(--color-base); |
| background-color: var(--background-primary);
| | border: 1px solid var(--color-subtle); |
| } | | } |
| | | .filehistory { |
| .vehide { | | max-width: 100% !important; |
| display: none;
| |
| } | | } |
| #theme-switcher-container {
| | .welcome { |
| position: fixed;
| | text-align: center; |
| top: 10px;
| | font-size: 1.75em; |
| right: 20px;
| | padding-left: 1em; |
| z-index: 1000;
| | padding-right: 1em; |
| }
| | padding-bottom: 1em; |
| | |
| #theme-switcher {
| |
| padding: 5px;
| |
| border-radius: 4px;
| |
| border: 1px solid var(--border-color-base);
| |
| background-color: var(--background-color-neutral);
| |
| color: var(--color-base);
| |
| } | | } |