MediaWiki:Gadget-VivahxTheme.css: Difference between revisions

From Hotline Wiki

Created page with "* * Vivahx Self-Contained Skin Override * Packaged as a MediaWiki Gadget: :root { --vhx-bg: #FDF5C6; --vhx-white: #FFFFFF; --vhx-sidebar-bg: #F2F2F2; --vhx-accent-green: #9ADA92; --vhx-text-blue: #333366; --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://w..."
 
No edit summary
Line 1: Line 1:
/**
/**
  * Vivahx Self-Contained Skin Override
  * Vivahx Fixed Self-Contained Skin Override
* Packaged as a MediaWiki Gadget
  */
  */


Line 16: Line 15:
}
}


/* Container Logic */
/* 1. Reset and Container */
body {
body {
     background-color: var(--vhx-bg) !important;
     background-color: var(--vhx-bg) !important;
Line 22: Line 21:
}
}


/* Force the wiki into the 808px box */
#globalWrapper, #mw-wrapper, .mw-body {
#globalWrapper, #mw-wrapper, .mw-body {
     width: var(--vhx-width) !important;
     width: var(--vhx-width) !important;
Line 28: Line 26:
     border: 1px solid var(--vhx-border) !important;
     border: 1px solid var(--vhx-border) !important;
     background-color: var(--vhx-white) !important;
     background-color: var(--vhx-white) !important;
     position: relative;
     display: block;
     padding: 0 !important;
     overflow: visible !important; /* Changed from hidden to ensure clicks register */
}
}


/* Header & Logo */
/* 2. Header & Logo - Ensuring z-index doesn't block clicks */
#p-logo {
#p-logo {
     position: relative !important;
     position: relative !important;
Line 40: Line 38:
     background: var(--vhx-logo-url) no-repeat left center #FAFDF6 !important;
     background: var(--vhx-logo-url) no-repeat left center #FAFDF6 !important;
     border-bottom: 1px solid var(--vhx-border);
     border-bottom: 1px solid var(--vhx-border);
     margin-bottom: 0 !important;
     z-index: 5;
}
}
#p-logo a { background-image: none !important; width: 100%; height: 100%; }
#p-logo a { display: block; width: 100%; height: 100%; background-image: none !important; }


/* The Green Action Bar (Edit, History, etc) */
/* 3. The Action Bar */
#p-cactions {
#p-cactions {
     position: static !important;
     position: relative !important;
     background-color: var(--vhx-accent-green) !important;
     background-color: var(--vhx-accent-green) !important;
    margin: 0 !important;
     padding: 5px 0 !important;
     padding: 5px 0 !important;
     border-bottom: 1px solid var(--vhx-border);
     border-bottom: 1px solid var(--vhx-border);
     text-align: center;
     text-align: center;
    z-index: 10;
}
}
#p-cactions li {  
#p-cactions li { display: inline-block !important; }
    display: inline-block !important;  
 
     background: none !important;  
/* 4. Layout Fix: Sidebar and Content Area */
#content {
    margin-right: 210px !important; /* Space for sidebar */
     margin-left: 0 !important;
     border: none !important;
     border: none !important;
}
    padding: 20px !important;
#p-cactions li a {
     position: relative !important;
     color: var(--vhx-text-blue) !important;  
     z-index: 1; /* Content stays low */
     font-weight: bold !important;  
}
}


/* Right Sidebar Implementation */
/* Moving sidebar to the right and ensuring it doesn't overlap content */
#column-one { padding: 0 !important; }
#mw-panel, #column-one {
#mw-panel, #column-one {
     float: right !important;
     position: absolute !important;
     position: relative !important;
    top: 140px; /* Adjust based on logo + cactions height */
     width: 190px !important;
    right: 0 !important;
     left: auto !important;
     width: 180px !important;
     background-color: var(--vhx-sidebar-bg) !important;
     background-color: var(--vhx-sidebar-bg) !important;
     padding: 15px !important;
     padding: 15px !important;
     border-left: 1px solid #CCC;
     border-left: 1px solid #CCC;
     margin: 0 !important;
     height: auto !important;
     min-height: 100vh;
     min-height: 400px;
    z-index: 2; /* Sidebar sits above content but only on the right */
}
}


