Madness Descent (Roblox) Wiki

MediaWiki:Common.css: Difference between revisions

← Older edit
Editingthingsforlife (talk | contribs)
Bureaucrats, Interface administrators, Administrators
27 edits
No edit summary
Editingthingsforlife (talk | contribs)
Bureaucrats, Interface administrators, Administrators
27 edits
No edit summary
 
Line 1: Line 1:
/* ==== DARK BROWN THEME FOR WIKIOASIS ==== */
/* ==========================================================================
  Fandom-Inspired Dark Theme for MediaWiki (.madness-theme)
  ========================================================================== */


/* --- General Page Styles --- */
/* Apply if 'madness-theme' class is on the body */
body {
.madness-theme,
     background-color: #3D2B1F !important; /* Deep Dark Brown - Page Background */
.madness-theme body {
     color: #F5F5DC !important; /* Beige - Default Text */
     background-color: #202225 !important; /* Overall very dark grey (Fandom-like) */
     color: #e0e1e2 !important;           /* Light grey/off-white text */
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important; /* Common Fandom font stack */
}
}


/* --- Links --- */
/* --- Global Links --- */
a {
.madness-theme a {
     color: #D2B48C !important; /* Tan */
     color: #61dafb !important; /* Bright, techy blue for links (Fandom-like accent) */
    text-decoration: none !important;
}
}
a:hover {
.madness-theme a:hover {
     color: #FFD700 !important; /* Gold - or a lighter tan like #E0C9A6 */
     color: #82e4ff !important;
     text-decoration: underline !important;
     text-decoration: underline !important;
}
}
a:visited {
.madness-theme a:visited {
     color: #B8860B !important; /* DarkGoldenrod - for visited, adjust if too similar to normal links */
     /* color: #ad9bf3 !important; /* Optional: Fandom-like purple for visited */
}
}
/* Ensure new page links (red links) are still distinguishable */
.madness-theme a.new { /* Red links for non-existent pages */
a.new {
     color: #ff7675 !important;
     color: #FFA07A !important; /* Light Salmon - or another distinct color */
}
}
a.new:hover {
.madness-theme a.new:hover {
     color: #FF7F50 !important; /* Coral */
     color: #ff9493 !important;
}
}




/* --- Header Area --- */
/* --- Page Header (Top Bar area) --- */
#mw-page-base { /* The very top bar, often a different color */
.madness-theme #mw-head-base, /* Wraps logo, search, personal tools */
     background-color: #2A1B13 !important; /* Even darker brown */
.madness-theme #mw-head {
     border-bottom: 1px solid #5C4033 !important;
     background-color: #282b30 !important; /* Slightly lighter than body, for definition */
     border-bottom: 1px solid #40444b !important;
}
}


#mw-head { /* Contains logo, search, personal tools */
/* Logo */
    background-color: #3D2B1F !important; /* Match body or slightly different */
.madness-theme #p-logo,
.madness-theme #p-logo a {
    /* Adjust if your logo needs specific styling to look good on dark */
}
}


#p-logo a {
/* Personal Tools (Username, Talk, Preferences, Logout) */
     /* If your logo is text and needs recoloring.
.madness-theme #p-personal ul {
      If it's an image, you might need a new dark-theme-friendly logo. */
    background-color: transparent !important;
     color: #F5F5DC !important; /* Or your accent color */
}
.madness-theme #p-personal ul li a {
     color: #c8c9ca !important;
    text-shadow: none !important;
}
.madness-theme #p-personal ul li a:hover {
     background-color: #3a3d42 !important;
    color: #ffffff !important;
}
}


/* Search Box */
/* --- Site Navigation / Sidebars --- */
#searchInput {
.madness-theme #mw-panel, /* Vector skins */
     background-color: #5C4033 !important;
.madness-theme #column-one { /* Older skins like Monobook */
     color: #F5F5DC !important;
     background-color: #282b30 !important; /* Consistent with header */
    border: 1px solid #7A5C43 !important;
     padding-top: 10px !important;
}
}
#searchButton, #mw-searchButton {
 
     background-color: #7A5C43 !important;
