MediaWiki:Custom-common.less

/** * The is the root LESS file for MediaWiki:Common.css. * * To update MediaWiki:Common.css from this file: * - For Oasis users: Click the "Update CSS" button at the top of the page * - For Monobook users: Click the "Update CSS" link in your toolbox * * For more information, see  * * LESS standard library:	 * Non-standard mixins:		 * * Available themedesigner values: * - @theme-body	-> body background colour * - @theme-buttons	-> button colour * - @theme-header	-> collapsible footer bar colour * - @theme-links	-> link colour * - @theme-page	-> article content background */

/* Normal CSS import */ /* @import "/load.php?mode=articles&articles=u:dev:MediaWiki:Highlight.css&only=styles"; */ @import "https://dev.fandom.com/wiki/MediaWiki:Highlight.css?action=raw&ctype=text/css"; @import "https://dev.fandom.com/wiki/MediaWiki:InterlanguageFlags.css?action=raw&ctype=text/css";

/* directory, used in imports */ @dir: 'MediaWiki:Custom-common.less';

/* template styling */ @import '@{dir}/navbox.less'; @import '@{dir}/inventory.less'; @import '@{dir}/minecraft.less';

/* page specific styling */ @import '@{dir}/mainpage.less'; @import '@{dir}/minion.less';

/* Code Editor Styling */ @import '@{dir}/AceEditor.less'; @import "@{dir}/CodeHighlight.less";

/* Old Wikia Menu Button */ @import "@{dir}/WikiaMenuButton.less";

/* Custom Fonts */ @import "@{dir}/fonts.less";

/* Staff Colors (Updated via a script at MediaWiki:Gadget-StaffColorsUpdater.js */ @import "@{dir}/staff-colors.less";

/* Used by Module:Minimap */ @import "@{dir}/minimap.less";

/* General CSS - only simple css that effects multiple type of article pages should go here */

/***** CSS placed here will be applied to all skins on the entire site. *****/ .mw-headline { /* Style all headings (h2, h3, etc) */ font-family: Copperplate, Copperplate Gothic Light, Impact, Charcoal, sans-serif; }

.mw-parser-output li:not([class]), .WikiaArticle li:not([class]) { font-size: inherit !important; line-height: inherit !important; }

/* Holiday Guy in userboxes (disabled) */ /* #userProfileApp .user-identity-box__wrapper { position: relative; background: url(https://static.wikia.nocookie.net/hypixel-skyblock/images/1/1f/Holiday_Guy.png/revision/latest/scale-to-width-down/175?cb=20201210211322) bottom right no-repeat; } */

