Difference between revisions of "User:James Hare/vector.css"
Jump to navigation
Jump to search
James Hare (talk | contribs) (Rendering most of the interface invisible) |
James Hare (talk | contribs) (Re-arranging code; attempting to center the search box) |
||
Line 13: | Line 13: | ||
margin-top:0.5em; |
margin-top:0.5em; |
||
} |
} |
||
− | |||
− | |||
− | /* Move the panel to the bottom and display it |
+ | /* Move the panel to the bottom and display it as in-line lists; hide the logo and tabs */ |
div#mw-panel { |
div#mw-panel { |
||
display: table; |
display: table; |
||
Line 38: | Line 36: | ||
#p-logo { |
#p-logo { |
||
display: none; |
display: none; |
||
⚫ | |||
⚫ | |||
⚫ | |||
⚫ | |||
⚫ | |||
⚫ | |||
⚫ | |||
⚫ | |||
⚫ | |||
} |
} |
||
Line 58: | Line 65: | ||
#right-navigation { |
#right-navigation { |
||
position:absolute; |
position:absolute; |
||
− | display:inline; |
||
top:inherit; |
top:inherit; |
||
margin-top:-1px; |
margin-top:-1px; |
||
float:none; |
float:none; |
||
⚫ | |||
⚫ | |||
⚫ | |||
⚫ | |||
⚫ | |||
⚫ | |||
⚫ | |||
⚫ | |||
⚫ | |||
} |
} |
||
#p-search { |
#p-search { |
||
width:100%; |
width:100%; |
||
+ | text-align:center; |
||
+ | margin-left:auto; |
||
+ | margin-right:auto; |
||
} |
} |
||
div#content { |
div#content { |
Revision as of 22:59, 11 June 2013
/* For mobile devices */
@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;
display:inline;
}
#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 {
position:absolute;
top:inherit;
margin-top:-1px;
float:none;
}
#p-search {
width:100%;
text-align:center;
margin-left:auto;
margin-right:auto;
}
div#content {
/* Hide the 1px blue border on the left side */
border-left: 0;
margin-left: 0;
}
}