|
/* ======================================================= */
/* FLOATING (STICKY) HEADER (Minerva Skin - Mobile & Desktop) */
/* ======================================================= */
/* 1. Apply Sticky Positioning */
/* Target the specific header container found in your HTML */
.header-container.header-chrome {
position: -webkit-sticky; /* For Safari /iOS */ ▼ /* Make it stick to the top */
▲ position: -webkit-sticky; /* For Safari/iOS */
position: sticky;
top: 0;
/* LayeringZ-Index:
999 is high enough to sitfloat aboveover article text/imagesarticles,
but lower than your custom TOC overlay (which is 1001) and the native Search Overlay */
z-index: 999;
/* Visuals:
White background is required soprevents text doesn'tfrom scrollshowing "behind"through itwhen visiblyscrolling.
Box-shadowBorder addsprovides a subtleclean line to separate itseparation from the content. */
background-color: #fffffffff;
boxborder-shadowbottom: 0 1px 2pxsolid rgba(0,0,0,0.05)#eaecf0;
width: 100%;
}
/* 2. Fix Search Overlay Compatibility */
/* ======================================================= */
/* When you click search, Minerva adds 'mw-mf-search-mode' to the body.
/* FIX SEARCH BEHAVIOR (Disable Full-Screen Overlay) */
We must ensure the header behaves correctly during this native animation. */
/* ======================================================= */
/* 1. Fix Invisible Text
Force the input text to be black and the background white
so you can actually see what you are typing. */
.minerva-header .search-box .search {
color: #000 !important;
background-color: #fff !important;
opacity: 1 !important;
}
/* 2. Kill the "White Overlay" Animation
Minerva tries to expand the header to 100% height when searching.
We force it to stay small and sticky. */
html.mw-mf-search-mode .header-container.header-chrome,
body.mw-mf-search-mode .header-container.header-chrome {
/* When search is active, we let Minerva take control of the border
height: auto !important; /* Prevent full screen height */
and positioning to prevent visual glitches */
bottom: auto !important; /* Release bottom anchor */
border-bottom: none;
position: sticky !important; /* Keep it sticky at top */
top: 0 !important;
overflow: visible !important; /* Allow dropdowns if needed */
}
/* 3. Un-hide the Page Content
Minerva hides the article content (main) when search is active.
We force it to remain visible. */
html.mw-mf-search-mode #content,
body.mw-mf-search-mode #content,
html.mw-mf-search-mode #bodyContent,
body.mw-mf-search-mode #bodyContent {
display: block !important;
visibility: visible !important;
opacity: 1 !important;
}
/* 4. Allow Scrolling
Minerva locks the scrollbar when search is open.
We explicitly re-enable scrolling. */
html.mw-mf-search-mode,
body.mw-mf-search-mode {
overflow: auto !important;
position: relative !important;
}
/* 5. Hide the specific masking overlay if present */
.mw-mf-search-mode .main-menu-mask,
.mw-mf-search-mode .overlay {
display: none !important;
}
|