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
 
(6 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:Scroll box */
table.responsive > tbody > tr {
.scroll-box {
display: block;
}
table.responsive > tbody > tr > td {
display: block;
text-align: right;
font-size: 100% !important;
}
table.responsive > tbody > tr > td ul,
table.responsive > tbody > tr > td ol {
clear: left;
text-align: left;
}
table.responsive > tbody > tr > td::before {
float: left;
font-weight: bold;
content: attr(data-label);
margin-right: 0.75em;
}
table.responsive > tbody > tr:not(:last-child) {
margin-bottom: 0.5em;
}
table.responsive.jquery-tablesorter > thead,
table.responsive:not(.jquery-tablesorter) > tbody > tr:first-child {
display: none;
}
 
/* Responsive tables (columns only) */
table.responsive-col > tbody > tr > td {
display: block !important;
width: auto !important;
width: auto !important;
min-width: 0 !important;
max-width: none !important;
}
}


Line 42: Line 11:
.columns {
.columns {
column-count: auto !important;
column-count: auto !important;
}
/* Userboxes */
#userboxes {
float: none !important;
max-width: none !important;
margin: 15px 0 15.75px !important;
}
.userbox {
float: none !important;
width: 99% !important;
}
}
}
}
Line 48: Line 28:
@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 17:42, December 21, 2024

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

/* Mobile phone */
@media all and (max-width: 719px) {
	/* Template:Scroll box */
	.scroll-box {
		width: auto !important;
	}

	/* Template:Columns */
	.columns {
		column-count: auto !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;
	}
}