User:Archimedes5000/vector.css

Note: After publishing, you may have to bypass your browser's cache to see the changes.

• Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
• Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
• Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
• Opera: Press Ctrl-F5.

/*Mobile styles*/
@media (max-width:700px) {
   /*break page names*/
   h1 {
      word-wrap:break-word;
   }
   /*remove spacing from head and navigation*/
   #mw-head-base {
      margin-left:0;
   }
   #left-navigation {
      margin:43px 0 0 0;
   }
   #right-navigation {
      margin:43px 0 0 0;
   }
   .vector-menu-content-list {
      padding-left:0 !important;
   }
   /*remove spacing from body*/
   #content.mw-body {
      margin:0 !important;
   }
   /*remove spacing from footer*/
   #footer {
      padding: 0 12px 0 12px;/*optional*/
      margin-left:0;
   }
   /*remove menu panel*/
   #mw-panel {
      display:none;
   }
   /*mirror the dropdown to prevent it from overflowing the viewport when it's the first element from the right*/
   #p-cactions>div.vector-menu-content {
      right:-1px;
      left:-27.5833px;
   }
   /*flexbox to contain the following monstrosity*/
   #p-personal>div.vector-menu-content {
      display:flex;
   }
   /*flex styles for search bar moved with js*/
   div.vector-menu-content>#p-search{
      display:inline-block;
      flex-base:calc(100% - 215px);
      flex-shrink:1;
      flex-grow:1.55;
      min-width:144px;
   }
   /*the actual search bar has to fill the container*/
   #simpleSearch {
      width:100%;
      height:auto;
   }
   /*flex styles on the menu list too*/
   ul.vector-menu-content-list {
      flex-base:215px;
      flex-shrink:1.55;
      flex-grow:2;
}
   /*backup styles in case js fails*/
   #p-search {
      display:none;
   }
   /*why do we even have this*/
   #pt-uls {
      display:none;
   }
}