MediaWiki:Timeless.css

From Pizza Tower Wiki
Revision as of 19:24, 9 November 2023 by SuperKirbylover (talk | contribs) (Created page with "→‎All CSS here will be loaded for users of the Timeless skin: body { background-attachment: fixed; background-image: var(--bgImg); background-position: 200px 170px; } hr { } #menus-cover { background-color: var(--tableBg); } →‎HEADER: #mw-header-hack, #mw-header-nav-hack { display: none; } #simpleSearch { background-color: var(--searchInputBg); box-shadow: none ; border: 1px solid black; } #searchButton, #mw-searchButton { right: -1px; background-color:...")
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)

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.
/* All CSS here will be loaded for users of the Timeless skin */
body {
	background-attachment: fixed;
	background-image: var(--bgImg);
	background-position: 200px 170px;
}
hr {
	
}
#menus-cover {
	background-color: var(--tableBg);
}
/* HEADER */
#mw-header-hack, #mw-header-nav-hack {
	display: none;
}
#simpleSearch {
	background-color: var(--searchInputBg);
	box-shadow: none ;
	border: 1px solid black;
}
#searchButton, #mw-searchButton {
	right: -1px;
	background-color: var(--searchBtnBg);
	border: 1px solid black;
	height: calc(100% + 2px);
	margin-top: -1px;
}
#searchButton:hover, #mw-searchButton:hover {
	background-color: var(--searchBtnHoverBg);
}
#p-banner {
	margin-top: 0.4rem;
}
/* ALERT / WATCH ICONS */
#personal-extra li>a, #personal>h2:before {
	background-image: url(https://static.miraheze.org/pizzatowerwiki/c/c3/PT-WikiImage-UserIcons.png?20230922190041);
	background-size: auto 20px;
}
#pt-notifications-alert>a {
	background-position: -20px 0;
}
#pt-notifications-notice>a {
	background-position: -40px 0;
}
#personal>h2 {
	background-image: none;
	padding-top: 0.3em;
}
#personal>h2:before {
	content: "";
	display: inline-block;
	margin: 0 0.3em 0 0;
	width: 20px;
	height: 20px;
}
/* CONTENT CONTAINER */
#mw-content-container {
	background: transparent;
	border: none;
	box-shadow: none;
	padding-bottom: 0;
}
/* MAIN CONTENT */
.mw-dismissable-notice {
	background: transparent;
	border: none;
}
#mw-content {
	background-color: transparent;
	border: none;
	padding: 0;
}
#bodyContentOuter {
	background-color: var(--contentBg);
	background-clip: padding-box;
	border: 5px solid transparent;
	border-image: var(--bodyImg) 5 / 5px round round;
	margin-top: 3rem;
	position: relative;
}
#bodyContent {
	padding: 2rem;
}
.mw-body h1, .mw-body h2, .sidebar-inner h3, #personal-inner h3 {
	border-color: transparent !important; /* keep important on this */
	border-image: url(https://static.miraheze.org/pizzatowerwiki/9/93/PTWiki-underlineborder.png?20231109185803) 0 0 2 0 / 0 0 2px 0 round round;
}
/* TABS (i may be cracked - skl) */
#mw-page-header-links {
	position: absolute;
	top: -3em;
}
#mw-page-header-links .mw-list-item {
	background-color: var(--inactiveTabBg);
	background-clip: padding-box;
	border: 5px solid transparent;
	border-image: var(--inactiveTabImg1) 5 / 5px round round;
	margin: 0 0.5em 0 0;
	padding: 0.5em;
}
#mw-page-header-links .mw-list-item:not(.selected) a, #p-logo-text>a, #p-logo-text>a:hover, .sidebar-inner a, .sidebar-inner a:hover, #personal-inner a, #personal-inner a:hover, .mw-footer-container a, .mw-footer-container a:visited, .mw-footer-container a:hover {
	color: var(--sidebarColor);
}
#mw-page-header-links .mw-list-item:not(.selected):hover {
	background-color: var(--inactiveTabHoverBg);
	border-image: var(--inactiveTabImg2) 5 / 5px round round;
}
#mw-page-header-links .mw-list-item.selected {
	background-color: var(--contentBg);
	border-image: var(--activeTabImg) 5 / 5px round round;
}
.mw-watchlink>a {
	background-image: url(https://static.miraheze.org/pizzatowerwiki/2/2b/PT-WikiImage-WatchStars.png?20230922185403) !important;
	background-size: auto 16px;
	width: 16px !important;
	height: 16px;
	margin-bottom: -0.2em !important;
}
#ca-unwatch>a {
	background-position: -16px 0;
}
.mw-watchlink>a:hover {
	background-position: -32px 0 !important;
}

