Insurer Brain

MediaWiki:Mobile.css: Difference between revisions

Browse history interactively
← Older editNewer edit →
Content deleted Content added
No edit summary
Tag: Manual revert
No edit summary
Line 153:
 
/* ======================================================= */
/* 2. FIXEDTRANSPARENT TOPSTICKY COMMAND BARTOOLBAR (Home - Search - TOC) - FIXED */
/* ======================================================= */
 
/* --- A. THEREADING WHITEMODE BACKGROUND(Transparent STRIP& Sticky) --- */
.header-container.header-chrome {
position: fixed !important;
top: 0 !important;
left: 0 !important;
right: 0 !important;
height: 50px !important;
z-index: 1000 !important;
background-color: #ffffff !important;
border-bottom: 1px solid #eaecf0 !important;
/* CRITICAL FIXES: */
transform: none !important; /* Stop scrolling logic */
transition: none !important;
overflow: visible !important; /* Allow search drawer to hang out the bottom */
}
 
/* 1. HIDE THE CONTAINER (But keep it technically there) */
/* Push page content down */
/* We make the container invisible so you see the page content behind it. */
body.skin-minerva {
body:not(.mw-mf-search-mode) .header-container.header-chrome {
padding-top: 50px !important;
background: transparent !important;
}
border: none !important;
.mw-body {
marginbox-topshadow: 50pxnone !important;
pointer-events: none !important; /* Let clicks pass through empty space */
position: absolute !important; /* Get out of the way */
}
 
/* Hide2. unwantedHIDE elementsUNWANTED ELEMENTS */
body:not(.headermw-containermf-search-mode) .navigation-drawer,
body:not(.mw-mf-search-mode) .minerva-header .search-box {
display: none !important;
}
 
/* --- B. BUTTONTHE 1:3 HOMESTICKY BUTTONS (FixedPinned to LeftScreen) --- */
/* We use 'position: fixed' on the buttons themselves so they never hide */
.branding-box, .branding-box a {
 
position: fixed !important;
/* BUTTON 1: HOME (Top Left) */
top: 0 !important;
body:not(.mw-mf-search-mode) .branding-box {
left: 0 !important;
width: 60px !important;
height: 50px !important;
z-index: 1002 !important; /* Above the strip */
display: flex !important;
align-itemsposition: centerfixed !important;
top: 5px !important;
justify-content: center;
left: 10px !important;
z-index: 1002 !important;
pointer-events: auto !important; /* Re-enable clicking */
}
body:not(.mw-mf-search-mode) .branding-box a {
font-size: 0 !important; color: transparent !important;
}
body:not(.mw-mf-search-mode) .branding-box a::before {
.branding-box a { font-size: 0 !important; color: transparent !important; }
.branding-box a::before {
content: "⌂";
font-size: 28px30px;
font-weight: bold;
color: #000;
/* White glow to ensure visibility on dark images */
margin-top: -4px;
text-shadow: 0 0 5px rgba(255,255,255, 0.8);
}
 
/* --- C. BUTTON 2: SEARCH TRIGGER (FixedTop Center) --- */
body:not(.mw-mf-search-mode) #searchIcon {
display: flex !important;
align-items: center; justify-content: center;
position: fixed !important;
top: 05px !important;
left: 50% !important;
transform: translateX(-50%) !important;
width: 60px44px !important; height: 44px !important;
height: 50px !important;
z-index: 1002 !important;
display: flex !important;
align-items: center;
justify-content: center;
background: transparent !important;
border: none !important;
box-shadow: none !important;
pointer-events: auto !important;
margin: 0 !important; padding: 0 !important;
box-shadow: none !important;
}
body:not(.mw-mf-search-mode) #searchIcon .minerva-icon {
font-size: 24px;
color: #000;
opacity: 0.78;
text-shadow: 0 0 5px rgba(255,255,255, 0.8);
}
 
/* --- D. BUTTON 3: TOC (FixedTop Right) --- */
body:not(.mw-mf-search-mode) #cps-open-toc {
display: flex !important;
position: fixed !important;
top: 3px5px !important;
right: 5px10px !important;
bottom: auto !important; left: auto !important;
leftwidth: auto44px !important; height: 44px !important;
width: 44px !important;
height: 44px !important;
z-index: 1002 !important;
background: transparent !important;
color: #000 !important;
box-shadow: none !important;
pointer-events: auto !important;
}
/* Ensure the TOC icon matches the others */
body:not(.mw-mf-search-mode) #cps-open-toc .icon {
text-shadow: 0 0 5px rgba(255,255,255, 0.8);
}
 
/* --- EC. THE REAL SEARCH BARMODE (The DrawerClean Switch) --- */
/* When you click Search, we hide the sticky buttons and show a clean white bar. */
 
/* 1. TargetHide the FORMTransparent container,Sticky not just the inputButtons */
body.mw-mf-search-mode .branding-box,
/* We force the entire form wrapper to drop down below the header */
body.mw-mf-search-mode .minerva-search-form {#searchIcon,
body.mw-mf-search-mode #cps-open-toc {
display: block !important;
display: none !important;
}
 
/* 2. Show the Standard White Header */
body.mw-mf-search-mode .header-container.header-chrome {
position: fixed !important;
top: 50px0 !important; /* Pushes it exactly below the toolbar */
left: 0 !important; right: 0 !important;
rightbackground: 0#ffffff !important;
zborder-indexbottom: 9991px solid #ccc !important; /* Below the toolbar buttons */
margin: 0 !important;
padding: 0 !important;
height: auto !important;
pointer-events: auto !important;
z-index: 1000 !important;
display: block !important;
}
 
/* 23. TargetShow the innerInput BoxField */
body.mw-mf-search-mode .minerva-header .search-box {
display: block !important;
positionpadding: relative8px !important; /* Relative to the form above */
topopacity: 01 !important;
width: 100% !important;
padding: 10px !important;
background-color: #f0f0f0 !important; /* Grey drawer background */
border-bottom: 1px solid #ccc;
box-shadow: 0 4px 6px rgba(0,0,0,0.1);
box-sizing: border-box !important;
}
 
/* 34. Style the Input FieldText */
body.mw-mf-search-mode .minerva-header .search-box input {
display: block !important;
width: 100% !important;
height: 40px !important;
padding-left: 10px !important;
background: #fff !important;
color: #000 !important;
border: 1px solid #ccc !important;
border-radius: 4px !important;
-webkit-appearanceheight: none36px !important;
opacity: 1 !important;
}
 
/* 4. Hide duplicate icons inside the drawer */
body.mw-mf-search-mode .minerva-header .search-box .search-box-icon-overlay {
display: none !important;
}
 
/* 5. Dim the Search Trigger Button while searching */
body.mw-mf-search-mode #searchIcon {
opacity: 0.2 !important;
pointer-events: none;
}
Retrieved from "https://www.insurerbrain.com/wiki/MediaWiki:Mobile.css"