MediaWiki:Common.css: Difference between revisions

From OMORI Wiki
Jump to navigation Jump to search
(restore admin colors on user button)
No edit summary
 
(8 intermediate revisions by the same user not shown)
Line 221: Line 221:
/* footer */
/* footer */
footer#footer.mw-footer {
footer#footer.mw-footer {
display: inline-block;
padding-bottom: 1em;
margin-left: 10em;
margin-left: 10em;
border-left: 1px solid #7F7F7F !important;
border-left: 1px solid #7F7F7F !important;
}
}
/* slightly smaller page heading */
/* #firstHeading {
font-size: 1.7em !important;
} */


#content {
#content {
Line 276: Line 273:


#left-navigation {
#left-navigation {
margin-left: 10em !important;
margin-left: 10.5em !important;
}
}


Line 291: Line 288:
/* TABS */
/* TABS */
/* make tabs use relative so center section works */
/* make tabs use relative so center section works */
nav.vectorTabs ul li {
nav.vector-menu-tabs ul li {
position: relative;
position: relative;
}
}


/* get rid of default tab separators */
/* get rid of default tab separators */
nav.vectorTabs, nav.vectorTabs ul, nav.vectorMenu h5 a {
nav.vector-menu-tabs, nav.vector-menu-tabs ul, nav.vectorMenu h5 a {
background: none !important;
background: none !important;
}
}


/* position text correctly */
/* position text correctly */
nav.vectorTabs ul li, nav.vectorTabs ul li * {
nav.vector-menu-tabs ul li, nav.vector-menu-tabs ul li * {
margin: 0px !important;
margin: 0px !important;
padding: 0px !important;
padding: 0px !important;
Line 313: Line 310:
}
}