.madness-theme .portal,
     color: #F5F5DC !important;
.madness-theme .portlet { /* Containers for sidebar sections */
     border: 1px solid #5C4033 !important;
     background: none !important;
     border: none !important;
     margin-bottom: 1em !important;
}
}
#searchButton:hover, #mw-searchButton:hover {
 
     background-color: #8B694E !important;
.madness-theme .portal h3,
.madness-theme .portlet h3,
.madness-theme .vector-menu-heading { /* Sidebar section titles */
    color: #e0e1e2 !important;
     background-color: #3a3d42 !important; /* Darker accent for section titles */
    border: 1px solid #40444b !important;
    border-left: 3px solid #61dafb !important; /* Accent color strip */
    padding: 8px 12px !important;
    font-size: 0.95em !important;
    text-shadow: none !important;
    border-radius: 3px 3px 0 0;
    margin-bottom: 0 !important;
}
}


.madness-theme .portal .body,
.madness-theme .portlet .pBody,
.madness-theme .vector-menu-content { /* Content of sidebar sections */
    background-color: #2c2f33 !important; /* Slightly different from panel bg for depth */
    padding: 10px !important;
    border: 1px solid #40444b !important;
    border-top: none !important;
    border-radius: 0 0 3px 3px;
}


/* --- Sidebars (Navigation, Tools) --- */
.madness-theme .portal .body ul li a,
#mw-panel, .portal {
.madness-theme .portlet .pBody ul li a,
     background-color: #5C4033 !important; /* Medium Dark Brown */
.madness-theme .vector-menu-content ul li a {
     border: 1px solid #7A5C43 !important;
     color: #c8c9ca !important;
     border-radius: 4px; /* Optional: softer corners */
     padding: 5px 8px !important;
     padding-top: 0.5em;
     display: block !important;
     border-radius: 3px;
}
}


#mw-panel h5, .portal h5 { /* Sidebar headings like "Navigation", "Tools" */
.madness-theme .portal .body ul li a:hover,
     color: #E0C9A6 !important; /* Light Tan/Goldish */
.madness-theme .portlet .pBody ul li a:hover,
     border-bottom: 1px solid #7A5C43 !important;
.madness-theme .vector-menu-content ul li a:hover {
     margin-bottom: 0.5em;
    background-color: #3a3d42 !important;
     padding-bottom: 0.3em;
     color: #ffffff !important;
}
.madness-theme .portal .body ul li.active a, /* Current page in nav */
.madness-theme .vector-menu-content ul li.selected a { /* Vector-2022 selected */
     background-color: #61dafb !important;
     color: #1c1e20 !important;
     font-weight: bold;
}
}


#mw-panel li a, .portal li a {
 
     color: #D2B48C !important; /* Tan */
/* --- Search Bar --- */
.madness-theme #simpleSearch,
.madness-theme #p-search form {
     background-color: transparent !important;
    padding: 0 !important; /* Reset if there was padding on the form */
}
}
#mw-panel li a:hover, .portal li a:hover {
.madness-theme #searchInput {
     color: #FFD700 !important; /* Gold */
    background-color: #3a3d42 !important;
     background-color: transparent !important; /* Ensure no weird background on hover */
    color: #e0e1e2 !important;
    border: 1px solid #40444b !important;
    border-radius: 3px !important;
    padding: 6px 10px !important;
}
.madness-theme #searchInput:focus {
     border-color: #61dafb !important;
    box-shadow: 0 0 0 2px rgba(97, 218, 251, 0.3) !important;
}
.madness-theme #searchButton,
.madness-theme #mw-searchButton { /* The "Go" or magnifying glass button */
     background-color: #4a4e54 !important;
    border: 1px solid #40444b !important;
    color: #e0e1e2 !important;
    border-radius: 3px !important;
    padding: 6px 10px !important;
    text-shadow: none !important;
}
.madness-theme #searchButton:hover,
.madness-theme #mw-searchButton:hover {
    background-color: #5a5e64 !important;
}
}


