MediaWiki:Common.css

/* - TABLE OF CONTENTS - CTRL + F and type the section to find them. OTHER IMPORTS (imports not created on this wiki) IMAGE EFFECTS (effects of images when you hover over them) USER DESIGN (username design) DIV SPAN CLASSES (adjustments of div/span classes and extra classes)t IDs (custom IDs) INFOBOX (design of infobox) TOOLTIP (design of tooltips) DISCORD (design of DiscordWidget) LinkPreview (design of LinkPreview on ImportJS) CHANGELIST (design of changelist in the main page) LINKS (design of links when you hover over them and click it) TABBER (design of tabbers) OTHER (other things) GALLERY (design of galleries) FROM CSS COOKBOOK (taken from CSS Cookbook) RECENT IMAGES (design of the Recent Images section) PROFILE TAGS (design of profile tags) VIDEO EMBED (design of video embed)

/* OTHER IMPORTS */ @import "/load.php?mode=articles&articles=u:dev:MediaWiki:BalancedTabber.css&only=styles"; @import "/load.php?mode=articles&articles=u:dev:MediaWiki:BringExternalLinkIconsBack.css&only=styles"; @import "/load.php?mode=articles&articles=u:dev:MediaWiki:CSS3Tooltip.css&only=styles";

/* IMAGE EFFECTS */ @import "/index.php?title=MediaWiki:Common.css/imageffects.css&action=raw&ctype=text/css";

/* USER DESIGN */ @import "/index.php?title=MediaWiki:Common.css/namedesign.css&action=raw&ctype=text/css";

/* DIV SPAN CLASSES */ .page-content { overflow:unset; }

.article-table .sticky-header { position:sticky; top:46px; z-index:1; }

.theme-fandomdesktop-dark .article-table tr:nth-child(odd) { background: rgba(61, 33, 94, 0.2); } .theme-fandomdesktop-dark .article-table tr:nth-child(even) { background: rgba(72, 40, 115, 0.2); }

.WikiaTable td, .WikiaTable th, .article-table td, .article-table th { border-bottom: 2px solid var(--theme-page-background-color); }

.theme-fandomdesktop-light .article-table tr:nth-child(odd) { background: rgba(0,0,0,0.1); } .theme-fandomdesktop-light .article-table tr:nth-child(even) { background: rgba(0,0,0,0.15); }

.mw-collapsible:not(.wikitable, .article-table, .fandom-table, .float-right, .custom, .custom-bordered, .custom-unbordered) span.mw-collapsible-toggle { float: none; margin-left:0px; margin-right:1em; }

.fandom-table { background:rgb(0,0,0,.1); box-shadow: inset 0px 0px 10px 0px rgba(0, 0, 0, 0.2); border-spacing:2px; border-collapse:separate; border-color:transparent; border:0px solid; }

.fandom-table tr td, .fandom-table tr th { padding-top:0px; padding-bottom:0px; padding-left:5px; padding-right:5px; }

