Jump to content

MediaWiki:Common.css: Difference between revisions

No edit summary
Tag: Reverted
No edit summary
Tag: Reverted
Line 1: Line 1:
:root, .skin-continuum, .notheme {
:root, .skin-vector, .notheme {
     /* Base Colors */
     /* Base Colors */
     --color-base: #001F3F; /* Navy */
     --color-base: #FFFFFF; /* White for primary text */
     --color-base-fixed: #001F3F;
     --color-base-fixed: #FFFFFF;
     --color-base--hover: #002B5C; /* Slightly lighter navy */
     --color-base--hover: #FFB84D; /* Soft Peach for hover */
     --color-emphasized: #001933;
     --color-emphasized: #FFFFFF;
     --color-subtle: #54595d;
     --color-subtle: #FF851B; /* Bright Orange for subtle text */
     --color-placeholder: #72777d;
     --color-placeholder: #FFB84D;
     --color-disabled: #72777d;
     --color-disabled: #72777d;
     --color-inverted: #FFFFFF; /* White */
     --color-inverted: #FFFFFF;
     --color-inverted-fixed: #FFFFFF;
     --color-inverted-fixed: #FFFFFF;


     /* Progressive Colors */
     /* Progressive Colors (Links, Highlights) */
     --color-progressive: #FF851B; /* Bright Orange */
     --color-progressive: #FF851B; /* Bright Orange */
     --color-progressive--hover: #FFB84D; /* Soft Peach */
     --color-progressive--hover: #FFB84D; /* Soft Peach */
Line 25: Line 25:
     --color-destructive--visited: #FF6347;
     --color-destructive--visited: #FF6347;
     --color-error: #FF4500;
     --color-error: #FF4500;
     --color-warning: #FFB84D; /* Soft Peach */
     --color-warning: #FFB84D;
     --color-success: #177860;
     --color-success: #177860;
     --color-notice: #001933;
     --color-notice: #FFFFFF;


     /* Content Changes */
     /* Content Changes */
     --color-content-added: #006400; /* Dark Green */
     --color-content-added: #006400;
     --color-content-removed: #8B0000; /* Dark Red */
     --color-content-removed: #8B0000;


     /* Shadows & Filters */
     /* Shadows & Filters */
Line 142: Line 142:


     /* Subtle Text */
     /* Subtle Text */
     --color-base--subtle: #54595d;
     --color-base--subtle: #FF851B;
}
}
   @import url('https://fonts.googleapis.com/css2?family=Bona+Nova:ital,wght@0,400;0,700;1,400&family=Metamorphous&display=swap');
   @import url('https://fonts.googleapis.com/css2?family=Bona+Nova:ital,wght@0,400;0,700;1,400&family=Metamorphous&display=swap');
     .bona-nova-regular {
     .bona-nova-regular {
Line 438: Line 439:
     }
     }
      
      
     /* ===== Continuum 20 Specific Tweaks ===== */
     /* ===== vector 20 Specific Tweaks ===== */
     /* Sidebar collapsed state */
     /* Sidebar collapsed state */
     .continuum-menu-tabs li a {
     .vector-menu-tabs li a {
         color: #FF851B;
         color: #FF851B;
     }
     }
      
      
     .continuum-menu-tabs li a:hover {
     .vector-menu-tabs li a:hover {
         color: #FFB84D;
         color: #FFB84D;
     }
     }
      
      
     /* Sticky header in Continuum 20 */
     /* Sticky header in vector 20 */
     .continuum-sticky-header {
     .vector-sticky-header {
         background-color: #001A33;
         background-color: #001A33;
         border-bottom: 2px solid #FF851B;
         border-bottom: 2px solid #FF851B;
Line 455: Line 456:
     }
     }
      
      
     .continuum-sticky-header a {
     .vector-sticky-header a {
         color: #FF851B;
         color: #FF851B;
     }
     }
      
      
     .continuum-sticky-header a:hover {
     .vector-sticky-header a:hover {
         color: #FFB84D;
         color: #FFB84D;
     }
     }
     /* Default: No Gradient */
     /* Default: No Gradient */
     a, #mw-head .continuum-menu-dropdown .continuum-menu-heading {
     a, #mw-head .vector-menu-dropdown .vector-menu-heading {
         background-image: none;
         background-image: none;
         background-repeat: no-repeat;
         background-repeat: no-repeat;
