MediaWiki:Common.css

From :: ChromeRivals Wiki ::
Revision as of 16:32, 3 November 2022 by Ranzu (talk | contribs)
Jump to navigation Jump to search

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.
/* CSS placed here will be applied to all skins */
/* Page Appearance */
/* Top Panel */
div#mw-head {
    background: url("images/a/a5/Bg2.jpg") no-repeat scroll 0 0 black;
    background-size: cover;
}

/* Content */
#content {
margin-right: 40px;
background: url("images/f/ff/Bg3.jpg");
color: white;
}

/* Side Panel */
body, #globalWrapper {
background: url("images/a/a5/Bg2.jpg") no-repeat scroll 0 0 black; 
background-size: cover;
color: white;
}

/* Bottom Panel */
#footer {
background: linear-gradient(180deg, rgba(80, 37, 0, 0.73) 50%, rgba(80, 37, 0, 0.73) 25%, rgba(0, 0, 0, 0) 100%);
margin-right: 40px;
}
/* Page Appearance END */

/* FONTS */
/* Main Header FONT */
#firstHeading{ 
  color: white; 
  font-weight: normal;
  font-family: "Tahoma"; 
}

/* Main Header FONT */
.mw-body-content h2, .mw-body-content h3, .mw-body-content h4, .mw-body-content h5{
  font-family: "Arial";
  color: white; 
}

/* Main content text FONT */
body { 
  font-family: "Arial"; 
}
/* FONT END */

.mw-collapsible .mw-collapsible-toggle {
    float:left;
    margin-left:0;
    margin-right:1em;
}

.toclimit-2 .toclevel-1 ul,
.toclimit-3 .toclevel-2 ul,
.toclimit-4 .toclevel-3 ul,
.toclimit-5 .toclevel-4 ul,
.toclimit-6 .toclevel-5 ul,
.toclimit-7 .toclevel-6 ul {
	display: none;
}

.mw-collapsible-text, .toctogglelabel {color: #9b9b9b}

.toc {

border: 1px solid #aaa;

background: #2b2b2b;

padding: 5px;

font-size: 95%;

color: white;

}

#mw-navigation li{
background: none;
}
#mw-panel li a, #mw-panel li a:link, #mw-panel li link:visited, #mw-head li a, #mw-head li a:link, #mw-head li link:visited {
    color: cyan!important;
}

#mw-head li a:hover /* Hover over top bar*/
{
    color: #F1F0F0!important;
}

#mw-head li a:link:hover
{
    color: #F1F0F0!important;
}

#mw-panel li a:hover { /* Hover over sidebar*/
  color: #F1F0F0 !important;
}

#toc .tocnumber, #toc, #toc a:link, #toc a:visited, #toc .togtoggle {
    color: white!important;
}

#toc .toclevel-2 ul a:link, #toc .toclevel-2 ul a:visited {
color: #bdbdbd!important;
}
#toc a:link:hover  /*TOC Hover color */
{ 
  color:#AFAFAF!important
}

.toctogglelabel:hover  /*TOC [hide] Hover color */
{
  color:white!important;
  text-decoration: none
}

.navbox,
.navbox-subgroup {
    background: #2b2b2b;      /* Background color */
}

