MediaWiki:Gadget-VivahxTheme.css: Difference between revisions

Revision as of 19:35, 8 March 2026

/**
 * Vivahx Retro Theme - Vector Skin Compatibility Fix
 */

/* 1. Global Setup */
:root {
    --vhx-bg: #FDF5C6;
    --vhx-white: #FFFFFF;
    --vhx-sidebar-bg: #F2F2F2;
    --vhx-accent-green: #9ADA92;
    --vhx-border: #999999;
    --vhx-width: 808px;
    --vhx-logo-url: url("https://web.archive.org/web/20060825120444im_/http://www.vivahx.com/images/logo.jpg");
    --vhx-title-bg: url("https://web.archive.org/web/20060825120444im_/http://www.vivahx.com/images/fond_titre.jpg");
}

body {
    background-color: var(--vhx-bg) !important;
    font-family: Verdana, Tahoma, sans-serif !important;
    display: flex;
    justify-content: center;
}

/* 2. Main Wrapper Box[cite: 1] */
#mw-content-container, 
#content, 
#mw-page-base, 
#mw-head-base {
    background: none !important;
}

#content {
    margin: 0 !important;
    border: none !important;
    padding: 25px !important;
}

/* Force the 808px Container[cite: 1] */
#container, #mw-wrapper, .mw-body {
    width: var(--vhx-width) !important;
    max-width: var(--vhx-width) !important;
    margin: 30px auto !important;
    background-color: var(--vhx-white) !important;
    border: 1px solid var(--vhx-border) !important;
    display: grid;
    grid-template-columns: 1fr 200px; /* Content left, Sidebar right */
    grid-template-areas: 
        "header header"
        "toolbar toolbar"
        "main sidebar";
}

/* 3. Header Area */
#p-logo {
    grid-area: header;
    position: relative !important;
    display: block !important;
    width: 100% !important;
    height: 100px !important;
    background: var(--vhx-logo-url) no-repeat left center #FAFDF6 !important;
    border-bottom: 1px solid var(--vhx-border);
    margin: 0 !important;
}
#p-logo a { background-image: none !important; width: 100%; height: 100%; }

/* 4. Top Wiki Toolbar (Action Bar)[cite: 7] */
#p-cactions, #left-navigation, #right-navigation {
    grid-area: toolbar;
    background-color: var(--vhx-accent-green) !important;
    padding: 5px 0 !important;
    border-bottom: 1px solid var(--vhx-border);
    display: flex !important;
    justify-content: center;
    position: static !important;
}

/* 5. Main Content Area[cite: 1] */
#content {
    grid-area: main;
    z-index: 1;
}

/* 6. Sidebar (Right Dock)[cite: 1, 7] */
#mw-panel {
    grid-area: sidebar;
    position: static !important; /* Disables the float that blocks clicks */
    width: 100% !important;
    background-color: var(--vhx-sidebar-bg) !important;
    border-left: 1px solid #CCC;
    padding: 15px !important;
    box-sizing: border-box;
}

/* Sidebar Box Styling[cite: 1] */
.portal, .mw-portlet {
    background: var(--vhx-white) !important;
    border: 1px solid var(--vhx-border) !important;
    margin-bottom: 15px !important;
}

.portal h3, .mw-portlet h3 {
    background: var(--vhx-title-bg) repeat-x !important;
    color: #000 !important;
    font-size: 11px !important;
    font-weight: bold !important;
    height: 25px !important;
    line-height: 25px !important;
    padding-left: 10px !important;
    border-bottom: 1px solid var(--vhx-border);
}

/* Clean up Vector specific tabs/bars */
#mw-head, #mw-panel-base { display: none !important; }
#p-search { margin-top: 10px; }