Difference between revisions of "MediaWiki:Vector.css"
Jump to navigation
Jump to search
James Hare (talk | contribs) (Adjustments to Vector for mobile devices) |
James Hare (talk | contribs) (Trying something) |
||
Line 1: | Line 1: | ||
/* CSS placed here will affect users of the Vector skin */ |
/* CSS placed here will affect users of the Vector skin */ |
||
− | |||
− | /* For mobile devices */ |
||
− | /* These changes have been tested exclusively in Vector */ |
||
− | |||
− | @media only screen and (max-width:749px) { |
||
− | |||
− | /* |
||
− | The styles below essentially place the navigation menu below the content, |
||
− | instead of to the side of it. They also hide the logo, as there's no space |
||
− | left for it. |
||
− | */ |
||
− | |||
− | #mw-head { |
||
− | position:static !important; |
||
− | margin-top:0.5em; |
||
− | } |
||
− | |||
− | /* Move the panel to the bottom and display it as in-line lists; hide the logo and tabs */ |
||
− | div#mw-panel { |
||
− | display: table; |
||
− | position: static; |
||
− | table-layout: fixed; |
||
− | width: 100%; |
||
− | overflow: hidden; |
||
− | } |
||
− | div#mw-panel .portal { |
||
− | display: block; |
||
− | width:100%; |
||
− | vertical-align: top; |
||
− | } |
||
− | #mw-panel ul li { |
||
− | list-style:none; |
||
− | } |
||
− | #mw-panel ul li:before { |
||
− | content: " ◦ "; |
||
− | } |
||
− | #p-logo { |
||
− | display: none; |
||
− | } |
||
− | #left-navigation { |
||
− | display:none; |
||
− | } |
||
− | #p-cactions { |
||
− | display:none; |
||
− | } |
||
− | #p-views { |
||
− | display:none; |
||
− | } |
||
− | |||
− | /* Rearrange various page elements to fill the now-available space */ |
||
− | #p-personal ul { |
||
− | padding-left: 0; |
||
− | } |
||
− | div#footer { |
||
− | margin-left: 0; |
||
− | padding-top: 0; |
||
− | } |
||
− | #p-personal { |
||
− | display:table; |
||
− | position:relative; |
||
− | width:100%; |
||
− | top:inherit; |
||
− | left:inherit; |
||
− | right:inherit; |
||
− | } |
||
− | #right-navigation { |
||
− | max-width:500px; |
||
− | position:absolute; |
||
− | top:inherit; |
||
− | margin-top:-1px; |
||
− | float:none; |
||
− | } |
||
− | #right-navigation:before { |
||
− | content:url("http://wikimediadc.org/w/images/6/60/Mobile_logo.svg"); |
||
− | } |
||
− | #p-search { |
||
− | margin-left: 73px; |
||
− | margin-top: -1.5em; |
||
− | } |
||
− | div#content { |
||
− | /* Hide the 1px blue border on the left side */ |
||
− | border-left: 0; |
||
− | margin-left: 0; |
||
− | } |
||
− | } |
Revision as of 20:52, 5 July 2013
/* CSS placed here will affect users of the Vector skin */