MediaWiki:Gadget-ResponsiveDesktop.css
From Fanonpedia
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.
/* Some fixes for responsive desktop skins */
body {
background: #f9f9f9 url(https://static.miraheze.org/fanpediawiki/3/39/Fanonpediabg.png) repeat;
}
/* Text indicators */
@media all and (max-width: 850px) {
#mw-indicator-shortcut {
display: none;
}
}
/* Standard changes */
@media all and (max-width: 550px) {
.mw-body-content {
overflow: visible !important;
}
.infobox {
margin: 1em 0 !important;
}
.infobox, .nav-right,
#mw-content-text table {
float: none !important;
width: auto !important;
overflow: auto !important;
display: block !important;
margin-left: 0 !important;
margin-right: 0 !important;
max-width: 100% !important;
min-width: 0 !important;
}
#mw-content-text table > tbody {
width: 100% !important;
display: table !important;
}
body div.thumb {
float: none !important;
width: auto !important;
max-width: none !important;
margin: 1em 0;
}
div.thumb, div.thumbinner {
overflow: auto !important;
}
div.noresize > map ~ img {
max-width: none !important;
}
div.thumbinner > div {
float: none !important;
margin-left: auto !important;
margin-right: auto !important;
}
div.thumbcaption {
margin-top: 3px !important;
}
div.thumbimage {
max-width: max-content;
}
ul.gallery {
text-align: center;
}
div.gallerytext {
text-align: left;
}
center div.gallerytext,
.gallery.center div.gallerytext,
.gallery[style*="center"] div.gallerytext {
text-align: center;
}
caption {
display: block;
}
a.feedlink {
padding-left: 16px;
}
body.skin-monobook .mobileonly {
display: revert;
}
.skin--responsive #sidebar .portlet[role="navigation"] {
display: none !important;
}
.mw-changeslist-legend {
width:98%;
}
}
@media all and (max-width: 850px) {
body.skin-timeless .mobileonly {
display: revert;
}
}
@media screen and (min-width: 551px) {
body.skin--responsive li#ca-talk {
margin-right: .5em;
}
}
/* main page responsive fixes */
@media all and (max-width:850px) {
body.page-Main_Page #welcome > tbody > tr > td {
display: block !important;
}
body.page-Main_Page #mp-body > tbody > tr > td {
display: block !important;
width: 100% !important;
}
body.page-Main_Page #mp-body > tbody > tr > td + td {
margin-top: 5px !important;
}
#mp-body input.mw-ui-input {
width: 95% !important;
}
body.page-Main_Page #mw-content-text {
overflow: clip !important;
}
.mainpagebox#welcome {
padding: 2px 1px 1px 0 !important;
}
#welcome > tbody > tr > td {
display:block !important;
}
#welcome > tbody > tr > td:last-of-type {
padding-right: 0 !important;
padding-bottom: 0 !important;
}
#mw-content-text #mp-body {
max-width: none !important;
margin-left: -9px !important;
margin-right: -7px !important;
}
#mp-body > tbody > tr > td {
display:block !important;
width:100% !important;
}
#mp-body > tbody > tr > td + td {
margin-top:5px !important;
}
}
/* notice template fix */
@media all and (max-width: 550px) {
.notice-template .image {
float: left;
display: flex;
align-items: center;
}
}
/* Custom changes */
@media all and (max-width: 550px) {
/* Tabber boxes */
.tabber {
display: block;
float: none !important;
width: 100% !important;
margin-left: 0 !important;
margin-right: 0 !important;
}
.tabber.goleft, .tabber.goright {
margin-bottom: 1em !important;
}
.tabber.goleft .tabbertab,
.tabber.goright .tabbertab {
text-align: center !important;
}
.tabber.info {
margin: 0 0 1em !important;
}
}
