MediaWiki:Gadget-MainPageStyle.css

From Pikipedia, the Pikmin wiki
Jump to navigation Jump to search

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.
/* CSS styling and responsive support for the main page */

/* Site styles */
#mp-title-nav { background-color: #b9d6ec; }
#mp-title-fa { background-color: #ecebbf; }
#mp-title-image { background-color: #c0eae4; }
#mp-title-community { background-color: #dbd0f6; }
#mp-title-news { background-color: #f0d2e2; }
#mp-title-poll { background-color: #b9b9b9; }
#mp-title-dyk { background-color: #f8f8f8; }
#mp-title-niwa { background-color: #e6b5b5; }
body:not(.skin-monobook) .main-page-nav-item {
	display: inline-grid;
	background-color: #d8f0db;
	border: 2px solid #66b283;
	border-radius: 20px;
	margin-bottom: 5px;
	padding: 8px;
}
.pds-answer-feedback-bar {
	background: #66b283 !important;
}
.main-page-left-col {
	width: 65%;
	vertical-align: top;
}
.main-page-right-col {
	padding-left: 8px;
	vertical-align: top;
}

/* Responsive fixes */
.mp-welcome > p {
	margin: 0 !important;
}
.mp-welcome-container {
	border-spacing: 0 !important;
}
#niwa-intro img {
	max-width: none !important;
}
@media all and (max-width: 1029px) {
	.niwa-series {
		display: none !important;
	}
	#niwa-list {
		column-count: 2 !important;
		column-width: auto !important;
	}
}
@media all and (max-width: 719px) {
	.main-page-left-col, .main-page-right-col {
		display: block !important;
		width: auto !important;
		padding: 0 !important;
	}
	.mp-welcome {
		font-size: 110% !important;
		padding-bottom: 0 !important;
	}
	.mp-flower-mobile {
		margin: 10px 0 12px !important;
	}
	.mp-flower-desktop, #niwa-intro {
		display: none !important;
	}
	#niwa-table {
		font-size: 95% !important;
	}
}
@media all and (min-width: 720px) {
	.mp-flower-mobile {
		display: none !important;
	}
	.main-page-right-col > .titledBox:first-of-type {
		margin-top: 0 !important;
	}
}