/* ===========================================================				FANDOM DESKTOP FIXES =========================================================== */ body.skin-fandomdesktop .article-table th, body.skin-fandomdesktop .wikitable th { background-color: #261416; } body.skin-fandomdesktop .wds-tabs__tab { border: 1px solid transparent; text-decoration: none; } body.skin-fandomdesktop .portable-infobox .wds-tabs__wrapper { border-bottom: 1px solid rgba(255,255,255,0.25); } body.skin-fandomdesktop .portable-infobox .wds-tab__content { padding: 0; } body.skin-fandomdesktop .portable-infobox .wds-tabber { border-color: inherit; } body.skin-fandomdesktop .pi-smart-group-head .pi-smart-data-label, body.skin-fandomdesktop .pi-smart-group-body .pi-smart-data-value { margin: 0 !important; } body.skin-fandomdesktop .pi-smart-group-head + .pi-smart-group-body { border-top: none; } .pi-data-value ul li:before { color: white; } body.skin-fandomdesktop .wikiEditor-toolbar-dialog.ui-dialog .ui-dialog-buttonset .ui-button { background: var(--theme-accent-color); margin: 0 2px; } body.skin-fandomdesktop #wikieditor-toolbar-replace-search, body.skin-fandomdesktop #wikieditor-toolbar-replace-replace { font-family: monospace; } body.skin-fandomdesktop #editpage-specialchars a { font-family: monospace; }

/* OTHER STUFF margin-right: 10em; }
 * 1) userProfileApp .user-identity-bio {

/* Fix link icons */ a[href*="/wiki/"].external:after, a[href*=".fandom.com"].external:after, a[href*=".wikia.org"].external:after { display: none !important; }

table[align="center"] { margin: auto; }

/* Fix redlinks */ a[classname="new"]:hover { color: var(--theme-alert-color--hover) !important; -webkit-text-decoration-style: dashed !important; text-decoration-style: dashed !important; }

a[classname="new"] { color: var(--theme-alert-color) !important; -webkit-text-decoration-style: dashed !important; text-decoration-style: dashed !important; }

abbr[title] { text-decoration: underline dotted; } .oddrow tr:nth-of-type(odd)>td, tr.oddrow td { background:rgba(0,0,0,0.2); } /* Darkens every other row */ /* .center is used by fandom, and makes element used on also have a width of 100% */ .ct, .centertext, .centertxt { text-align:center !important; }

.code, code.dark { background: rgba(0, 0, 0, 0.35) !important; padding: 1.5px !important; border-radius: 3px !important; tab-size: 4 !important; font-family: monospace !important; white-space: pre !important; }

.dark-code-box { background-color: #002b36; border: 1px solid #5e484a; line-height: 14px; overflow: auto; padding: 12px; word-wrap: normal; color: #93a1a1; font-family: monospace; }

.skin-oasis .cm-mw-doubleUnderscore, .skin-oasis .cm-mw-signature, .skin-oasis .cm-mw-hr { background: unset !important; }

wikitable.lowpadding th, wikitable.lowpadding td { padding: 2px; } ol.references li:target, sup.reference:target { background: unset !important; border-color: #fff; border-radius: 3px; }

a.page-title-link:hover { text-decoration: underline; }

.WikiaArticle *:not(.plainlist) > ul:not([class]), .WikiaArticle *:not(.plainlist) > ul[class*="mw"], .WikiaArticle *:not(.plainlist) > ul.plainlinks, .WikiaArticle ol { margin: 0.4em 0px 0.5em 2.5em; } .WikiaArticle ol { list-style: decimal; } .WikiaArticle ol.special { margin-left: 3.2em; } .WikiaArticle *:not(.plainlist) > ul:not([class]), .WikiaArticle *:not(.plainlist) > ul[class*="mw"], .WikiaArticle *:not(.plainlist) > ul.plainlinks{ list-style: square; } .WikiaArticle li { line-height: 20px; margin: 3px 0px; } .WikiaArticle dl { margin: 1em 0px; }

.mw-changeslist table { margin: 2px !important; margin-left: 0 !important; }

.navbox .hlist * { font-size: 12px !important; }

.cm-mw-skipformatting { background: unset !important; }

ul.lowmargin { margin-left: 1.5em; }

/* Makes the infobox top navigation wrap onto multiple lines, since badly designed scrolling behavior is crap on desktop */ .portable-infobox .pi-section-navigation { justify-content: center; flex-wrap: wrap; }

.oo-ui-buttonElement-button { color: var(--theme-article-text-color) !important; } .oo-ui-buttonElement-frameless.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button { color: var(--theme-alert-color) !important; }

/* Removing the white-ish background from various elemnts */ .admin-dashboard__module, .AdminDashboard .admin-dashboard-content .control-section, .mw_metadata, .CategorySelect.articlePage { background: unset; }

.WikiaMainContent pre:not([class]), .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined .oo-ui-tagMultiselectWidget-handle, .ooui-theme-fandomooui .mw-rcfilters-ui-filterTagMultiselectWidget.oo-ui-widget-enabled .oo-ui-tagMultiselectWidget-handle+.mw-rcfilters-ui-table { background-color: rgba(0, 0, 0, 0.35); } .mw-changeslist-legend { background-color: rgba(0, 0, 0, 0.35) !important; }

.admin-dashboard__module, .AdminDashboard .admin-dashboard-content .control-section { border: 1px solid #9b8d8e; }

.AdminDashboardTabs .tab.active { background: rgba(248, 192, 85, 0.35); border-color: rgba(248, 192, 85, 0.8); }

.AdminDashboardTabs .tab:hover { background: rgba(248, 192, 85, 0.5); transition-property: background, border; transition-delay: 0.3s; }

/* General hide class to be used as necessary (pair to .mobile-hide) */ .desktop-hide { display: none !important; }

/* Table Highlighting */ .wikitable tr:target, .article-table tr:target, .wikitable tr.article-row-main:target ~ tr.article-row-bound, .article-table tr.article-row-main:target ~ tr.article-row-bound { /*	border-color: #CC0000; border-style: solid; */	background: #770000; } .wikitable tr:target, .article-table tr:target { outline: thin solid; } .wikitable tr:target td, .wikitable tr:target th, .wikitable tr.article-row-main:target ~ tr.article-row-bound td, .wikitable tr.article-row-main:target ~ tr.article-row-bound th { border-color: #CC0000; border-style: solid; }

tr.article-row-main:target ~ tr.article-row-main ~ tr.article-row-bound { /*	border-color: inherit; border-style: inherit; */	background: inherit; } tr.article-row-main:target ~ tr.article-row-main ~ tr.article-row-bound td, tr.article-row-main:target ~ tr.article-row-main ~ tr.article-row-bound th { border-color: var(--theme-border-color); border-style: solid; }

/* Fix Collapsed table headers */ table.mw-made-collapsible:not(.mw-collapsed) > thead > tr { display: table-row !important; }

/* Article-table CSS */ .article-table th { text-align: center; } /* Wikitable CSS */ .wikitable th { padding: 2.8px 5.6px !important; background-color: #261416 !important; } /* Heading CSS */ background: #2d1616; padding: 4px; border-radius: 8px 15px 0 0; }
 * 1) WikiaMainContent *:not(.toctitle) > h2:not([class]):not(#mw-previewheader) {

.toc ul ul { list-style: none !important; margin: 1.2em; }

.toc ul { list-style: none !important; margin: 0.6em; }

/* Adds wikipedia Template:Ambox type style to a table/div */ .messagebox { background:lighten(@theme-page, 2%); border: 1px solid #AAA; border-left:10px solid @theme-buttons; padding: 10px 20px; display: block; margin: 0 7%; overflow: auto; border-spacing: 0.7em; }

/* Enables H2 and H3 headers Tabber */ .tabberlive { position:relative; /* Needed for */ overflow-x:auto; /* Fixes the tabbers overflowing over infoboxes or any other floating stuff */ .tabbertab { h2, h3 { display:block !important; } } } .wikitable td, .article-table td { overflow: hidden; position:relative; } .blankCell { display: flex; cursor:not-allowed; background:rgba(150,150,150,0.15); text-align:center; font-size:65%; color: transparent; /* We only want to show what is in ::after, but still want an actual character in the template so the character is selectable */

position: absolute; top: 0; bottom: 0; left: 0; right: 0; } .blankCell::after { content: "∅"; flex: 1; align-self: center; color:rgba(185, 185, 185, 0.55); }

/* Prevent infobox images being too tall */ .pi-image-thumbnail { max-height: 350px; max-width: 100%; height: auto; width: auto; }

/* https://en.wikipedia.org/wiki/Template:Plainlist */ .plainlist ul, .pi-europa .pi-data-value .plainlist ul { line-height: inherit; list-style: none none; margin: 0; } .plainlist ul li, .pi-europa .pi-data-value .plainlist ul li { margin: 0; padding: 0; }

.inset-code { background-color: #cacaca; padding: 1px 1px; border-radius: 3px; font-family: monospace; color: black; border: 1.1px solid #383838; display: inline; position: relative; vertical-align: bottom; white-space: pre; }

.button .large { padding: 4px 12px; font: bold 100% arial; margin: 4px; }

pre .dark { background-color: #002b36; }

.delete-box { border: 2px solid; border-color: red; border-radius: 3.5px; padding: 3px 5px; margin: 5px; background-color: #7f1d1d; text-align: center; }

hr .tan-line { margin:0.1em 2px; border: 0.5px solid tan; }

text-decoration: underline; }
 * 1) re-mirror-sandbox:hover {

/* */ .skydate-countdown-active { color:green; }

/*

=
============================ Page Specific

=
=========================== /* Abuse Filter DIFF css */ table.mw-abuselog-details { margin: 1em 1em 1em 0 !important; background: #2f1616 !important; } table.mw-abuselog-details th { background: #2e174b !important; } .diff-context { border-color: #4d5065 !important; } .diff-deletedline .diffchange.diffchange-inline { background: #a44d4d !important; } td.diff-deletedline { background: #4d2626 !important; } .diff-deletedline { border-color: #b02d2d !important; } .diffchange { background-color: #0f72a7 !important; } .diff-addedline { border-color: #2a77bd !important; background: #24263a !important; }

/* Block list CSS */ .TablePager_col_ipb_params > ul > li:not(:last-child)::after { content: ","; } .TablePager_col_ipb_params > ul { list-style: none !important; margin: 0 !important; }

.TablePager_col_ipb_reason { font-style: italic; }

.TablePager_col_ipb_reason::before { content: "(" }

.TablePager_col_ipb_reason::after { content: ")" }

/* Other */ img.thumbimage { margin: 2px 0 !important; }

.mw-parser-output li, .WikiaArticle li { line-height: 20px; font-size: 14px; } .pi-image-collection-tabs{ margin: 0.6em; list-style: none; }

background: rgb(54, 26, 29); color: inherit; }
 * 1) quickdiff-modal {

text-transform: uppercase; font-weight: normal; background: #301212; }
 * 1) userProfileApp .user-identity-header__tag {

/* Tabbers */ @theme-buttons: #c15926; @theme-header: #cc9933;

border-color: @theme-header; li a { @mycurbg: @theme-buttons; background-color: @mycurbg; background-image: -webkit-gradient(linear,0% 0%,0% 100%,color-stop(35%,lighten(@mycurbg, 10%)),color-stop(65%,@mycurbg)); border: 1px solid #c15926; border-radius: 4px 4px 0 0; color: #fff !important; font-weight: normal; &:hover { @mycurbg: darken(@theme-buttons, 5%); background-color: @mycurbg; background-image: -webkit-gradient(linear,0% 0%,0% 100%,color-stop(35%,lighten(@mycurbg, 10%)),color-stop(65%,@mycurbg)); color: #dadada !important; }	}	li.tabberactive a { @mycurbg: lighten(@theme-buttons, 5%); font-weight: bold; background-color: #b05123; background-image: -webkit-gradient(linear,0% 0%,0% 100%,color-stop(35%,lighten(@mycurbg, 10%)),color-stop(65%,@mycurbg)); color: #eee !important; border-color: @theme-header; border-width: 1px; padding-left: 10px; padding-right: 10px; &:hover { @mycurbg: darken(@theme-buttons, 10%); font-weight: bold; background-color: #b05123; background-image: -webkit-gradient(linear,0% 0%,0% 100%,color-stop(35%,lighten(@mycurbg, 10%)),color-stop(65%,@mycurbg)); color: #dadada !important; border-color: darken(@theme-header, 5%); }	} } .mw-content-text .tabber .tabbertab { border-color: @theme-header; }
 * 1) mw-content-text ul.tabbernav {

.sbw-ui-tabber [class^="invslot goto-"], .sbw-ui-tabber [class^="invslot animated goto-"], .sbw-ui-tabber [class^="invslot ui-"], .sbw-ui-tabber [class^="invslot animated ui-"] { cursor: pointer; }

/* Username Styling */ /* Bureaucrats */ .user-link-bcrat { color: #ff3f43 !important; text-shadow: 0 0 4px #ff3f43 !important; font-weight: bold; }

/* Admins */ .user-link-admin { font-weight:bold; color: #a431fc !important; text-shadow: 0 0 4px #a431fc !important; }

/* Code Editors */ .user-link-codeeditor { font-weight: bold !important; color: #5874f3 !important; text-shadow: 0 0 3px #5265ba !important; }

/* Content moderators */ .user-link-mod { font-weight: bold; color: #7FFFD4 !important; text-shadow: 0 0 3px #397561 !important; }

/* Discussion moderators */ .user-link-dmod { font-weight: bold; color: #1f9921; text-shadow: 0 0 3px #648264; }

/* Rollbackers */ .user-link-rollback { font-weight: bold; color: #ff992b !important; text-shadow: 0 0 4px #a36726 !important; }

/* Bots */ .user-link-bot { font-weight: bold; color: darkgray !important; text-shadow: 0 0 3px gray !important; }

/* Rarity/Tier Styling */ .tier-rare { text-shadow: 0 0 4px #000; }

/* Highlight table */ /* Mediawiki:Highlight.js */

.lighttable tr.highlight-over { background-color: #e2926b; color: white; } .lighttable tr.highlight-over a { color: purple; } .lighttable tr.highlight-on { background-color: #c15926; color: white; } .lighttable tr.highlight-on a { color: purple; }

.highlight-over .tier-rare, highlight-on .tier-rare { text-shadow: none; }

/* Styling for minecraft style tooltip */ /* Taken from minecraft.gamepedia.com */

position:fixed; top:0; left:0; background-color:#100010; background-color:rgba(16,0,16,0.94); padding:0.375em; font-family:Minecraft,serif,sans-serif; font-size:16px; word-spacing:4px; white-space:nowrap; line-height:1.25em; margin:0.125em 0.25em; pointer-events:none; z-index:9999 } content:""; position:absolute; top:0.125em; right:-0.125em; bottom:0.125em; left:-0.125em; border:0.125em solid #100010; border-style:none solid; border-color:rgba(16,0,16,0.94) } content:""; position:absolute; top:0.125em; right:0; bottom:0.125em; left:0; border:0.125em solid #2D0A63; border-image:-webkit-linear-gradient(rgba(80,0,255,0.31),rgba(40,0,127,0.31)) 1; border-image:linear-gradient(rgba(80,0,255,0.31),rgba(40,0,127,0.31)) 1 } display:block; margin-top:0.25em }
 * 1) minetip-tooltip {
 * 1) minetip-tooltip::before {
 * 1) minetip-tooltip::after {
 * 1) minetip-tooltip > .description,
 * 2) minetip-tooltip > .minetip-description {

/* Element Animator - used in conjunction with JS to cycle through multiple items */ /* Taken from minecraft.gamepedia.com */ display: none }	display: inline-block; }	display: block; }
 * 1) mw-content-text .animated > *:not(.animated-active),
 * 2) mw-content-text .animated > .animated-subframe > *:not(.animated-active) {
 * 1) mw-content-text span.animated,
 * 2) mw-content-text span.animated.animated-visible > *,
 * 3) mw-content-text span.animated.animated-visible > .animated-subframe > * {
 * 1) mw-content-text div.animated.animated-visible > *,
 * 2) mw-content-text div.animated.animated-visible > .animated-subframe > * {

/* */ table.armorstats2x2 { margin-right: 0; } .armorstats2x2 th { min-width: 184px; } .armorstats2x2 .as2x2-icon { padding: 0 3px; } .armorstats2x2 .as2x2-item-stats { padding: 0 5px; }

.armorstats2x2 .as2x2-item-stats ul { line-height: inherit; list-style: none none; margin: 0; }

/* Infobox tweaks */ .portable-infobox .pi-item[data-item-name="infobox-stats-list"] .pi-data-label { flex-basis: 110px; } .portable-infobox .pi-item[data-item-name="infobox-stats-list"] .pi-item { padding-top: 3px; padding-bottom: 3px; } .portable-infobox .pi-item[data-item-name="infobox-stats-list"] .pi-item:first-of-type { padding-top: 14px; } .portable-infobox .pi-item[data-item-name="infobox-stats-list"] .pi-item:last-of-type { padding-bottom: 17px; }

/* Other */
 * focus {

outline: unset; }

.mwe-math-fallback-image-inline { filter: invert(100%) !important; margin: 0 !important; background-color: unset !important; }

/* Less modal */ background: url(//runescape.fandom.com/wiki/Special:FilePath/Close-x-white.svg) @theme-buttons center no-repeat !important; padding: 0; width: 15px; height: 15px; }
 * 1) less-close {

color: white !important; }
 * 1) less-title {

background: @theme-page !important; }
 * 1) less-modal,
 * 2) less-content {

color: white !important; }
 * 1) less-content p {

color: #fec356 !important; }
 * 1) less-content a {

color: #ed9a01 !important; transition: color 0.3s !important; text-decoration: underline #ed9a01 !important; }	display: none; }
 * 1) less-content a:hover {
 * 1) less-update-button:nth-of-type(2) {

/* Article Scrollbar Tweaks */ .article-scrollable::-webkit-scrollbar { width: 10px; height: 10px; }

.article-scrollable::-webkit-scrollbar-track { background: #50373a; }

.article-scrollable::-webkit-scrollbar-thumb { background: #897e81; }

.article-scrollable::-webkit-scrollbar-thumb:hover { background: #6e6568; }

/* Article Scrollbar Tweaks (Firefox) */ .article-scrollable { scrollbar-width: thin; scrollbar-color: #897e81 #50373a; overflow: auto; }

/* Disables text highlighting on browsers */ .noselect { -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }

/* Style normal text like Latex text ( tag) */ .math-text { font-family: times; font-size: 1.2em; margin: 0 0.3em; color: white; }

/* JSCalculator CSS that must be loaded first */ .jcConfig { display:none; } .jcLoadspace { color: var(--theme-accent-color); padding: 2em; border: 1px var(--theme-accent-color) solid; margin: 2em 0; }

/* Discord Modal Fixes */ position: absolute; right: 0; opacity: 1; border: none; width: .3em; display: flex; align-items: center; justify-content: center; }	margin: 20px 10px; }
 * 1) discord-member-modal .close.wikia-chiclet-button {
 * 1) discord-member-modal h1 {

/* Vertical cell support */ .vertical th, .vertical td, td.vertical, th.vertical{ writing-mode: vertical-rl; }

/* Code block */ .page:not(.page-is-edit) code:not(.CodeMirror-line), .page:not(.page-is-edit) pre:not(.CodeMirror-line), #less-content > p { font-family: Consolas, monospace !important; }

/* Fix JSON page highlighting on dark theme */ background-color: rgba(120, 235, 120, 0.2); }
 * 1) mw-content-text .mw-json .value,
 * 2) mw-content-text .mw-json-single-value {

background-color: rgb(100, 100, 100); }
 * 1) mw-content-text .mw-json .mw-json-empty {

/* Fix aceeditor missing buttons */ .wikiEditor-ui .group-codeeditor-style span[rel="gotoLine"] a, .wikiEditor-ui .group-codeeditor-style span[rel="lineWrapping"] a, .wikiEditor-ui .group-codeeditor-style span[rel="invisibleChars"] a { color: inherit !important; }