/* SIDEBARS & TOP BAR */
#mw-header-container, .sidebar-chunk, .mw-footer-container, #personal-inner {
	border: 5px solid transparent !important;
	background-color: var(--sidebarBg) !important;
	background-clip: padding-box !important;
	color: var(--sidebarText);
	padding: 1em 1em 0 !important;
}
#mw-header-container {
	border: none !important;
	border-bottom: 5px solid transparent !important;
	border-image: var(--sidebarImg2) 5 / 0 0 5px 0 round round !important;
	padding: 0.5em 1em 2.5em !important;
}
#site-navigation, #personal-inner {
	border-image: var(--sidebarImg1) 5 / 5px round round !important;
}
#site-tools {
	border-image: var(--sidebarImg2) 5 / 5px round round !important;
}
#page-tools {
	border-image: var(--sidebarImg3) 5 / 5px round round !important;
}
#personal-inner {
	margin-bottom: 1em !important;
}
#personal-inner:before, #personal-inner:after {
	display: none;
}
@media screen and (min-width: 1340px) {
	#mw-related-navigation {
		flex: 0 0 13em;
		width: 13em;
	}
}
.sidebar-inner h3, #personal-inner h3 {
	font-weight: bold !important;
	padding-bottom: 0.3em !important;
	margin-bottom: 0.3em !important;
}

/* FOOTER */
.mw-footer-container {
	box-shadow: none;
	border-top: none !important; /* keep this important */
	border-image: var(--sidebarImg2) 5 / 0 5px 5px 5px round round;
	margin-bottom: 1rem;
}
/* SCREEN SIZING SHIT */
@media screen and (min-width: 851px) {
	#personal-inner {
		top: 2.7em !important;
	}
}
@media screen and (min-width: 851px) and (max-width: 1099px) {
	.sidebar-chunk {
		padding: 0 1em !important;
	}
	.sidebar-chunk>h2 {
		margin: 0 !important; /*keep this important*/
		padding: 0.5em 0 0.2em !important; /*this too*/
	}
	.sidebar-chunk.dropdown-active>h2>span:before, .sidebar-chunk.dropdown-active>h2>span:after, #page-tools.dropdown-active>.sidebar-inner:before, #page-tools.dropdown-active>.sidebar-inner:after {
		display: none !important; /*keep this important*/
	}
	.sidebar-inner {
		background-color: inherit;
		background-clip: inherit;
		border: inherit;
		border-image: inherit;
		box-shadow: none;
		padding: 1em 1em 0;
	}
	.mw-portlet-body {
		margin-bottom: 1em !important;
	}
}
@media screen and (max-width: 850px) {
	.sidebar-inner {
		background-color: inherit;
		background-clip: inherit;
		border: inherit;
		border-image: inherit;
		box-shadow: none;
		padding: 1em 1em 0;
	}
}
@media screen and (min-width: 851px) {
	#mw-content-block {
		margin-top: 4rem;
	}
	.mw-portlet-body {
		margin-bottom: 1em !important;
	}
	.ts-inner {
		max-width: 90vw;
	}
	.tools-inline li:not(.mw-watchlink) a {
		background-image: none !important; /* keep this important */
		padding: 0 !important; /* same here */
	}
}
@media screen and (max-width: 850px) {
	#mw-header-container {
		padding: 0.6em 1em 3.5em 1em !important;
	}
	#p-search {
		position: relative;
		top: 2.8em;
	}
	#personal-extra li {
		margin-right: 0.5em;
	}
	#mw-content-block {
		background-color: transparent;
	}
	#bodyContent {
		padding: 1rem;
	}
}