User:George Orwell III/modern.css

Note: After saving, changes may not occur immediately. Click here to learn how to bypass your browser's cache.

Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (Cmd-R on a Mac)
Google Chrome: Press Ctrl-Shift-R (Cmd-Shift-R on a Mac)
Internet Explorer: Hold Ctrl while clicking Refresh, or press Ctrl-F5
Opera: Clear the cache in Tools → Preferences

For details and instructions about other browsers, see Wikipedia:Bypass your cache.

Code that you insert on this page could contain malicious content capable of compromising your account. If you are unsure whether code you are adding to this page is safe, you can ask at the central discussion page, Scriptorium. The code will be executed when previewing this page under some skins, including Monobook. You can Purge this page in the interim if you wish to refresh the content sooner under another skin.

The accompanying .js page for this skin can be added at User:George Orwell III/modern.js.

@charset "UTF-8";
/***********************************
Ripped from MediaWiki:Gadget-dynamic-menus.css
***********************************/
div#p-personal, div#mw_portlets {
	margin: 0 auto 0 auto;
	width: calc(100% / 6);
}
#p-personal, #mw_portlets .portlet:not(#p-lang) {
	box-sizing: border-box;
	height: auto;
	overflow: visible;
	top: 2.00em;
	left: auto;
	position: absolute;
	z-index: 1000;
	width: calc(100% / 6); /* ***** $var1 ***** This needs to be customized for each wiki. It is 100% divided on the number of .portlets */
}
/***********************************
The following need to be customized for each wiki.
It contains the IDs of each individual portlet, and their positions. #p-search is placed separately; it should always be to the right.
The first one must have a value the same as $var1, the second one is 2 × $var1, the third one is 3 × $var1 and so on.
***********************************/
#p-personal {
	right: calc(100% / 6) !important;
}
#p-coll-print_export {
	right: calc((100% / 6) * 2);
}
#p-navigation {
	left: 0 !important;
	width: calc(100% / 6);
}
#p-tb {
	left: calc(100% / 6) !important;
}
#p-do {
	left: calc((100% / 6) * 2) !important;
}

/***********************************
End of .portlet ID section.
***********************************/
#p-search {
	right: 0;
	width: calc(100% / 6);
}
#p-personal h3, #mw_portlets h3 {
	display: block;
	background-color: #3c78b5;
	cursor: default;
	color: white;
	font-size: calc(1rem - 3px);
	line-height: 1.0;
	font-variant: small-caps;
	font-weight: bold;
	height: 1em;
	text-transform: lowercase;
	text-align: center;
}
.portlet h3 {
	border-bottom: none;
	padding: 0.25em 1.0em 0.25em 1.0em;
	width: auto;
}
#p-personal div.pBody, #mw_portlets div.pBody {
	display: none;
	box-sizing: border-box;
	background-color: #eee;
	border-left: 1px solid #036;
	border-right: 1px solid #036;
	border-bottom: 5px solid #036;
	font-variant: normal;
	height: auto;
	margin: 0;
	padding: 0;
	width: auto;
}
#p-personal ul, #mw_portlets .portlet ul, #searchBody {
	background-color: #eee;
	height: auto;
	line-height: 1.5;
	margin: 0;
	padding: 0;
}
#p-personal li, #mw_portlets li {
	display: block;
	border-bottom: 1px solid #ddd;
	float: none;
	font-weight: normal;
	text-transform: none;
	margin: 0;
	height: auto;
}
#p-personal li a, #mw_portlets li a {
	color: #036;
	width: auto;
	padding: 0 1em;
}
#searchInput {
	width: calc(100% - 1em);
}
#mw_contentwrapper, #mw_content {
	margin: 0;
}
#p-cactions {
	box-sizing: border-box;
	margin: 0;
}
#p-cactions li {
	margin: 0;
	padding: 0;
}
#p-cactions li a {
	padding: 0 1em;
}
#pt-notifications .mw-echo-notifications-badge {
	margin-left: 0.25em;
}
form#mw-watchlist-resetbutton {
	position: absolute;
	top: 6.0em;
	right: 0.25em;
	padding: 0 0 0.5em 0.5em;
}
/* The following elements are the ones that make the actual dynamics */
#p-personal:hover h3, #mw_portlets .portlet:hover h3 {
	border-top: 2px solid #3c78b5;
	background-color: #036;
}
#p-personal li a:hover, #mw_portlets li a:hover {
	text-decoration: underline;
	color: #036;
}
#p-personal li:hover, #mw_portlets li:hover {
	background-color:#ddd;
}
#p-personal:hover div.pBody, #mw_portlets .portlet:hover div.pBody {
	display: block;
	box-sizing: border-box;
}
#p-personal:hover, #mw_portlets .portlet:hover {
	-moz-box-shadow: #aaa 5px 5px 5px -2px;
}
#p-search.portlet:hover {
	-moz-box-shadow: #aaa -2px 5px 5px -2px;
}

/****************************
#p-lang module
****************************/

#p-lang {
	position: absolute;
	top: 6.0em;
	max-height: 80%;
	left: -200px;
	width: 200px;
	border-right: 8px solid orange;
}
#p-lang div.pBody {
	display: block;
	box-sizing: border-box;
	border-bottom: 1px solid #036;
}
#p-lang h3 {
	height: 1.125em;
}
#p-lang:hover h3 {
	height: 1.00em;
}
#p-lang:hover {
	position: absolute;
	top: 6.0em;
	left: 0;
	background-color: #f0f0f0;
	border: 1px solid #036;
	border-bottom: 4px solid #036;
	overflow: auto;
}
#p-lang:hover .pBody, #p-lang.portlet:hover h3 {
	border: 0;
}

/* based on v1.1.4 */

User:George Orwell III/modern.css

Navigation menu

Search