nav.vectorTabs ul li * {
nav.vector-menu-tabs ul li * {
font-size: 22px !important;
font-size: 22px !important;
}
}
Line 319: Line 316:
/* UNSELECTED TAB */
/* UNSELECTED TAB */
/* tab positioning and left */
/* tab positioning and left */
nav.vectorTabs ul li {
nav.vector-menu-tabs ul li {
padding-left: 10px !important;
padding-left: 10px !important;
height: 24px !important;
height: 24px !important;
Line 330: Line 327:


/* center */
/* center */
nav.vectorTabs ul li:before {
nav.vector-menu-tabs ul li:before {
content: "";
content: "";
width: calc(100% - 12px);
width: calc(100% - 12px);
Line 341: Line 338:


/* tab positioning and right */
/* tab positioning and right */
nav.vectorTabs ul li a {
nav.vector-menu-tabs ul li a {
padding-right: 10px !important;
padding-right: 10px !important;
padding-left: 10px !important;
padding-left: 10px !important;
Line 357: Line 354:
/* UNCREATED TAB */
/* UNCREATED TAB */
/* left */
/* left */
nav.vectorTabs ul li.new {
nav.vector-menu-tabs ul li.new {
background-size: 20px 24px !important;
background-size: 20px 24px !important;
}
}


/* center */
/* center */
nav.vectorTabs ul li.new:before {
nav.vector-menu-tabs ul li.new:before {
content: "";
content: "";
width: calc(100% - 14px);
width: calc(100% - 14px);
Line 373: Line 370:


/* right */
/* right */
nav.vectorTabs ul li.new a {
nav.vector-menu-tabs ul li.new a {
background-size: 20px 24px !important;
background-size: 20px 24px !important;
}
}
Line 379: Line 376:
/* SELECTED TAB */
/* SELECTED TAB */
/* left */
/* left */
nav.vectorTabs ul li.selected {
nav.vector-menu-tabs ul li.selected {
background-size: 20px 25px !important;
background-size: 20px 25px !important;
background-position: bottom left !important;
background-position: bottom left !important;
Line 387: Line 384:


/* center */
/* center */
nav.vectorTabs ul li.selected:before {
nav.vector-menu-tabs ul li.selected:before {
content: "";
content: "";
width: calc(100% - 14px);
width: calc(100% - 14px);
Line 398: Line 395:


/* right */
/* right */
nav.vectorTabs ul li.selected a {
nav.vector-menu-tabs ul li.selected a {
background-size: 20px 25px !important;
background-size: 20px 25px !important;
background-position: bottom right !important;
background-position: bottom right !important;
Line 406: Line 403:


/* disable text coloring for selected tabs */
/* disable text coloring for selected tabs */
nav.vectorTabs ul li.selected * {
nav.vector-menu-tabs ul li.selected * {
cursor: default !important;
cursor: default !important;
}
}


/* MORE TAB */
/* MORE TAB */
/* more tab bg and fixing + left */
/* tab positioning and left */
nav.vectorMenu {
#p-cactions {
top: 16px !important;
height: 24px !important;
transition: none !important;
margin-top: 16px !important;
margin-right: 4px !important;
margin-right: 4px !important;
height: 24px;
background-size: 20px 24px !important;
background-size: 20px 24px !important;
background-repeat: no-repeat;
background-position: bottom left !important;
background-repeat: no-repeat !important;
}
}


/* center */
/* center */
h3#p-cactions-label::before {
#p-cactions:before {
content: "";
content: "";
width: calc(100% - 14px);
width: calc(100% - 12px);
position: absolute;
position: absolute;
top: 0;
top: 0;
Line 432: Line 429:
}
}


/* right - this is really hacky and will break in an update guaranteed */
/* right */
nav#p-cactions.vector-menu.vector-menu-dropdown.vectorMenu::after {
#p-cactions:after {
content: "";
content: "";
width: 100%;
width: calc(100% - 12px);
position: absolute;
position: absolute;
top: 0;
top: 0;
left: 0;
right: 0;
height: 24px;
height: 24px;
background-size: 20px 24px !important;
background-size: 20px 24px !important;
background-repeat: no-repeat;
background-position: bottom right !important;
background-position: top right;
background-repeat: no-repeat !important;
}
}


/* more tab text fixing, get rid of default separator */
/* more tab text fixing, get rid of default separator */
div#mw-head nav.vectorMenu h3 {
#p-cactions-label {
padding: 3px 10px 3px 10px;
padding: 0px 10px;
background-image: none;
background: none !important;
height: 24px;
height: 24px;
position: relative;
font-size: 22px !important;
line-height: 24px !important;
z-index: 1;
}
}


/* replace default more down arrow */
/* replace default more down arrow */
h3#p-cactions-label:after {
#p-cactions-label:after {
z-index: 11;
z-index: 11;
width: 12px !important;
width: 16px !important;
height: 12px !important;
height: 12px !important;
top: 7px !important;
top: 7px !important;
left: 9px !important;
opacity: 1 !important;
opacity: 1 !important;
background-size: 12px 12px;
background-size: 12px 12px;
}
/* margin between tabs and more tab */
/* ul.vector-menu-content-list {
margin-right:4px;
} */
/* more tab font */
nav.vectorMenu h3 span {
padding: 3px 0px 3px 15px;
font-size: 22px !important;
z-index: 10;
position: relative;
position: relative;
}
/* more dropdown menu */
nav.vectorMenu .menu {
top: 1.5em !important;
left: 0px !important;
}
}


/* more dropdown menu bg */
/* more dropdown menu bg */
nav.vectorMenu ul {
#p-cactions ul {
border-left: 1px solid #7F7F7F !important;
background-size: 100% 100%;
border-right: 1px solid #7F7F7F !important;
border-bottom: 1px solid #7F7F7F !important;
margin-left: 0px !important;
background-position: top !important;
background-repeat: repeat-x !important;
}
 
ul.menu.vector-menu-content-list {
min-width: 64px;
}
}


Line 611: Line 584:
.mp-content-table {
.mp-content-table {
width: 100%;
width: 100%;
border-radius: 5px;
}
}


Line 622: Line 596:
margin:-3px;
margin:-3px;
padding:10px;
padding:10px;
border-radius: 4px 4px 0px 0px;
}
}


Line 645: Line 620:
max-width: 200px;
max-width: 200px;
float: right;
float: right;
}
/* hide main page notice for logged in users */
body.vector-feature-sticky-header-enabled .mp-content-notice {
display: none;
}
}


Line 651: Line 631:
margin-bottom: -55px;
margin-bottom: -55px;
visibility: hidden;
visibility: hidden;
}
/* hide discussion page... discussion */
body.page-OMORI_Wiki_Discussion li#ca-talk {
display: none !important;
}
}

Latest revision as of 23:38, 27 August 2025

/* ================== */
/* I. GENERAL STYLING */
/* ================== */
html, body {
	height:100% !important;
}

div#mw-panel {
	min-height: 100% !important;
	border-right: 1px solid #7F7F7F !important;
}

/* fonts */
@font-face {
	font-family: 'OMORI_GAME';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url(/static/OMORI_GAME.woff2) format('woff2');
}

@font-face {
	font-family: 'OMORI_GAME2';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url(/static/OMORI_GAME2.woff2) format('woff2');
}

/* ====================== */
/* II. USER-RELATED STUFF */
/* ====================== */
/* personal link colors */
#p-personal li a {
	color: #ffffff !important;
	text-shadow: 0 0 2px #000000, 0 0 2px #000000, 0 0 2px #000000, 0 0 2px #000000, 0 0 2px #000000;
}

