MediaWiki:Vector.css

/* * Official Discontinued Features Wiki Day and Night Mode Skin. * * Design Team: * Original author: * - Left-Eye. - User:Left-Eye - 2021-Present. * * Contributers: * - Bayugoon - User:Bayugoon * - Porktuga - User:Porktuga * * Originally inspired by and based apon the old Minecraft Wiki: * - Wiki - [ 'https://minecraft.fandom.com/wiki/Minecraft_Wiki' ] * - Hydra Skin - [ 'https://minecraft.fandom.com/wiki/MediaWiki:Hydra.css' ] * * Last updated: 09-20-2021 */

/* Here starts the Day Mode version of the wiki skin. Many assets will not carry over into the Night Mode version's css due to them not needing changing */

/* Add the underground and dimensions: */ body { background: #000 url(https://static.miraheze.org/mcdiscontinuedwiki/4/4b/WikiSkin%3DBackground-Dimensions.png) repeat-x; }

/* Add the surface and clouds:  */ background-color: #8DBDE9; background-image: url(https://static.miraheze.org/mcdiscontinuedwiki/3/3b/WikiSkin-DayMode%3DBackground-Surface.png); height: 244px; margin-bottom: -187px; }	background: url(https://static.miraheze.org/mcdiscontinuedwiki/6/63/WikiSkin-DayMode%3DBackground-Skies.png) right 12px top 6px repeat-x; }
 * 1) mw-page-base {
 * 1) mw-head {

/* Set the outer content link colours to light gray and white */ .mw-notification a:not(:hover):not(:focus) { color: #BFBFBF !important; } .mw-notification a { color: #FFF !important; }
 * 1) mw-panel *:not(h3) > a:not(:hover):not(:focus),
 * 2) footer a:not(:hover):not(:focus),
 * 1) mw-panel h3,
 * 2) mw-panel a,
 * 3) footer li,
 * 4) footer a,

/* Change section header font to match the rest of the wiki font */ .mw-body h1, .mw-body-content h1, .mw-body-content h2 { font-family: sans-serif; }

