MediaWiki:Common.css: Difference between revisions

force normal document-level scroll so tab bar scrolls with the page instead of overlapping content
cleaned up the mobile header a bit
Line 893: Line 893:
     }
     }
     #content {
     #content {
         margin-top: 20px !important;
         margin-top: 70px !important;
         margin-left: 10px !important;
         margin-left: 10px !important;
         margin-right: 10px !important;
         margin-right: 10px !important;
Line 903: Line 903:
     }
     }
     #mw-head::before {
     #mw-head::before {
        display: none !important;
    }
    /* The stock "Not logged in / Talk / Contributions / Log in" toolbar has
      nowhere sensible to sit once the header collapses on mobile, so hide
      it rather than let it float over the page. */
    #p-personal {
         display: none !important;
         display: none !important;
     }
     }
Line 936: Line 942:
     .vector-menu-tabs .vector-menu-content-list > li {
     .vector-menu-tabs .vector-menu-content-list > li {
         margin-bottom: 2px !important;
         margin-bottom: 2px !important;
    }
    /* Solid strip behind the hamburger button and search box, since there's
      no single wrapper element to put a real background on. */
    body::before {
        content: "";
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        height: 58px;
        background: #3d2b1f;
        border-bottom: 2px solid #b3a07d;
        z-index: 550;
     }
     }


Line 954: Line 974:
         box-shadow: 0 2px 6px rgba(0, 0, 0, 0.4);
         box-shadow: 0 2px 6px rgba(0, 0, 0, 0.4);
     }
     }
    /* Pull the existing search box out of the collapsed header and pin it
      into the fixed top bar next to the hamburger button, so search is
      always one tap away instead of buried in the drawer menu. */
    #p-search {
        display: block !important;
        position: fixed !important;
        top: 10px !important;
        left: 120px !important;
        right: 10px !important;
        margin: 0 !important;
        z-index: 600 !important;
    }
    #p-search h3 {
        display: none !important;
    }
    #p-search #simpleSearch,
    #p-search .vector-search-box-inner {
        width: 100% !important;
    }
    #p-search input {
        width: 100% !important;
        height: 38px !important;
        box-sizing: border-box !important;
        border-radius: 4px !important;
        border: 2px solid #b3a07d !important;
        background-color: #efeee6 !important;
        padding: 0 10px !important;
        font-size: 16px !important; /* keeps iOS Safari from zooming in on focus */
    }
     #mobile-nav-backdrop {
     #mobile-nav-backdrop {
         display: none;
         display: none;