/* staff colors */
.mw-userlink[title="User:Gilbert"],
li#pt-userpage a[href="/User:Gilbert"],
.mw-userlink[title="User:Boba"],
li#pt-userpage a[href="/User:Boba"],
.mw-userlink[title="User:Rph"],
li#pt-userpage a[href="/User:Rph"],
.mw-userlink[title="User:Pyro"],
li#pt-userpage a[href="/User:Pyro"],
a.trusted, .bur, .adm, .mod, .loc, .helpUser {
	color:#FF7AD7 !important;
}

/* bold all userlinks */
.mw-userlink {
	font-weight: bold;
}

/* bold personal user link */
li#pt-userpage {
	font-weight: bold;
}

/* personal tab user icon */
li#pt-userpage a {
	background-image: url(images/5/54/SkinDefault_LoginOMORI.png) !important;
	background-position: left top 3px !important;
	padding-left: 24px !important;
	background-size: 20px !important;
	height: 16px;
	image-rendering: pixelated;
}

/* don't wordwrap top links on main page */
.mp-content-table ul > li a.external.text, .mp-content-table ul > li > b > a
{
	white-space: nowrap;
}

/* ================== */
/* III. AMBOX STYLING */
/* ================== */
th.ambox-text, td.ambox-text {
	border: none;
	padding: 0.25em 0.9em;
	width: 100%;
}

td.ambox-image {
	border: none;
	padding: 2px 0 2px 0.9em;
	text-align: center;
}

td.ambox-image2 {
	border: none;
	padding: 2px 0.9em 2px 0;
	text-align: center;
}

td.ambox-empty-cell {
	border: none;
	padding: 0px;
	width: 1px;
}

table.ambox {
	margin: 0px 10%;
}

table.ambox + table.ambox {
	margin-top: -1px;
}

.ambox th.ambox-text, .ambox td.ambox-text {
	padding: 0.25em 0.5em;
}

.ambox td.ambox-image {
	padding: 2px 0 2px 0.5em;
}

.ambox td.ambox-image2 {
	padding: 2px 0.5em 2px 0;
}

/* fmbox */
div.mw-warning-with-logexcerpt,
div.mw-lag-warn-high,
div.mw-cascadeprotectedwarning,
div.mw-newarticletext,
div#mw-protect-cascadeon,
.fmbox {
	clear: both;
	margin: 0.2em 0;
	background-color: #f9f9f9;
	border: 1px solid #aaa;
	padding: 0.125em 0.25em;
	margin: 3px auto;
	width: auto;
}

div.mw-warning-with-logexcerpt,
div.mw-lag-warn-high,
div.mw-cascadeprotectedwarning,
div.mw-newarticletext,
div#mw-protect-cascadeon {
	padding: 0.5em 1em;
}

th.fmbox-text, td.fmbox-text {
	border: none;
	padding: 0em;
	width: 100%;
}

td.fmbox-image {
	border: none;
	padding: 2px 0 2px 0;
	text-align: center;
}

td.fmbox-image2 {
	border: none;
	padding: 2px 0 2px 0;
	text-align: center;
}

td.fmbox-empty-cell {
	border: none;
	padding: 0px;
	width: 1px;
}

/* ==================== */
/* IV. TEMPLATE STYLING */
/* ==================== */
.generic-infobox-row {
	padding: 5px;
	font-size: 160%;
	line-height: 1;
}

.item-infobox-row-left {
	width: 100px;
	padding: 5px;
	text-align: right;
	font-size: 160%;
	line-height: 1;
}

/* ================ */
/* V. EDIT NOTICES */
/* ================ */
.editnoticemain {
	background-color: #F7FFF5; border: 1px solid #D4F2CE;
}

.editnoticered {
	background-color: #FFDBDB; border: 1px solid #BB7070;
}

.editnoticeblue {
	background-color: #E6F2FF; border: 1px solid #B8C7D9;
}

/* =========== */
/* VI. SKINNING */
/* =========== */
.mw-wiki-logo {
	background-size: 135px 135px;
}

#p-logo
{
	border-right: 1px solid #7F7F7F !important;
}

#mw-page-base {
	width: 100%;
}

/* footer */
footer#footer.mw-footer {
	display: inline-block;
	padding-bottom: 1em;
	margin-left: 10em;
	border-left: 1px solid #7F7F7F !important;
}

#content {
	border-left: 1px solid #7F7F7F !important;
	border-top: 1px solid #7F7F7F !important;
	border-bottom: 1px solid #7F7F7F !important;
}