/* Sidebar Boxes (Portlets) */
/* 5. Sidebar Boxes Styling */
.portlet, .mw-portlet {
.portlet, .mw-portlet {
     background: var(--vhx-white) !important;
     background: var(--vhx-white) !important;
     border: 1px solid var(--vhx-border) !important;
     border: 1px solid var(--vhx-border) !important;
     margin-bottom: 15px !important;
     margin-bottom: 15px !important;
     overflow: hidden;
     pointer-events: auto !important; /* Force clickability */
}
}
.portlet h3, .mw-portlet h3 {
.portlet h3, .mw-portlet h3 {
     background: var(--vhx-title-bg) repeat-x !important;
     background: var(--vhx-title-bg) repeat-x !important;
     color: #000 !important;
     color: #000 !important;
     font-size: 12px !important;
     font-size: 11px !important;
     font-weight: bold !important;
     font-weight: bold !important;
     height: 25px !important;
     height: 25px !important;
Line 92: Line 94:
     padding-left: 10px !important;
     padding-left: 10px !important;
     border-bottom: 1px solid var(--vhx-border);
     border-bottom: 1px solid var(--vhx-border);
    text-transform: none !important;
}
/* Main Content area adjustment */
#content {
    margin-right: 220px !important; /* Matches sidebar width + padding */
    margin-left: 0 !important;
    border: none !important;
    padding: 20px !important;
}
}


/* Retro cleanup: Hide the default MediaWiki sidebar background */
/* 6. Clean Up Hide Elements */
#mw-head-base, #mw-page-base { display: none !important; }
#mw-head-base, #mw-page-base, #left-navigation { display: none !important; }

Revision as of 19:33, 8 March 2026

/**
 * Vivahx Fixed Self-Contained Skin Override
 */

:root {
    --vhx-bg: #FDF5C6;
    --vhx-white: #FFFFFF;
    --vhx-sidebar-bg: #F2F2F2;
    --vhx-accent-green: #9ADA92;
    --vhx-text-blue: #333366;
    --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");
}

/* 1. Reset and Container */
body {
    background-color: var(--vhx-bg) !important;
    font-family: Verdana, Tahoma, sans-serif !important;
}

#globalWrapper, #mw-wrapper, .mw-body {
    width: var(--vhx-width) !important;
    margin: 30px auto !important;
    border: 1px solid var(--vhx-border) !important;
    background-color: var(--vhx-white) !important;
    display: block;
    overflow: visible !important; /* Changed from hidden to ensure clicks register */
}

/* 2. Header & Logo - Ensuring z-index doesn't block clicks */
#p-logo {
    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);
    z-index: 5;
}
#p-logo a { display: block; width: 100%; height: 100%; background-image: none !important; }

/* 3. The Action Bar */
#p-cactions {
    position: relative !important;
    background-color: var(--vhx-accent-green) !important;
    padding: 5px 0 !important;
    border-bottom: 1px solid var(--vhx-border);
    text-align: center;
    z-index: 10;
}
#p-cactions li { display: inline-block !important; }

/* 4. Layout Fix: Sidebar and Content Area */
#content {
    margin-right: 210px !important; /* Space for sidebar */
    margin-left: 0 !important;
    border: none !important;
    padding: 20px !important;
    position: relative !important;
    z-index: 1; /* Content stays low */
}

/* Moving sidebar to the right and ensuring it doesn't overlap content */
#mw-panel, #column-one {
    position: absolute !important;
    top: 140px; /* Adjust based on logo + cactions height */
    right: 0 !important;
    left: auto !important;
    width: 180px !important;
    background-color: var(--vhx-sidebar-bg) !important;
    padding: 15px !important;
    border-left: 1px solid #CCC;
    height: auto !important;
    min-height: 400px;
    z-index: 2; /* Sidebar sits above content but only on the right */
}

/* 5. Sidebar Boxes Styling */
.portlet, .mw-portlet {
    background: var(--vhx-white) !important;
    border: 1px solid var(--vhx-border) !important;
    margin-bottom: 15px !important;
    pointer-events: auto !important; /* Force clickability */
}
.portlet 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);
}

/* 6. Clean Up Hide Elements */
#mw-head-base, #mw-page-base, #left-navigation { display: none !important; }