h1, h2, h3, h4, h5, h6, h7, h8, h9, h10, h11, h12 {
color: white;
}
/* Links OLD */
a:link { color: #bdbdbd!important; }
a:visited { color: #bdbdbd!important; }
:link:active, :link.new { color: #bdbdbd!important; }
:link.interwiki, :link.external { color: #bdbdbd!important; }
/* Links OLD END */

/* Links */
a:link
{ 
  color: #AFAFAF !important; 
  text-decoration: none;
}
a:visited 
{ 
  color: #bdbdbd!important; 
  text-decoration: none;
}
a:hover 
{
  color:#F1F0F0!important;
}
:link:active, 
:link.new 
{ 
  color: #bdbdbd!important;
  text-decoration: none;
}
:link.interwiki, 
:link.external 
{ 
  text-decoration: none;
}
.mw-parser-output a.external:hover /* Hover for external links*/
{ 
  text-decoration: none;
  color: #F1F0F0 !important;
}

/* Links END*/


#footer ul li {
    color: white;
}

#ca-viewsource { display: none !important; }

/* Sticky header*/
.sticky tr
{     
  position: sticky;     
  top: 0;     
  z-index: 2;
} 

.sticky tbody 
{     
  position: relative;     
  z-index: 1; 
}
/* Sticky header END*/

/* Hover over text to see more div class */
.hide {
  display: none;
}

.HoverHide:hover + .hide {
  display: block;;
}
/* Hover over text to see more div class END*/

/* Hover over image to see text */
.container {
  position: relative;
  width: 100%;
}
.overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  transition: .5s ease;
  background-color: rgba(0, 0, 0, 0.3);
  pointer-events: none;
}
.container:hover .overlay {
  opacity: 1;
}
.HoverImg {
  color: white;
  font-size: 30px;
  position: absolute;
  text-align: center;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
}
/* Hover over image to see text END */

/* Yeet the external link image */
.mw-parser-output a.external {
    background-image: url(/w/skins/Vector/resources/common/images/external-link-ltr-icon.svg?48e54);
	padding-right: 0px
}
/* Yeet the external link image END */

/* Disables spoilers. We need other way for this. Disable viewing of unused pictures
.mw-special-Unusedimages {
    display: none;
}

.mw-special-Uncategorizedimages { 
    display: none;
}

.mw-special-Listfiles {
    display: none;
}

.mw-special-Log {
    display: none;
}

.mw-special-Newimages {
    display: none;
}
Disables spoilers. END */

/* Removed tabs */
#ca-nstab-main { display: none !important; }
#ca-talk { display: none !important; }
#ca-history { display: none !important;}
#ca-view { display: none !important; }
#p-tb { display: none; }
/* Removed tabs END */

/* Sidebar Header color change */
.portal h3
{
  color: white;
}
/* Sidebar Header color change END*/

/* Remove the category block (iframe/other extenstion at the bottom of the page) */
.catlinks
{
  display:none;
}
/* Remove the category block END */

/* Tabber */
/* Tabber Line Remove */
.tabber__header {
    box-shadow: inset 0 0px 0 0 #a2a9b1;
}

/* Tabber Indicator Global*/
.tabber__indicator {
block-size: 5px;
}

/* Longer Tabber Headers*/
.tabber__tab {
    padding: 0.5em 2.602em;
}

.tabber__header__prev{
  background-color:rgba(255,255,255,0.4);
}
/* Tabber Arrows color*/
.tabber__header__next {
  background-color:rgba(255,255,255,0.4);
}

/* Shorter-scrollable Tabber */
.tabber__section {
  height: 793px!important;
  overflow-y: auto!important;
}
/* Tabber END */

/* Custom Table - TableShops */
/* Table Global*/
.TableShops {
border-collapse: collapse;
}

/* Table Header*/
.TableShops tr {
background-color: gray;

}

/* Table Data*/
.TableShops>*>tr>td {
font-family: Arial, Helvetica, sans-serif;
background-color: #6C6C6C;
border: none;
color: white;
padding: 10px;
transition: background-color .3s ease-in-out;
border-bottom: 1px solid black;
}

/* Table Data Hover*/
.TableShops td:hover {
background-color: #ADABAB;
}

/* Table Data Hover cell=row*/
.TableShops>*>tr:has(td:hover) td {
background-color: #ADABAB;
}

.TableShops{
  cursor: pointer;
}
/* Custom Table - TableShops END*/

/* Custom Table - EnchantTable */
/* Table Global*/
.EnchantTable {
border-collapse: collapse;
width: 150px;
text-align: center;
}

/* Table Header*/
.EnchantTable tr {
background-color: gray;
}

/* Table Data*/
.EnchantTable>*>tr>td {
font-family: Arial, Helvetica, sans-serif;
background-color: #6C6C6C;
color: white;
padding: 2px;
transition: background-color .3s ease-in-out;
border-top: 1px solid black;
width: 80px;
 
}

/* Table Data Hover*/
.EnchantTable td:hover {
background-color: #ADABAB;
}

/* Table Data Hover cell=row*/
.EnchantTable>*>tr:has(td:hover) td {
background-color: #ADABAB;
}
/* Custom Table - EnchantTable END */

/* Custom Table - BreakPointsTable */
/* Table Global*/
.BreakPointsTable {
  border-collapse: collapse;
  width: 90px;
  
}

/* Table Header*/
.BreakPointsTable tr {
  background-color: gray;
  border: 1px solid black;
}

/* Table Data*/
.BreakPointsTable>*>tr>td {
  font-family: Arial, Helvetica, sans-serif;
  background-color: #6C6C6C;
  color: white;
  padding: 1px;
  transition: background-color .3s ease-in-out;
  border: 1px solid black;
  width: 80px;
 
}

/* Table Data Hover*/
.BreakPointsTable td:hover {
  background-color: #ADABAB;
}

/* Table Data Hover cell=row*/
.BreakPointsTable>*>tr:has(td:hover) td {
  background-color: #ADABAB;
}
/* Custom Table - BreakPointsTable END */