body {
	overflow-x: hidden;
}

/* fix for top section of sidebar */
div.body.vector-menu-content {
	margin-left: 0.5em !important;
}

/* make font generally smaller */
/* #bodyContent, .mw-body-content {
	font-size: 0.8em;
} */

/* force bullet lists to not use img */
ul {
	list-style-image: none !important;
}

/* fix for 982px screen discrimination code */
@media screen and (min-width:982px) {
	div#content {
		margin-left: 10em !important;
		padding: 1em 1em 1em 1em !important;
	}

	#mw-panel {
		padding-left: 0em !important;
	}

	#p-search {
		margin-right: 0.5em !important;
	}

	#p-personal {
		right: 0.75em !important;
	}
}

#left-navigation {
	margin-left: 10.5em !important;
}

/* keeping for now, account for additions to shared.css */
table.wikitable {
	border-collapse: separate;
}

/* keeping for now, for site notice */
#siteNotice div, #siteNotice p { 
	margin: -0.5em 0em 1.5em 0em
}

/* TABS */
/* make tabs use relative so center section works */
nav.vector-menu-tabs ul li {
	position: relative;
}

/* get rid of default tab separators */
nav.vector-menu-tabs, nav.vector-menu-tabs ul, nav.vectorMenu h5 a {
	background: none !important;
}

/* position text correctly */
nav.vector-menu-tabs ul li, nav.vector-menu-tabs ul li * {
	margin: 0px !important;
	padding: 0px !important;
	background: none !important;
}

/* sidebar separator */
h3#p-tb-label {
	background-position: left bottom;
	background-size: 122px 1px;
}

nav.vector-menu-tabs ul li * {
	font-size: 22px !important;
}

/* UNSELECTED TAB */
/* tab positioning and left */
nav.vector-menu-tabs ul li {
	padding-left: 10px !important;
	height: 24px !important;
	margin-top: 16px !important;
	margin-right: 4px !important;
	background-size: 20px 24px !important;
	background-position: bottom left !important;
	background-repeat: no-repeat !important;
}

/* center */
nav.vector-menu-tabs ul li:before {
	content: "";
	width: calc(100% - 12px);
	position: absolute;
	top: 0;
	left: 8px;
	height: 24px;
	background-size: 10px 24px !important;
}

/* tab positioning and right */
nav.vector-menu-tabs ul li a {
	padding-right: 10px !important;
	padding-left: 10px !important;
	margin-left: -10px !important;
	padding-bottom: 0px !important;
	line-height: 24px !important;
	height: 24px !important;
	display: block !important;
	position: relative !important;
	background-size: 20px 24px !important;
	background-position: bottom right !important;
	background-repeat: no-repeat !important;
}

/* UNCREATED TAB */
/* left */
nav.vector-menu-tabs ul li.new {
	background-size: 20px 24px !important;
}

/* center */
nav.vector-menu-tabs ul li.new:before {
	content: "";
	width: calc(100% - 14px);
	position: absolute;
	top: 0;
	left: 8px;
	height: 24px;
	background-size: 10px 24px !important;
}

/* right */
nav.vector-menu-tabs ul li.new a {
	background-size: 20px 24px !important;
}

/* SELECTED TAB */
/* left */
nav.vector-menu-tabs ul li.selected {
	background-size: 20px 25px !important;
	background-position: bottom left !important;
	background-repeat: no-repeat !important;
	height: 25px !important;
}

/* center */
nav.vector-menu-tabs ul li.selected:before {
	content: "";
	width: calc(100% - 14px);
	position: absolute;
	top: 0;
	left: 8px;
	height: 25px;
	background-size: 10px 25px !important;
}

/* right */
nav.vector-menu-tabs ul li.selected a {
	background-size: 20px 25px !important;
	background-position: bottom right !important;
	background-repeat: no-repeat !important;
	height: 25px !important;
}

/* disable text coloring for selected tabs */
nav.vector-menu-tabs ul li.selected * {
	cursor: default !important;
}

/* MORE TAB */
/* tab positioning and left */
#p-cactions {
	height: 24px !important;
	margin-top: 16px !important;
	margin-right: 4px !important;
	background-size: 20px 24px !important;
	background-position: bottom left !important;
	background-repeat: no-repeat !important;
}

/* center */
#p-cactions:before {
	content: "";
	width: calc(100% - 12px);
	position: absolute;
	top: 0;
	left: 8px;
	height: 24px;
	background-size: 10px 24px !important;
}

