MediaWiki:Gadget-ResponsiveStyle.css: Difference between revisions

From the Super Mario Wiki, the Mario encyclopedia
Jump to navigationJump to search
No edit summary
mNo edit summary
 
(21 intermediate revisions by the same user not shown)
Line 3: Line 3:
/* Mobile phone */
/* Mobile phone */
@media all and (max-width: 719px) {
@media all and (max-width: 719px) {
/* Responsive tables */
/* Template:Columns */
table.responsive > tbody > tr {
.columns {
display: block;
column-count: auto !important;
}
}
table.responsive > tbody > tr:not(:last-child) {
 
margin-bottom: 0.5em;
/* Template:Scroll box */
:not(td) > .scrollbox {
width: auto !important;
}
}
table.responsive > tbody > tr > td {
 
display: block;
/* Template:Foreign names */
text-align: right;
#foreign-names span[style*="nowrap"] {
white-space: normal !important;
}
}
table.responsive > tbody > tr > td::before {
 
float: left;
/* Userboxes */
font-weight: bold;
#userboxes {
content: attr(data-label);
float: none !important;
margin-right: 0.75em;
max-width: none !important;
margin: 15px 0 15.75px !important;
}
}
table.responsive.jquery-tablesorter > thead,
.userbox {
table.responsive:not(.jquery-tablesorter) > tbody > tr:first-child {
float: none !important;
display: none;
width: 99% !important;
}
}
}
}
Line 29: Line 33:
@media all and (min-width: 720px) {
@media all and (min-width: 720px) {
/* Notice templates */
/* Notice templates */
.notice-template.image {
.notice-template.file {
text-align: center;
text-align: center;
}
}
}
}

Latest revision as of 13:10, March 15, 2025

/* Responsive CSS applied to both desktop and mobile */

/* Mobile phone */
@media all and (max-width: 719px) {
	/* Template:Columns */
	.columns {
		column-count: auto !important;
	}

	/* Template:Scroll box */
	:not(td) > .scrollbox {
		width: auto !important;
	}

	/* Template:Foreign names */
	#foreign-names span[style*="nowrap"] {
		white-space: normal !important;
	}

	/* Userboxes */
	#userboxes {
		float: none !important;
		max-width: none !important;
		margin: 15px 0 15.75px !important;
	}
	.userbox {
		float: none !important;
		width: 99% !important;
	}
}

/* Desktop/tablet */
@media all and (min-width: 720px) {
	/* Notice templates */
	.notice-template.file {
		text-align: center;
	}
}