Madness Descent (Roblox) Wiki

MediaWiki:Common.js: Difference between revisions

Editingthingsforlife (talk | contribs)
Bureaucrats, Interface administrators, Administrators
27 edits
Created page with "// Madness Descent Wiki – Custom JS for Vector-2022 skin // Place in MediaWiki:Common.js $(document).ready(function () { // Add theme class to body for easier CSS targeting document.body.classList.add('madness-theme'); // === Header Enhancements === const $heading = $('#firstHeading'); if ($heading.length) { $heading.css({ 'font-size': '3em', 'font-weight': 'bold', 'color': '#ff2c2c', 'text-s..."
 
Editingthingsforlife (talk | contribs)
Bureaucrats, Interface administrators, Administrators
27 edits
No edit summary
 
(One intermediate revision by the same user not shown)
Line 1: Line 1:
// Madness Descent Wiki – Custom JS for Vector-2022 skin
$(document).ready(function () {
// Place in MediaWiki:Common.js
    // --- Add Global Theme Class ---
    document.body.classList.add('madness-theme'); // This line is likely already there


$(document).ready(function () {
    // --- Toggle Sidebar Tools Panel --- (This part seems fine, leave it if it works)
    // Add theme class to body for easier CSS targeting
    const tools = document.getElementById('p-tb');
    document.body.classList.add('madness-theme');
    if (tools) {
        tools.classList.add('collapsed');


    // === Header Enhancements ===
        const toggleBtn = document.createElement('div');
    const $heading = $('#firstHeading');
         toggleBtn.id = 'p-tb-toggle';
    if ($heading.length) {
         // ... (rest of your existing toggle code) ...
         $heading.css({
            'font-size': '3em',
            'font-weight': 'bold',
            'color': '#ff2c2c',
            'text-shadow': '0 0 8px #ff0000',
            'text-align': 'center',
            'margin-bottom': '20px'
         });
     }
     }


     // === Homepage Enhancements ===
     // --- NEW: Add CSS Overrides for a better theme ---
     if (mw.config.get('wgPageName') === 'Main_Page') {
     const cssFixes = `
         const content = $('#bodyContent');
         /* Make sure these selectors are specific enough to override existing styles.
          You might need to inspect elements to find the right classes/IDs targeted by .madness-theme */


         // Center the content
         .madness-theme, .madness-theme body {
        content.css({
             /* Tone down the overall background if it's too dark */
            'text-align': 'center',
             /* background-color: #2a2a2a !important;  Example: a softer dark */
             'padding': '20px',
         }
             'background-color': '#2a1b14',
            'border': '2px solid #ff3b3b',
            'border-radius': '10px',
            'box-shadow': '0 0 12px #ff0000',
         });


         // Add a glowing welcome box
         /* Main page title (e.g., "Editing MediaWiki:Common.js") */
         const welcomeBox = `
         .madness-theme #firstHeading, .madness-theme .mw-first-heading {
            <div id="madness-welcome" style="
            color: #E0E0E0 !important; /* Light gray/white for readability on dark */
                margin-top: 1em;
            text-shadow: none !important; /* Remove aggressive text shadow */
                background-color: #120a07;
            /* Or a very subtle shadow: text-shadow: 0 0 5px rgba(200, 200, 200, 0.3) !important; */
                color: #ffffff;
         }
                padding: 20px;
                border: 2px solid #ff2c2c;
                border-radius: 12px;
                box-shadow: 0 0 15px #ff0000;
                font-size: 1.2em;
                line-height: 1.6em;
            ">
                <strong>Welcome to the official Madness Descent Wiki!</strong><br>
                Madness Descent is an asymmetrical Roblox game inspired by Pillar Chase 2.
            </div>
         `;


         content.prepend(welcomeBox);
         /* The main content area box */
        .madness-theme #content, .madness-theme #mw-content-text {
            /* background-color: #1e1e1e !important; /* Slightly different dark if needed */
            /* border: 1px solid #555 !important; /* A subtle border instead of glow */
            box-shadow: 0 0 10px rgba(128, 0, 0, 0.3) !important; /* Much softer, less intense glow, or none */
            /* Or remove glow completely: box-shadow: none !important; */
        }
 
        /* Warning boxes */
        .madness-theme .warningbox, .madness-theme .usermessage {
            background-color: #4d2f2f !important; /* Darker, less saturated red background */
            color: #f0f0f0 !important; /* Light text for contrast */
            border-color: #803030 !important;
        }
        .madness-theme .warningbox p, .madness-theme .usermessage p {
            color: #f0f0f0 !important;
        }


        // Add a call-to-action "Explore" button
        const exploreBtn = `
            <div style="margin-top: 30px;">
                <button style="
                    background-color: #ff4646;
                    border: none;
                    color: white;
                    font-weight: bold;
                    font-size: 1.2em;
                    padding: 15px 30px;
                    border-radius: 12px;
                    box-shadow: 0 0 10px #ff2c2c;
                    cursor: pointer;
                " onclick="location.href='/wiki/Monsters'">Explore Monsters</button>
            </div>
        `;


         content.append(exploreBtn);
         /* Links under the title (Message, Discussion, Edit, History) */
    }
        .madness-theme #p-views ul li a, .madness-theme #ca-edit a, .madness-theme #ca-history a {
            /* color: #87CEFA !important; /* Light Sky Blue - example */
        }


    // === Sidebar Enhancements (Navigation & Community) ===
        /* General text color within the content area if it's also red */
    const enhanceSidebarSection = (selector, title) => {
        .madness-theme #mw-content-text p,
         const section = $(selector);
         .madness-theme #mw-content-text div,
        if (section.length) {
        .madness-theme #mw-content-text li {
            section.find('h3').css({
            /* color: #cccccc !important; /* Light gray for body text */
                'color': '#ff3b3b',
        }
                'font-family': 'Impact, sans-serif',
                'font-size': '1.2em',
                'border-bottom': '2px solid #ff4444',
                'margin-bottom': '10px'
            });


            section.find('ul li a').css({
        /* Code editor area (if it's also affected by the theme) */
                'background-color': '#1a120e',
        .madness-theme .ace_editor, .madness-theme .mw-editfont-monospace {
                'color': '#ffd966',
            /* background-color: #1c1c1c !important; */
                'padding': '8px',
            /* color: #d4d4d4 !important; */
                'border-radius': '5px',
        }
                'display': 'block',
        .madness-theme .ace_gutter {
                'margin-bottom': '5px',
            /* background-color: #252526 !important; */
                'text-decoration': 'none'
        }
            }).hover(function () {
        .madness-theme .ace_string {
                $(this).css({
            /* color: #ce9178 !important; */
                    'background-color': '#333',
        }
                    'color': '#fff'
        .madness-theme .ace_keyword {
                });
            /* color: #569cd6 !important; */
             });
        }
        .madness-theme .ace_comment {
             /* color: #6A9955 !important; */
         }
         }
    };


     enhanceSidebarSection('#p-navigation');
     `;
     enhanceSidebarSection('#p-Community');
 
    const styleElement = document.createElement('style');
     styleElement.type = 'text/css';
    if (styleElement.styleSheet) {
        // For IE8 and below.
        styleElement.styleSheet.cssText = cssFixes;
    } else {
        styleElement.appendChild(document.createTextNode(cssFixes));
    }
    document.head.appendChild(styleElement);


     // === Add favicon (optional) ===
     console.log('Custom CSS fixes applied for madness-theme.');
    $('head').append('<link rel="icon" type="image/png" href="https://example.com/path/to/icon.png">');
});
});
Retrieved from "https://madnessdescent.wikioasis.org/wiki/MediaWiki:Common.js"