.ooui-theme-fandomooui .mw-datatable>*>tr>th, .ooui-theme-fandomooui .mw-datatable>tr>th, .ooui-theme-fandomooui .mw-json>*>tr>th, .ooui-theme-fandomooui .mw-json>tr>th, .ooui-theme-fandomooui .wikitable>*>tr>th, .ooui-theme-fandomooui .wikitable>tr>th { background-color: #9951f0; text-shadow:0 0 1.25px black, 0 0 1.25px black, 0 0 1.25px black, 0 0 1.25px black, 0 0 1.25px black; color:white; padding-bottom:0px; padding-top:0px; margin:0px; }

.wikitable > tr > th, .wikitable > tr > td, .wikitable > * > tr > th, .wikitable > * > tr > td { border-right: 0px solid; border-left: 0px solid; border-top: 1px solid; border-bottom: 1px solid; }

.ooui-theme-fandomooui .mw-datatable, .ooui-theme-fandomooui .mw-json, .ooui-theme-fandomooui .wikitable { background-color: rgb(0,0,0,.1); }

.wikitable { box-shadow: inset 0px 0px 10px 0px rgba(0, 0, 0, 0.2); border-spacing:2px; border-collapse:separate; border-color:transparent; border:0px; }

.wikitable > caption { background-color: #9951f0; color:white; text-shadow:0 0 1.25px black, 0 0 1.25px black, 0 0 1.25px black, 0 0 1.25px black, 0 0 1.25px black; font-size:20px; padding-left:5px; padding-right:5px; }

.float-right .mw-collapsible span.mw-collapsible-toggle, .wikitable .mw-collapsible span.mw-collapsible-toggle, .fandom-table .mw-collapsible span.mw-collapsible-toggle, .article-table .mw-collapsible span.mw-collapsible-toggle, .custom .mw-collapsible span.mw-collapsible-toggle, .custom-bordered .mw-collapsible span.mw-collapsible-toggle, .custom-unbordered .mw-collapsible span.mw-collapsible-toggle { float:right; margin-left:1em; }

.custom { background:rgb(0,0,0,.1); box-shadow: inset 0px 0px 10px 0px rgba(0, 0, 0, 0.2); border:1px solid #505050; padding-left:10px; padding-right:10px }

.custom-bordered { background:rgb(0,0,0,.1); box-shadow: inset 0px 0px 10px 0px rgba(0, 0, 0, 0.2); border:3px solid #9951f0; padding-left:10px; padding-right:10px }

.custom-unbordered { background:rgb(0,0,0,.1); box-shadow: inset 0px 0px 10px 0px rgba(0, 0, 0, 0.2); border:0px solid transparent; padding-left:10px; padding-right:10px }

.centered-tabs .wds-tabs { justify-content: center; }

.theme-fandomdesktop-dark .darker .wds-tabs { background:rgba(0,0,0,0.4); border-radius:1em; margin-top:5px; padding:0px; }

.theme-fandomdesktop-light .darker .wds-tabs { background:rgba(0,0,0,0.1); border-radius:1em; margin-top:5px; padding:0px; }

.mw-collapsible-text { background-color: rgba(153, 81, 240, 0.2); padding-left: 5px; padding-right:5px; font-weight: bold; border-radius: 0.5em; border: 1px solid; color:#8c1fed; }

.black .mw-collapsible-text { background-color: rgba(153, 81, 240, 0.2); padding-left: 5px; padding-right:5px; font-weight: bold; border-radius: 0.5em; border: 1px solid black; color:black; }

.white .mw-collapsible-text { background-color: rgba(153, 81, 240, 0.2); padding-left: 5px; padding-right:5px; font-weight: bold; border-radius: 0.5em; border: 1px solid white; color:white; }

.mw-collapsible-toggle-default:before, .mw-collapsible-toggle-default:after { display:none; }

/* IDs */ background-color:lime; color:white }
 * 1) example { /* You probably saw this at the Writing Manual. Thanks for reading. */

float: right; margin-left:1em; }
 * 1) float-right {

border:5px solid #648cd0; cursor: context-menu; }
 * 1) hotbar:hover {

.theme-fandomdesktop-light #shadow { text-shadow:0 0 1.25px white, 0 0 1.25px white, 0 0 1.25px white, 0 0 1.25px white, 0 0 1.25px white }

.theme-fandomdesktop-dark #shadow { text-shadow:1px 1px 10px black; }

opacity:0.5; }
 * 1) translucent {

opacity:0.25; }
 * 1) translucent2 {

opacity:0.1; }
 * 1) translucent3 {

opacity:0; }
 * 1) transparent {

display: block; margin-left: auto; margin-right: auto; width: 100%; }
 * 1) center {

opacity:0.5; cursor: context-menu; }
 * 1) hover:hover {

background:rgba(100, 100, 100, 0.4); text-decoration:underline; cursor: context-menu; }
 * 1) highlight:hover {

.theme-fandomdesktop-dark #themebg { background-color:#2b2b2b; color:white; }

.theme-fandomdesktop-light #themebg { background-color:#bdbbbb; color:black; }

.theme-fandomdesktop-dark #themebg2 { background-color:#2b2b2b; color:white; }

.theme-fandomdesktop-light #themebg2 { background-color:#f7f1df; color:black; }

/* INFOBOX */ .theme-fandomdesktop-dark .portable-infobox { background: #141414; border:0px solid transparent; border-radius: 10px 10px 10px 10px} .theme-fandomdesktop-light .portable-infobox { background: rgb(0,0,0,.1); border:0px solid transparent; border-radius: 10px 10px 10px 10px}

/* TOOLTIP */ .theme-fandomdesktop-dark .main-tooltip { background: rgba(0,0,0,0.9); box-shadow: 2px 2px 5px rgba(0,0,0,0.3); padding-left: 10px; padding-right: 10px; margin-bottom: 5px; color: white; border:1px solid rgba(0,0,0,0.3); border-left: 5px solid #9951f0 !important; border-right: 1px dashed white !important; border-radius: 0px; text-shadow:0px 0px 4px black; }

.theme-fandomdesktop-light .main-tooltip { background: rgba(247, 241, 223,0.9); box-shadow: 2px 2px 5px rgba(0,0,0,0.3); padding-left: 10px; padding-right: 10px; margin-bottom: 5px; color: black; border-left: 5px solid #9951f0 !important; border-right:1px dashed black !important; border-radius: 0px; text-shadow:0px 0px 4px #f7f1df; }

.theme-fandomdesktop-dark [data-tips]:after { height: auto; width: max-content; max-width: 20vw; white-space: normal; text-align:left; background: rgba(0,0,0,0.9); box-shadow: 2px 2px 5px rgba(0,0,0,0.3); padding-left: 10px; padding-right: 10px; margin-bottom: 5px; color: white; border: 1px solid rgba(0,0,0,0.3); border-left: 5px solid #9951f0 !important; border-right: 1px dashed white !important; border-radius: 0px; text-shadow: 0px 0px 4px black; }

.theme-fandomdesktop-light [data-tips]:after { height: auto; width: max-content; max-width: 20vw; white-space: normal; text-align:left; background: rgba(247, 241, 223,0.9); box-shadow: 2px 2px 5px rgba(0,0,0,0.3); padding-left: 10px; padding-right: 10px; margin-bottom: 5px; color: black; border-left: 5px solid #9951f0 !important; border-right:1px dashed black !important; border-radius: 0px; text-shadow:0px 0px 4px #f7f1df; }

/* DISCORD */ .discord-widget .widget-header { background-color: #8c52ff; }

.discord-widget .widget-btn-connect { border: 1px solid #8c52ff; }

.DiscordWidget .title-container h2 { border-bottom: 1px solid #4d4d4d; }

/* LinkPreview */ .theme-fandomdesktop-dark .npage-preview { background-color:#171414; box-shadow: 2px 2px 5px rgba(0,0,0,0.3); color: white; border: 2px solid #9951f0; border-radius: 0.5em; }

.theme-fandomdesktop-light .npage-preview { background-color:#f7f1df; box-shadow: 2px 2px 5px rgba(0,0,0,0.3); color: black; border: 2px solid #9951f0; border-radius: 0.5em; }

.npage-preview-noimage { content: url(https://static.wikia.nocookie.net/unofficialrgd/images/d/dd/Unknown.png/revision/latest?cb=20230114070101); }

/* CHANGELIST */ .mw-changeslist-legend { background-color:#171414; border:white; color:white; }

/* LINKS */ .theme-fandomdesktop-dark a:hover { text-shadow: 1px 1px 10px #a966fa; color: #a966fa; }

.theme-fandomdesktop-light a:hover { text-shadow: 1px 1px 10px black; color: #a966fa; }

.theme-fandomdesktop-dark a:active { color:white; text-shadow: 1px 1px 10px white; }

.theme-fandomdesktop-light a:active { color:white; text-shadow: 1px 1px 10px black; }

/* TABBER */ .wds-tabs__wrapper.with-bottom-border { border-bottom: none }

.tabber .wds-tabs__tab:not(.wds-is-current) a:hover { background-color: rgba(153, 81, 240, 0.2); border-radius: 1em; padding:0px; transition: 0.3s; transform: translateY(-4px); }

.wds-tabs__tab.wds-is-current { background-color: rgba(153, 81, 240, 0.2); border-radius: 1em; padding:0px; box-shadow:none; transition: 0.3s; transform: translateY(0px); margin-top:3px; margin-bottom:3px; border-bottom: 2px dashed var(--theme-link-color); }

.wds-tabs__tab-label { height:25px !important; }

.theme-fandomdesktop-light .white .wds-tabs__tab-label { color:white }

.wds-tabs__tab a { height:50%; }

.tabber .wds-tabs__tab:not(.wds-is-current) { margin-bottom:3px; }

/* OTHER */ .theme-fandomdesktop-light hr { border-bottom:0.1px #cecece; border-image: linear-gradient(to top, #cecece, #cecece) 1; }

.theme-fandomdesktop-dark hr { border-bottom:0.1px #4d4d4d; border-image: linear-gradient(to top, #4d4d4d, #4d4d4d) 1; }

/* GALLERY */ .theme-fandomdesktop-dark .wikia-gallery-item { text-align: center; padding: 10px; margin: 5px; background-color: rgba(0,0,0,0.1); border-radius: 1em; }

.theme-fandomdesktop-light .wikia-gallery-item { text-align: center; padding: 10px; margin: 5px; background-color: #e8e4e4; border-radius: 1em; }

.wikia-gallery-item .thumb .gallery-image-wrapper { border-style:none; border-radius:1em; }

.wikia-gallery-position-left { text-align: center; }

.theme-fandomdesktop-dark .lightbox-caption { border-top: 1px solid #4d4d4d; border-bottom: 1px solid #4d4d4d; }

.theme-fandomdesktop-light .lightbox-caption { border-top: 1px solid #cecece; border-bottom: 1px solid #cecece; }

/* FROM CSS COOKBOOK */ .fandom-community-header__local-navigation .wds-dropdown__content {padding: 0 !important }

.fandom-community-header__local-navigation .wds-dropdown__content .wds-list.wds-is-linked > li { padding: 0 6px !important; }

/* RECENT IMAGES */ .theme-fandomdesktop-dark .recentImage__details-title { color: white; border-left:2px solid #4d4d4d; padding-left:3px; background:rgba(0,0,0,0.1); }

.theme-fandomdesktop-light .recentImage__details-title { color: black; border-left:2px solid #cecece; padding-left:3px; background:rgba(0,0,0,0.1); }

/* PROFILE TAGS */ background-color:yellow; color:black; }
 * 1) userProfileApp span.user-identity-header__tag.tag-👑_crown_challenger_👑 {

/* VIDEO EMBED */ div.thumbinner { background-image: linear-gradient(to right, #8c52ff 20%, #5D0DFC 100%); border: 3px solid; border-image: linear-gradient(to right, #8c52ff, #5D0DFC) 1; padding: 0px; border-radius: 5px 5px 5px 5px; }

.page-content .thumbcaption { color:white; }

/* SOURCE TEMPLATE */ .theme-fandomdesktop-dark .source { background:rgba(255,255,255,0.1); }

.theme-fandomdesktop-light .source { background:rgba(0,0,0,0.1); text-shadow:none !important; }