Line 471: Line 472:
      
      
     /* Hover: Full Background Gradient */
     /* Hover: Full Background Gradient */
     a:hover, #mw-head .continuum-menu-dropdown .continuum-menu-heading:hover {
     a:hover, #mw-head .vector-menu-dropdown .vector-menu-heading:hover {
         background-image: linear-gradient(to bottom, rgba(255, 133, 27, 0) 0, #FF851B 100%);
         background-image: linear-gradient(to bottom, rgba(255, 133, 27, 0) 0, #FF851B 100%);
         background-repeat: no-repeat;
         background-repeat: no-repeat;
Line 479: Line 480:
      
      
     /* ===== Updated Legacy Tab Selection ===== */
     /* ===== Updated Legacy Tab Selection ===== */
     .continuum-menu-tabs-legacy .selected {
     .vector-menu-tabs-legacy .selected {
         background: #FFB84D; /* Soft Peach for selected tab */
         background: #FFB84D; /* Soft Peach for selected tab */
         color: #001F3F; /* Navy text for contrast */
         color: #001F3F; /* Navy text for contrast */
Line 487: Line 488:
      
      
     /* ===== Hover State for Non-Selected Tabs ===== */
     /* ===== Hover State for Non-Selected Tabs ===== */
     .continuum-menu-tabs-legacy li a:hover {
     .vector-menu-tabs-legacy li a:hover {
         background-color: #FF851B;
         background-color: #FF851B;
         color: #FFFFFF;
         color: #FFFFFF;
Line 493: Line 494:
      
      
     /* ===== Optional: Stronger Highlight for Current Page ===== */
     /* ===== Optional: Stronger Highlight for Current Page ===== */
     .continuum-menu-tabs-legacy .selected a {
     .vector-menu-tabs-legacy .selected a {
         font-weight: bold;
         font-weight: bold;
         color: #001F3F;
         color: #001F3F;
Line 576: Line 577:
     }
     }
      
      
     /* ===== Continuum 20 Header Image Fix ===== */
     /* ===== vector 20 Header Image Fix ===== */
     .continuum-header img {
     .vector-header img {
         width: auto;
         width: auto;
         height: auto;
         height: auto;
Line 850: Line 851:
         border-right: 1px solid #FF851B;
         border-right: 1px solid #FF851B;
     }
     }
     /* ===== Continuum Skin Override for Ace Editor ===== */
     /* ===== vector Skin Override for Ace Editor ===== */
     .continuum-body .ace_editor {
     .vector-body .ace_editor {
         background-color: #001933 !important; /* Dark Navy */
         background-color: #001933 !important; /* Dark Navy */
         color: #FFFFFF !important;
         color: #FFFFFF !important;
Line 858: Line 859:
     }
     }
      
      
     .continuum-body .ace_keyword { color: #FF851B !important; font-weight: bold; } /* Orange */
     .vector-body .ace_keyword { color: #FF851B !important; font-weight: bold; } /* Orange */
     .continuum-body .ace_string { color: #7FDBFF !important; }                    /* Azure */
     .vector-body .ace_string { color: #7FDBFF !important; }                    /* Azure */
     .continuum-body .ace_comment { color: #AAAAAA !important; font-style: italic; } /* Soft Gray */
     .vector-body .ace_comment { color: #AAAAAA !important; font-style: italic; } /* Soft Gray */
     .continuum-body .ace_constant { color: #FF4500 !important; }                  /* Burnt Orange */
     .vector-body .ace_constant { color: #FF4500 !important; }                  /* Burnt Orange */
     .continuum-body .ace_variable { color: #FFD700 !important; }                  /* Gold */
     .vector-body .ace_variable { color: #FFD700 !important; }                  /* Gold */
     .continuum-body .ace_cursor { color: #FF851B !important; }                    /* Bright Orange */
     .vector-body .ace_cursor { color: #FF851B !important; }                    /* Bright Orange */
     .continuum-body .ace_marker-layer .ace_active-line { background-color: rgba(255, 133, 27, 0.15) !important; }
     .vector-body .ace_marker-layer .ace_active-line { background-color: rgba(255, 133, 27, 0.15) !important; }
     .continuum-body .ace_marker-layer .ace_selection { background-color: rgba(255, 133, 27, 0.5) !important; }
     .vector-body .ace_marker-layer .ace_selection { background-color: rgba(255, 133, 27, 0.5) !important; }
      
      
     /* ===== Continuum Skin Override for CodeMirror ===== */
     /* ===== vector Skin Override for CodeMirror ===== */
     .continuum-body .CodeMirror {
     .vector-body .CodeMirror {
         background-color: #1e1e1e !important;
         background-color: #1e1e1e !important;
         color: #FFFFFF !important;
         color: #FFFFFF !important;
Line 875: Line 876:
     }
     }
      
      
     .continuum-body .cm-keyword { color: #FF851B !important; font-weight: bold; }
     .vector-body .cm-keyword { color: #FF851B !important; font-weight: bold; }
     .continuum-body .cm-string { color: #7FDBFF !important; }
     .vector-body .cm-string { color: #7FDBFF !important; }
     .continuum-body .cm-comment { color: #AAAAAA !important; font-style: italic; }
     .vector-body .cm-comment { color: #AAAAAA !important; font-style: italic; }
     .continuum-body .cm-number { color: #FFD700 !important; }
     .vector-body .cm-number { color: #FFD700 !important; }
     .continuum-body .cm-variable { color: #FFB84D !important; }
     .vector-body .cm-variable { color: #FFB84D !important; }
     .continuum-body .cm-def { color: #FF4500 !important; }
     .vector-body .cm-def { color: #FF4500 !important; }
     .continuum-body .CodeMirror-cursor { border-left: 1px solid #FF851B !important; }
     .vector-body .CodeMirror-cursor { border-left: 1px solid #FF851B !important; }
     .continuum-body .CodeMirror-selected { background-color: rgba(255, 133, 27, 0.3) !important; }
     .vector-body .CodeMirror-selected { background-color: rgba(255, 133, 27, 0.3) !important; }
     .continuum-body .CodeMirror-gutters {
     .vector-body .CodeMirror-gutters {
         background-color: #002B5C !important;
         background-color: #002B5C !important;
         color: #FFB84D !important;
         color: #FFB84D !important;