MediaWiki:Mobile.css: Difference between revisions

From Bose Portable PA Knowledge
Jump to navigation Jump to search
← Older editNewer edit →
ST (talk | contribs)
Bureaucrats, Interface administrators, Administrators
20,075 edits
mNo edit summary
m cleaned out menu for mobile 'hacks'
Line 1: Line 1:
h2, h3, h4 {color:red;background-color:blue}
/* Cleaned MediaWiki:Mobile.css
  Minimal mobile-specific styles only
*/


body {
/* Base page adjustments for mobile */
  background-color: lightgrey;
  color: blue;
}
 
h1 {
  background-color: black;
  color: white;
}
@media (max-width: 800px) {
@media (max-width: 800px) {
  /* Hide desktop sidebars on narrow viewports */
   #mw-panel, .mw-sidebar, .vectorSidebar {
   #mw-panel, .mw-sidebar, .vectorSidebar {
     display: none !important;
     display: none !important;
   }
   }
  /* Ensure content uses full width on mobile */
   #content, #mw-content-text {
   #content, #mw-content-text {
     margin-left: 0 !important;
     margin-left: 0 !important;
Line 19: Line 16:
   }
   }
}
}
/* Tame the Minerva logo/title and make the clickable area comfortable */
/* Tame the Minerva logo/title and make the clickable area comfortable */
@media (max-width: 800px) {
@media (max-width: 800px) {
Line 44: Line 42:
}
}


/* Mobile custom hamburger + overlay (max-width 800px) */
/* Small accessibility and touch targets */
@media (max-width: 800px) {
@media (max-width: 800px) {
   .custom-mobile-hamburger {
   .minerva-header a, .minerva-header .minerva-logo-link {
     position: absolute;
     -webkit-tap-highlight-color: rgba(0,0,0,0.08);
    left: 0.5rem;
     touch-action: manipulation;
    top: 0.5rem;
    z-index: 9998;
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: none;
    color: #fff;
    font-size: 22px;
     text-decoration: none;
   }
   }
}


  .custom-mobile-overlay {
/* Light visual reset to avoid heavy defaults bleeding into mobile */
    position: fixed;
@media (max-width: 800px) {
    inset: 0;
   /* Keep headings readable without forcing color schemes */
    background: rgba(0,0,0,0.45);
   .minerva-header h1, .minerva-header h2 {
    z-index: 9997;
     margin: 0;
    display: none;
     font-weight: 600;
    align-items: flex-start;
    justify-content: flex-start;
    padding-top: 56px;
  }
 
  .custom-mobile-panel {
    background: #fff;
    width: 84%;
    max-width: 320px;
    height: 100%;
    box-shadow: 0 2px 12px rgba(0,0,0,0.25);
    padding: 0.5rem 0;
    overflow-y: auto;
   }
 
  .custom-mobile-panel a {
    display: block;
    padding: 0.75rem 1rem;
    color: #0645AD;
    text-decoration: none;
    border-bottom: 1px solid #eee;
  }
 
   .custom-mobile-panel a:hover {
    background: #f6f8fb;
  }
 
  .custom-mobile-close {
     display: block;
    padding: 0.5rem;
    text-align: right;
     font-size: 18px;
    color: #333;
   }
   }
}
}

Revision as of 23:02, 31 March 2026

/* Cleaned MediaWiki:Mobile.css
   Minimal mobile-specific styles only
*/

/* Base page adjustments for mobile */
@media (max-width: 800px) {
  /* Hide desktop sidebars on narrow viewports */
  #mw-panel, .mw-sidebar, .vectorSidebar {
    display: none !important;
  }

  /* Ensure content uses full width on mobile */
  #content, #mw-content-text {
    margin-left: 0 !important;
    padding-left: 1rem !important;
  }
}

/* Tame the Minerva logo/title and make the clickable area comfortable */
@media (max-width: 800px) {
  .minerva-logo, .minerva-logo-link img, .mw-logo {
    max-height: 36px !important;
    width: auto !important;
    display: inline-block !important;
    vertical-align: middle !important;
  }

  .minerva-header .site-title, .minerva-header .minerva-title {
    font-size: 1rem !important;
    line-height: 1.2 !important;
    padding: 0.15rem 0.35rem !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
  }

  .minerva-logo-link {
    display: inline-block;
    padding: 4px 6px;
    text-decoration: none;
  }
}

/* Small accessibility and touch targets */
@media (max-width: 800px) {
  .minerva-header a, .minerva-header .minerva-logo-link {
    -webkit-tap-highlight-color: rgba(0,0,0,0.08);
    touch-action: manipulation;
  }
}

/* Light visual reset to avoid heavy defaults bleeding into mobile */
@media (max-width: 800px) {
  /* Keep headings readable without forcing color schemes */
  .minerva-header h1, .minerva-header h2 {
    margin: 0;
    font-weight: 600;
  }
}
Retrieved from "https://boseperformer.com/index.php?title=MediaWiki:Mobile.css&oldid=25819"