/* --- Main Content Area --- */
/* --- Main Content Area --- */
#content {
.madness-theme #content {
     background-color: #4A3B31 !important; /* Slightly different dark brown for content box */
     background-color: #2c2f33 !important; /* Main content area background */
     color: #F5F5DC !important;
     border: 1px solid #40444b !important;
     border: 1px solid #7A5C43 !important;
     box-shadow: 0 2px 5px rgba(0,0,0,0.2) !important; /* Subtle shadow */
     border-radius: 4px; /* Optional */
     border-radius: 4px !important;
     padding: 1em;
    padding: 20px 25px !important;
    margin-left: /* Adjust based on your sidebar width, e.g., */ 11.5em !important; /* Or use CSS Grid/Flex for layout */
}
.madness-theme #content.mw-body-primary { /* Vector 2022 content area */
     margin-left: 0 !important; /* Vector 2022 handles its own layout */
}
}


/* Page Title */
/* Page Title */
#firstHeading, .firstHeading {
.madness-theme #firstHeading,
     color: #FFD700 !important; /* Gold - for prominence */
.madness-theme .mw-first-heading {
     border-bottom: 1px solid #7A5C43 !important;
     color: #ffffff !important; /* Pure white for main title for emphasis */
     padding-bottom: 0.2em;
    text-shadow: none !important;
     margin-bottom: 0.5em;
     border-bottom: 1px solid #40444b !important;
     padding-bottom: 0.4em !important;
     margin-bottom: 0.7em !important;
}
 
/* Content Text */
.madness-theme #mw-content-text {
    color: #e0e1e2 !important;
}
.madness-theme #mw-content-text p {
    line-height: 1.6 !important;
}
 
/* Other Headings in content */
.madness-theme #mw-content-text h2,
.madness-theme #mw-content-text h3,
.madness-theme #mw-content-text h4,
.madness-theme #mw-content-text h5,
.madness-theme #mw-content-text h6 {
    color: #f0f1f2 !important;
    border-bottom-color: #40444b !important;
}
}


/* Headings within content */
/* --- Page Tabs (View, Edit, History, etc.) --- */
h1, h2, h3, h4, h5, h6 {
.madness-theme #p-views,
     color: #E0C9A6 !important; /* Light Tan/Goldish */
.madness-theme #p-cactions { /* Vector-2022 and similar */
     border-bottom-color: #7A5C43 !important; /* If they have borders */
    /* Adjust positioning if needed */
}
.madness-theme #p-views ul,
.madness-theme #p-cactions ul {
    background-image: none !important; /* Remove any gradient */
    border-bottom: 1px solid #40444b !important;
    padding-left: 10px !important;
}
.madness-theme #p-views ul li,
.madness-theme #p-cactions ul li {
    background: none !important;
    border: none !important;
    margin-right: 2px !important;
}
.madness-theme #p-views ul li a,
.madness-theme #p-cactions ul li a {
    background-color: #3a3d42 !important;
    border: 1px solid #40444b !important;
    border-bottom: none !important;
    color: #c8c9ca !important;
    text-shadow: none !important;
    padding: 0.6em 1.2em !important;
    border-radius: 4px 4px 0 0 !important;
}
.madness-theme #p-views ul li.selected a,
.madness-theme #p-cactions ul li.selected a {
     background-color: #2c2f33 !important; /* Match content background */
     border-color: #40444b !important;
    color: #ffffff !important;
    padding-bottom: calc(0.6em + 1px) !important; /* Overlap border */
}
.madness-theme #p-views ul li a:hover,
.madness-theme #p-cactions ul li a:hover {
    background-color: #4a4e54 !important;
    color: #ffffff !important;
}
}


/* --- Tabs (View, Edit, History, etc.) --- */
 
#p-views ul li a, #p-cactions ul li a { /* Covers most tab systems */
/* --- Warning and Message Boxes --- */
     background-color: #5C4033 !important; /* Tab background */
.madness-theme .warningbox,
     color: #D2B48C !important; /* Tab text */
.madness-theme .usermessage,
     border: 1px solid #7A5C43 !important;