/* Set the tab link colours to black and bold */ div#mw-head div.vector-menu h3, div#p-variants.vector-menu #mw-vector-current-variant { font-weight: bold; text-decoration: none; } /* Use black links */ div#mw-head div.vector-menu h3 span { color: #000; }	color: #BA0000; }
 * 1) p-namespaces a,
 * 2) p-views a,
 * 1) p-namespaces a,
 * 2) p-views a,
 * 1) p-namespaces .new a,
 * 2) p-views .new a {

/* Add some margin to help with the 3D effect */ margin-right: 10px; }
 * 1) pageWrapper,
 * 2) right-navigation {

/* Position the tabs */ margin-top: 106px; }	height: 80px; }
 * 1) left-navigation,
 * 2) right-navigation {
 * 1) mw-head-base {

/* Give the tabs the path block styling:  */ .vector-menu-tabs, div.vector-menu { background: none; padding: 0; height: 36px; } .vector-menu-tabs li, .vector-menu-tabs li a { background: none; } .vector-menu-tabs li { position: relative; background: url(https://static.miraheze.org/mcdiscontinuedwiki/5/54/WikiSkin-DayMode%3DTabs.png) no-repeat right top; margin-right: 8px; } .vector-menu-tabs li::before { content: ""; position: absolute; left: 0px; background: url(https://static.miraheze.org/mcdiscontinuedwiki/5/54/WikiSkin-DayMode%3DTabs.png) no-repeat left top; width: 6px; height: 100%; }	content: ""; position: absolute; background: url(https://static.miraheze.org/mcdiscontinuedwiki/5/54/WikiSkin-DayMode%3DTabs.png) no-repeat left top; width: 6px; height: 100%; }	background-image: url(https://static.miraheze.org/mcdiscontinuedwiki/7/77/WikiSkin-DayMode%3DTabs-Side.png); height: 138px; }	margin-left: 170px; } .vector-menu-tabs li:hover { background-position: right bottom; } .vector-menu-tabs .selected { position: relative; background: url(https://static.miraheze.org/mcdiscontinuedwiki/5/54/WikiSkin-DayMode%3DTabs.png) no-repeat right bottom; }
 * 1) left-navigation .vector-menu-tabs li.selected::before {
 * 1) left-navigation .vector-menu-tabs li:first-child::before {
 * 1) left-navigation {

.vector-menu-tabs li a { padding: 15px 14px 0 20px; height: 36px; }

/* Style the watch and unwatch tab */ .vector-menu-tabs #ca-watch.icon a, .vector-menu-tabs #ca-unwatch.icon a { padding-top: 36px; width: 45px; top: 0.15em; } .vector-menu-tabs #ca-watch.icon a:before, .vector-menu-tabs #ca-watch.icon a:focus:before { background-image: linear-gradient(transparent,transparent),url(https://static.miraheze.org/mcdiscontinuedwiki/thumb/f/f4/Unobservable.png/16px-Unobservable.png); left: 1.4em; } .vector-menu-tabs #ca-watch.icon a:hover:before { background-image: linear-gradient(transparent,transparent),url(https://static.miraheze.org/mcdiscontinuedwiki/thumb/b/b8/Semiobservable.png/16px-Semiobservable.png); left: 1.4em; } .vector-menu-tabs #ca-unwatch.icon a:before, .vector-menu-tabs #ca-unwatch.icon a:focus:before { background-image: linear-gradient(transparent,transparent),url(https://static.miraheze.org/mcdiscontinuedwiki/thumb/b/b8/Semiobservable.png/16px-Semiobservable.png); left: 1.4em; } .vector-menu-tabs #ca-unwatch.icon a:hover:before { background-image: linear-gradient(transparent,transparent),url(https://static.miraheze.org/mcdiscontinuedwiki/thumb/f/f4/Unobservable.png/16px-Unobservable.png); left: 1.4em; } .vector-menu { margin: 0 8px 0 6px; }	position: relative; background: url(https://static.miraheze.org/mcdiscontinuedwiki/5/54/WikiSkin-DayMode%3DTabs.png) no-repeat right top; margin: 0 0 0 -8px; height: 36px; overflow: visible; }	content: ""; position: absolute; top: 0; left: -6px; background: url(https://static.miraheze.org/mcdiscontinuedwiki/5/54/WikiSkin-DayMode%3DTabs.png) no-repeat left top; width: 6px; height: 100%; }	background-position: right bottom; } .vector-menu h3 { padding: 15px 16px 0 14px; font-weight: bold; color: #000; } .vector-menu-dropdown .vector-menu-content { min-width: 69px; top: 2.28em; background-color: #EFEFEF; border: 1px solid #9C9C9C; border-top-width: 1px; }
 * 1) mw-head .vector-menu h3 {
 * 1) mw-head .vector-menu h3::before {
 * 1) mw-head .vector-menu h3:hover,
 * 2) mw-head .vector-menu.menuForceShow h3 {

/* Style the simple search: */ background: no-repeat center / 1.23076923em url(https://static.miraheze.org/mcdiscontinuedwiki/8/8b/WikiSkin-DayMode%3DSearchIcon.png); opacity: 0.5; }	width: 355px; }	min-width: 5em; width: 21.1em; max-width: 50em; }	height: 1.79em; border: 0px solid #000000; border-radius: 0; }	position: relative; background-color: rgba(0, 0, 0, 0.365); border-right: 4px solid #5E8F52; border-bottom: 4px solid #382314; margin-top: -7px; padding: 0 4px 0 5px; height: 27px; }	content: ""; position: absolute; top: 0; left: -4px; border-top: 4px solid rgba(0, 0, 0, 0.365); border-left: 4px solid transparent; }	content: ""; position: absolute; top: 0; right: -4px; border-top: 4px solid #80BA5A; border-left: 4px solid #5E8F52; }	height: 85%; top: -3px; border: 0; border-top: 3px solid #E6E6E6; border-left: 3px solid #B0B0B0; background-color: #FFFFFF; background-image: linear-gradient(#6C6C6C, #BABABA); }	content: ""; position: absolute; bottom: 0; left: -3px; border-top: 3px solid #B0B0B0; border-left: 3px solid #79553A; z-index: 1; }	content: ""; position: absolute; top: -3px; right: 0; border-top: 3px solid #80BA5A; border-left: 3px solid #E6E6E6; }
 * 1) searchButton {
 * 1) p-search {
 * 1) simpleSearch {
 * 1) searchInput {
 * 1) p-search form {
 * 1) p-search form::before {
 * 1) p-search form::after {
 * 1) simpleSearch {
 * 1) simpleSearch::before {
 * 1) simpleSearch::after {

/* Fix placeholder text being too light in chrome */
 * -webkit-input-placeholder {

color: inherit; opacity: 0.54; }

/* The suggestions shown under the search bar */ .suggestions { margin-top: 0.5px; margin-right: -1px; } .suggestions > .suggestions-results, .suggestions > .mw-searchSuggest-link { display: block; margin-left: 1px; } .suggestions .suggestions-results, .suggestions .suggestions-special { background-color: #EFEFEF; border-color: #9C9C9C; } .suggestions .suggestions-result-current { background-color: #438D40; color: #FFF; }

/* Make image background transparent */ .gallerybox .thumb img { background: transparent; }

/* Replace divider with a similar image that has proper transparency: [[File:WikiSkin=Divider-Panel.png] */ div#mw-panel div.portal div.body {	background-image: url(https://static.miraheze.org/mcdiscontinuedwiki/6/63/WikiSkin%3DDivider-Panel.png); }

/* Give the main content area and border it's colors */ div#content { background-color: #E6EFF4; border-top: 6px solid #B4BEC3; border-bottom: 0; border-left: 6px solid #171717; margin-right: 10px; }

/* Add the 3D corners to the main content */ div#content::before { content: ""; position: absolute; border-top: 6px solid #B9855C; border-left: 6px solid #B4BEC3; top: -6.5px; right: 0.5px; }

/* Have to use the footer as #content::after is already used to clear the content float */ position: relative; }	content: ""; position: absolute; border-top: 6px solid #171717; border-left: 6px solid #000; top: -6px; left: 0; }
 * 1) footer {
 * 1) footer::before {

/* Add top margin to wiki logo and sidebar */ margin-top: 10px; }
 * 1) p-logo a {

/* Use black square bullet points, instead of circles: */ ul { list-style-image: url(https://static.miraheze.org/mcdiscontinuedwiki/d/d7/WikiSkin%3DBulletpoint.png); }

/* Style the personal links: */	top: 3px; }	font-weight: bold; color: #140077; }	background-image: url(https://static.miraheze.org/mcdiscontinuedwiki/f/fc/WikiSkin-DayMode%3DPersonal-User.png); background-size: 16px 16px; padding-left: 17px !important; }	opacity: 1; }	top: -1px; }	width: 16px; height: 16px; margin: 0 0; } .oo-ui-icon-tray { background-image: url(https://static.miraheze.org/mcdiscontinuedwiki/4/40/WikiSkin-DayMode%3DPersonal-Notices.png); } .oo-ui-icon-bell { background-image: url(https://static.miraheze.org/mcdiscontinuedwiki/0/04/WikiSkin-DayMode%3DPersonal-Alerts.png); }	background-image: url(https://static.miraheze.org/mcdiscontinuedwiki/f/f5/WikiSkin%3DModeSwitch-Moon.png); background-position: left 0.33333333em; background-repeat: no-repeat; background-size: 16px 16px; padding-top: 0.5em !important; padding-left: 17px !important; }
 * 1) p-personal {
 * 1) p-personal a {
 * 1) pt-anonuserpage, #pt-userpage a {
 * 1) pt-notifications-alert .mw-echo-notifications-badge.mw-echo-notifications-badge-all-read,
 * 2) pt-notifications-notice .mw-echo-notifications-badge.mw-echo-notifications-badge-all-read {
 * 1) pt-notifications-notice .mw-echo-notifications-badge,
 * 2) pt-notifications-alert .mw-echo-notifications-badge {
 * 1) pt-notifications-alert .mw-echo-notifications-badge,
 * 2) pt-notifications-notice .mw-echo-notifications-badge {
 * 1) pt-nightmode a {

/* Change some text to Minecraft style font. */ .mw-diff-bytes { font-family: Minecraft, sans-serif; }

/* Same as the default preference tab images, but with the blue background colour instead of white  */ .client-js #preftoc, .client-js #preftoc li { background-image: url(https://static.miraheze.org/mcdiscontinuedwiki/e/e1/WikiSkin%3DDivider-Tab1.png); } .client-js #preftoc li.selected a { background-image: url(https://static.miraheze.org/mcdiscontinuedwiki/a/ad/WikiSkin%3DDivider-Tab2.png); }

/* Style notifications to look like achievements: */ body .mw-notification-area-layout { top: 20px; } body .mw-notification-area-floating { right: 10px; } body .mw-notification { border: 8px solid #555; border-radius: 0; -webkit-border-image: url(https://static.miraheze.org/mcdiscontinuedwiki/e/e1/WikiSkin%3DNotification-PopUp.png) 8 repeat; -moz-border-image: url(https://static.miraheze.org/mcdiscontinuedwiki/e/e1/WikiSkin%3DNotification-PopUp.png) 8 repeat; -o-border-image: url(https://static.miraheze.org/mcdiscontinuedwiki/e/e1/WikiSkin%3DNotification-PopUp.png) 8 repeat; border-image: url(https://static.miraheze.org/mcdiscontinuedwiki/e/e1/WikiSkin%3DNotification-PopUp.png) 8 fill repeat; box-shadow: none; background-color: #212121; background-clip: padding-box; color: #FFF; padding: 0.2em 0.4em; }

/* HiDPI images *, , * , */ @media (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 1.5dppx) { body { background-image: #000 url(https://static.miraheze.org/mcdiscontinuedwiki/e/eb/WikiSkin%3DBackground-Dimensions-HighDPI.png) repeat-x; background-size: 480px auto; }	#mw-page-base { background-image: url(https://static.miraheze.org/mcdiscontinuedwiki/f/fd/WikiSkin-DayMode%3DBackground-Surface-HighDPI.png); background-size: 1680px auto; }	div.vector-menu-tabs span, div.vector-menu-tabs span::before, div #mw-head div.vector-menu > h3, div #mw-head div.vector-menu > h4, div#p-variants.vector-menu #mw-vector-current-variant, div #mw-head div.vector-menu > h3:first-child::before, div #mw-head div.vector-menu > h4:first-child::before, div#p-variants.vector-menu #mw-vector-current-variant::before { background-image: url(https://static.miraheze.org/mcdiscontinuedwiki/f/fe/WikiSkin-DayMode%3DTabs-HighDPI.png); background-size: 262px auto; }	#left-navigation div.vector-menu-tabs li:first-child span::before { background-image: url(https://static.miraheze.org/mcdiscontinuedwiki/f/ff/WikiSkin-DayMode%3DTabs-Side-HighDPI.png); background-size: 6px auto; } }

/* Here starts the Night Mode version of the wiki skin */

/* Add the night surface and clouds:  */ .client-night-mode #mw-page-base { background-image: url(https://static.miraheze.org/mcdiscontinuedwiki/1/1c/WikiSkin-NightMode%3DBackground-Surface.png); background-color: #000; } .client-night-mode #mw-head { background: url(https://static.miraheze.org/mcdiscontinuedwiki/7/7f/WikiSkin-NightMode%3DBackground-Skies.png) right 12px top 6px repeat-x; }

/* Set the tab links to white */ .client-night-mode #p-namespaces a, .client-night-mode #p-views a, .client-night-mode #mw-head .vector-menu h3 span { color: #FFF; } .client-night-mode #p-namespaces .new a,	#p-views .new a { color: #BB3838; }

/* Give the tabs the night time path block styling:  */ .client-night-mode .vector-menu-tabs li { background: url(https://static.miraheze.org/mcdiscontinuedwiki/6/63/WikiSkin-NightMode%3DTabs.png) no-repeat right top; } .client-night-mode .vector-menu-tabs li::before { background: url(https://static.miraheze.org/mcdiscontinuedwiki/6/63/WikiSkin-NightMode%3DTabs.png) no-repeat left top; } .client-night-mode #left-navigation .vector-menu-tabs li.selected::before { background: url(https://static.miraheze.org/mcdiscontinuedwiki/6/63/WikiSkin-NightMode%3DTabs.png) no-repeat left top; } .client-night-mode #left-navigation .vector-menu-tabs li:first-child::before { background-image: url(https://static.miraheze.org/mcdiscontinuedwiki/e/ef/WikiSkin-NightMode%3DTabs-Side.png); } .client-night-mode .vector-menu-tabs li:hover { background-position: right bottom; } .client-night-mode .vector-menu-tabs .selected { background: url(https://static.miraheze.org/mcdiscontinuedwiki/6/63/WikiSkin-NightMode%3DTabs.png) no-repeat right bottom; } .client-night-mode #mw-head .vector-menu h3 { background: url(https://static.miraheze.org/mcdiscontinuedwiki/6/63/WikiSkin-NightMode%3DTabs.png) no-repeat right top; } .client-night-mode #mw-head .vector-menu h3::before { background: url(https://static.miraheze.org/mcdiscontinuedwiki/6/63/WikiSkin-NightMode%3DTabs.png) no-repeat left top; } .client-night-mode #mw-head .vector-menu h3:hover, #mw-head .vector-menu.menuForceShow h3 { background-position: right bottom; } .client-night-mode .vector-menu h3 { color: #FFF; } .client-night-mode .vector-menu-dropdown .vector-menu-content { background-color: #0F0F0F; border: 1px solid #000; }

/* Style the simple search: */ .client-night-mode #searchInput { background-color: #000; color: #FFF; } .client-night-mode #searchButton { background: no-repeat center / 1.23076923em url(https://static.miraheze.org/mcdiscontinuedwiki/8/86/WikiSkin-NightMode%3DSearchIcon.png); } .client-night-mode #p-search form { background-color: rgba(0, 0, 0, 0.365); border-right: 4px solid #192818; border-bottom: 4px solid #201410; } .client-night-mode #p-search form::after { border-top: 4px solid #1E2F1E; border-left: 4px solid #192818; } .client-night-mode #simpleSearch { border-top: 3px solid #282828; border-left: 3px solid #444; } .client-night-mode #simpleSearch::before { border-top: 3px solid #444; border-left: 3px solid #201410; } .client-night-mode #simpleSearch::after { border-top: 3px solid #1E2F1E; border-left: 3px solid #282828; }

/* The suggestions shown under the search bar */ .client-night-mode .suggestions .suggestions-results, .client-night-mode .suggestions .suggestions-special { background-color: #0F0F0F; border-color: #000; } .client-night-mode .suggestions-result, .client-night-mode .suggestions-special .special-query { color: #fff; } .client-night-mode .suggestions-result-current .special-label, .client-night-mode .suggestions-result-current .special-query, .client-night-mode .suggestions .suggestions-result-current { background-color: #4EA64B; color: #000; } /* Give the main content area and border it's dark colors */ .client-night-mode div#content { filter: invert( 1 ) hue-rotate( 180deg ); } .client-night-mode div#content { border-left: 6px solid #E9E9E9; } .client-night-mode div#content img { filter: invert( 1 ) hue-rotate( 180deg ); } .client-night-mode div#content .sprite { filter: invert( 1 ) hue-rotate( 180deg ); }

/* Add the 3D corners to the main content */ .client-night-mode div#content::before { border-top: 6px solid #F4E6E3; border-left: 6px solid #B4BEC3; top: -6.5px; right: 0.5px; }

/* Style the personal links: */ .client-night-mode #p-personal a { color: #1438AC; } .client-night-mode #pt-anonuserpage, .client-night-mode #pt-userpage a { background-image: url(https://static.miraheze.org/mcdiscontinuedwiki/4/4f/WikiSkin-NightMode%3DPersonal-User.png); } .client-night-mode .oo-ui-icon-tray { background-image: url(https://static.miraheze.org/mcdiscontinuedwiki/7/79/WikiSkin-NightMode%3DPersonal-Notices.png); } .client-night-mode .oo-ui-icon-bell { background-image: url(https://static.miraheze.org/mcdiscontinuedwiki/4/4a/WikiSkin-NightMode%3DPersonal-Alerts.png); } .client-night-mode #pt-nightmode a { background-image: url(https://static.miraheze.org/mcdiscontinuedwiki/5/5c/WikiSkin%3DModeSwitch-Sun.png); }

/* Invert notification pages */ .client-night-mode .oo-ui-popupWidget { filter: invert( 1 ) hue-rotate( 180deg ); }

/* Images fixes */ .client-night-mode .thumbimage { background-color: #212121; border: 1px solid #000; }

/* HiDPI images *, , * , */ .client-night-mode @media (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 1.5dppx) { body { background-image: #000 url(https://static.miraheze.org/mcdiscontinuedwiki/e/eb/WikiSkin%3DBackground-Dimensions-HighDPI.png) repeat-x; background-size: 480px auto; }	#mw-page-base { background-image: url(https://static.miraheze.org/mcdiscontinuedwiki/5/5a/WikiSkin-NightMode%3DBackground-Surface-HighDPI.png); background-size: 1680px auto; }	div.vector-menu-tabs span, div.vector-menu-tabs span::before, div #mw-head div.vector-menu > h3, div #mw-head div.vector-menu > h4, div#p-variants.vector-menu #mw-vector-current-variant, div #mw-head div.vector-menu > h3:first-child::before, div #mw-head div.vector-menu > h4:first-child::before, div#p-variants.vector-menu #mw-vector-current-variant::before { background-image: url(https://static.miraheze.org/mcdiscontinuedwiki/2/2a/WikiSkin-NightMode%3DTabs-HighDPI.png); background-size: 262px auto; }	#left-navigation div.vector-menu-tabs li:first-child span::before { background-image: url(https://static.miraheze.org/mcdiscontinuedwiki/3/36/WikiSkin-NightMode%3DTabs-Side-HighDPI.png); background-size: 6px auto; } }