/* right */
#p-cactions:after {
	content: "";
	width: calc(100% - 12px);
	position: absolute;
	top: 0;
	right: 0;
	height: 24px;
	background-size: 20px 24px !important;
	background-position: bottom right !important;
	background-repeat: no-repeat !important;
}

/* more tab text fixing, get rid of default separator */
#p-cactions-label {
	padding: 0px 10px;
	background: none !important;
	height: 24px;
	position: relative;
	font-size: 22px !important;
	line-height: 24px !important;
	z-index: 1;
}

/* replace default more down arrow */
#p-cactions-label:after {
	z-index: 11;
	width: 16px !important;
	height: 12px !important;
	top: 7px !important;
	opacity: 1 !important;
	background-size: 12px 12px;
	position: relative;
}

/* more dropdown menu bg */
#p-cactions ul {
	background-size: 100% 100%;
}

/* SEARCH TAB */
/* left */
#p-search {
	margin-top: 16px !important;
	margin-left: 0 !important;
	height: 24px !important;
	background-repeat: no-repeat;
	background-size: 20px 24px !important;
}

/* center */
#p-search form#searchform {
	height: 24px !important;
	background-size: calc(100% - 14px) 24px !important;
	background-position: center;
	background-repeat: no-repeat;
}

/* right */
#p-search::after {
	content: "";
	width: 100%;
	height: 24px !important;
	display: block;
	margin-top: -24px;
	background-repeat: no-repeat;
	background-size: 20px 24px !important;
	background-position: top right;
}

/* fix search content being super low */
div#p-search form#searchform {
	margin-top: 0px !important;
}

/* fix search button being at an offset */
#simpleSearch {
	background: none !important;
	border: none !important;
	width: 100% !important;
	min-width: 0% !important;
	max-width: 100% !important;
}

/* search input */
#searchInput {
	border: none !important;
	padding: 4px !important;
	margin: 0px !important;
	height: 16px !important;
	font-size: 11px !important;
	border-radius: 2px !important;
	-moz-border-radius: 2px !important;
	margin-left: 4px !important;
	width: 140px !important;
	-webkit-box-shadow: none !important;
	-webkit-appearance: none !important;
	box-shadow: none !important;
	margin-top: 4px !important;
}

/* search button */
#searchButton {
	border: 0px !important;
	padding: 0px !important;
	width: 18px !important;
	min-width: 18px !important;
	margin-left: 8px !important;
	height: 18px !important;
	cursor: pointer !important;
	text-indent: -5000px !important;
	position: relative !important;
	top: 2px !important;
	right: 4px !important;
	float: right !important;
	margin-top: 1px !important;
	background-size: 18px 36px !important;
	background-position: top !important;
	background-repeat: no-repeat !important;
}

/* search button hover */
#searchButton:hover {
	background-position: 0px -18px !important;
}

/* recent changes small fix */
.oo-ui-textInputWidget .oo-ui-inputWidget-input, .oo-ui-dropdownWidget-handle {
	border-radius: 0 !important;
}

/* force table sorting icon size */
.client-js .sortable:not(.jquery-tablesorter) > * > tr:first-child > th:not(.unsortable), .jquery-tablesorter th.headerSort {
	background-size: 21px 9px;
}

/* file upload name */
input#wpDestFile {
	background-color: #FFFFFF;
	color: #000000;
	border: 2px solid #8F8F9D;
	border-radius: 4px;
}

/* file upload license */
select#wpLicense {
	background-color: #E9E9E9;
	color: #000000;
	border-radius: 4px;
	border: 2px solid #8F8F9D;
}

/* main page styling */
.mp-content-table {
	width: 100%;
	border-radius: 5px;
}

div.mp-content-header {
	font-size: 140%;
	font-weight: bold;
	border: none;
	text-align: left;
	padding-top:10px;
	padding-bottom:10px;
	margin:-3px;
	padding:10px;
	border-radius: 4px 4px 0px 0px;
}

.mp-content-spacer {
	margin-left: 3px;
	margin-right: 3px;
	margin-bottom: -3px;
	color: none;
	border: none;
	text-align: center;
}

/* main page image scaling */
.mp-index-image a img {
	width: 80%;
	height: 100%;
	max-width: 225px;
}

.mp-featured-image a img {
	width: 100%;
	height: 100%;
	max-width: 200px;
	float: right;
}

/* hide main page notice for logged in users */
body.vector-feature-sticky-header-enabled .mp-content-notice {
	display: none;
}

/* hide main page title */
body.page-Main_Page h1.firstHeading {
	margin-bottom: -55px;
	visibility: hidden;
}

/* hide discussion page... discussion */
body.page-OMORI_Wiki_Discussion li#ca-talk {
	display: none !important;
}