.madness-theme div.error,
     border-bottom: none !important; /* Remove bottom border for unselected */
.madness-theme div.warning,
     border-radius: 4px 4px 0 0; /* Rounded top corners */
.madness-theme .mw-message-box {
    border-radius: 4px !important;
    text-shadow: none !important;
    padding: 12px 18px !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.2) !important;
}
.madness-theme .mw-message-box-warning, .madness-theme .warningbox {
     background-color: #4d322f !important; /* Dark, muted red */
     color: #f0e0e0 !important;
     border: 1px solid #804040 !important;
}
.madness-theme .mw-message-box-success {
     background-color: #2f4d3c !important; /* Dark, muted green */
    color: #e0f0e0 !important;
     border: 1px solid #408050 !important;
}
.madness-theme .mw-message-box-info {
    background-color: #2f3c4d !important; /* Dark, muted blue */
    color: #e0e0f0 !important;
    border: 1px solid #405080 !important;
}
}


#p-views ul li a:hover, #p-cactions ul li a:hover {
 
     background-color: #7A5C43 !important;
/* --- Code Editor (AceEditor for JS/CSS pages) --- */
     color: #FFD700 !important;
.madness-theme .ace_editor {
     background-color: #1c1e20 !important; /* Even darker for code */
     color: #d4d4d4 !important;
    border: 1px solid #3a3d42 !important;
    border-radius: 3px;
}
}
.madness-theme .ace_gutter { background: #25272a !important; color: #858585 !important; }
.madness-theme .ace_gutter-active-line { background-color: #33363a !important; }
.madness-theme .ace_marker-layer .ace_active-line { background: #2a2d30 !important; }
.madness-theme .ace_cursor { color: #f0f0f0 !important; }
.madness-theme .ace_keyword { color: #569cd6 !important; }
.madness-theme .ace_string { color: #ce9178 !important; }
.madness-theme .ace_comment { color: #6A9955 !important; font-style: italic; }
.madness-theme .ace_variable { color: #9cdcfe !important; }
.madness-theme .ace_numeric { color: #b5cea8 !important; }
.madness-theme .ace_function { color: #dcdcaa !important; }
.madness-theme .ace_tag { color: #569cd6 !important; }
.madness-theme .ace_attr-name { color: #9cdcfe !important; }
.madness-theme .ace_attr-value { color: #ce9178 !important; }


#p-views ul li.selected a, #p-cactions ul li.selected a,
/* --- Standard MediaWiki UI Buttons --- */
#p-views ul li.selected a:hover, #p-cactions ul li.selected a:hover {
.madness-theme .mw-ui-button {
     background-color: #4A3B31 !important; /* Match content area background for selected tab */
    background-color: #4a4e54 !important;
     color: #FFD700 !important; /* Gold for selected text */
    color: #e0e1e2 !important;
     border: 1px solid #7A5C43 !important;
    border: 1px solid #40444b !important;
     border-bottom: 1px solid #4A3B31 !important; /* Blend bottom border with content */
    border-radius: 3px !important;
    text-shadow: none !important;
    padding: 6px 12px !important;
}
.madness-theme .mw-ui-button:hover {
    background-color: #5a5e64 !important;
    border-color: #50545b !important;
}
.madness-theme .mw-ui-button.mw-ui-progressive { /* Save page, etc. */
    background-color: #28a745 !important; /* Fandom-like green */
    border-color: #1e7e34 !important;
    color: #ffffff !important;
}
.madness-theme .mw-ui-button.mw-ui-progressive:hover {
     background-color: #218838 !important;
    border-color: #19692c !important;
}
.madness-theme .mw-ui-button.mw-ui-destructive { /* Delete, etc. */
     background-color: #dc3545 !important; /* Fandom-like red */
     border-color: #bd2130 !important;
    color: #ffffff !important;
}
.madness-theme .mw-ui-button.mw-ui-destructive:hover {
    background-color: #c82333 !important;
     border-color: #a51b28 !important;
}
}


/* --- Tables --- */
/* --- Tables --- */
table.wikitable, .wikitable {
.madness-theme table.wikitable {
     background-color: #5C4033 !important;
     background-color: #3a3d42 !important;
     border: 1px solid #7A5C43 !important;
     border: 1px solid #40444b !important;
     color: #F5F5DC !important;
     color: #c8c9ca !important;
    border-collapse: collapse !important; /* Cleaner look */
}
}
table.wikitable > tr > th, table.wikitable > * > tr > th, .wikitable th {
.madness-theme table.wikitable > tr > th,
     background-color: #7A5C43 !important;
.madness-theme table.wikitable > * > tr > th {
     color: #F5F5DC !important;
     background-color: #4a4e54 !important;
     border: 1px solid #6B4F3E !important;
    border: 1px solid #40444b !important;
     color: #e0e1e2 !important;
     padding: 8px 10px !important;
}
}
table.wikitable > tr > td, table.wikitable > * > tr > td, .wikitable td {
.madness-theme table.wikitable > tr > td,
     border: 1px solid #6B4F3E !important;
.madness-theme table.wikitable > * > tr > td {
     border: 1px solid #40444b !important;
    padding: 8px 10px !important;
}
}


/* --- Other UI Elements --- */
/* --- Footer --- */
/* Buttons (general, if not covered by specific selectors) */
.madness-theme #footer {
input[type="submit"], input[type="button"], button {
     background-color: #282b30 !important;
     background-color: #7A5C43 !important;
     border-top: 1px solid #40444b !important;
     color: #F5F5DC !important;
    padding: 15px !important;
     border: 1px solid #5C4033 !important;
     color: #a8a9aa !important;
     padding: 5px 10px;
}
     border-radius: 3px;
.madness-theme #footer ul li {
     color: #a8a9aa !important; /* Ensure list items in footer are styled */
}
.madness-theme #footer ul li a {
     color: #61dafb !important; /* Footer links */
}
}
input[type="submit"]:hover, input[type="button"]:hover, button:hover {
.madness-theme #footer ul li a:hover {
     background-color: #8B694E !important;
     color: #82e4ff !important;
}
}


/* Input fields */
/* --- Other common elements --- */
input[type="text"], input[type="password"], textarea {
.madness-theme hr {
     background-color: #5C4033 !important;
     border-top-color: #40444b !important;
    color: #F5F5DC !important;
     border-bottom: none !important;
     border: 1px solid #7A5C43 !important;
    padding: 4px;
}
}


/* Remove that harsh red glow you had */
.madness-theme input[type="text"],
.mw-body-content { /* Or whatever element had the glow */
.madness-theme input[type="password"],
     box-shadow: none !important;
.madness-theme input[type="email"],
     border: none !important; /* If the glow was a border */
.madness-theme input[type="search"],
.madness-theme textarea {
     background-color: #3a3d42 !important;
    color: #e0e1e2 !important;
     border: 1px solid #40444b !important;
    border-radius: 3px !important;
    padding: 6px 10px !important;
}
}
/* If the glow was on the main content box specifically */
.madness-theme input[type="text"]:focus,
#content {
.madness-theme input[type="password"]:focus,
     box-shadow: none !important; /* Remove existing glows */
.madness-theme input[type="email"]:focus,
     /* You can add a very subtle dark shadow if you want depth */
.madness-theme input[type="search"]:focus,
    /* box-shadow: 0 0 10px rgba(0,0,0,0.3); */
.madness-theme textarea:focus {
     border-color: #61dafb !important;
     box-shadow: 0 0 0 2px rgba(97, 218, 251, 0.3) !important;
}
}


/* Horizontal rules */
/* Adjustments for specific skins if needed */
hr {
/* Example for Vector-2022 collapsible sidebar */
     border: 0;
.madness-theme .vector-feature-sidebar-pinned-container .vector-sticky-header {
     border-top: 1px solid #7A5C43 !important;
     background-color: #282b30 !important;
     border-bottom: 1px solid #40444b !important;
}
}
Retrieved from "https://madnessdescent.wikioasis.org/wiki/MediaWiki:Common.css"