Difference between revisions of "MediaWiki:Darkvector.css"

From Captain of Industry Wiki
Jump to: navigation, search
(typo fixes)
(comment out 24px for speed testing)
Line 90: Line 90:
[class^="sprite-"] { display: inline-block; vertical-align: middle; margin-top: -3px; }
[class^="sprite-"] { display: inline-block; vertical-align: middle; margin-top: -3px; }
[class^="sprite-16-"] { width: 16px; height: 16px; }
[class^="sprite-16-"] { width: 16px; height: 16px; }
[class^="sprite-24-"] { width: 24px; height: 24px; }
/* [class^="sprite-24-"] { width: 24px; height: 24px; } */


.sprite-16-Acid { background: url('images/f/f0/Sprite-16.png') -1px -1px }
.sprite-16-Acid { background: url('images/f/f0/Sprite-16.png') -1px -1px }

Revision as of 11:35, 26 January 2022

/* CSS placed here will affect users of the DarkVector skin ONLY */

/* Restore font size from 0.875em to full size */

.mw-body-content {
  font-size: 1em;
}


/* Darken background color slightly (almost imperceptibly for a normally-sighted person) */
/*   to make it possible to meet W3 WCAGC AAA standards                                  */

body { background-color: #222222; }
#mw-head { background-color: #222222; }

.mw-body { background-color: #2c2c2c; }
.editOptions { background-color: #2c2c2c; }
#mw-page-base { background-color: #2c2c2c; }
#left-navigation div.darkvectorTabs li.selected,#right-navigation div.darkvectorTabs li.selected { background-color: #2c2c2c; }


/* Re-color links from default Darkvector orange to the official in-game orange */
/*    Contrast ratio: 6.34 : 1 (before), 7.03 : 1 (after)                       */

a { color: #fea416 !important; }

/* Prevent darkening of visited links for accessibility (contrast) reasons */
/*    Contrast ratio: 3.71 : 1 (before), 7.03 : 1 (after)                  */

a:visited { color: #fea416 !important; }

/* Re-color "redlinks" for accessibility (contrast) reasons */
/*    Contrast ratio: 3.00 : 1 (before), 5.19 : 1 (after)   */

a.new { color: #ff7070 !important; }


/* Re-color left nav menu headers for accessibility (contrast) reasons */
/*    Contrast ratio: 3.35 : 1 (before), 7.04 : 1 (after)              */

div#mw-panel div.portal h3 { color: #b8b8b8; }


/* Re-color search box and form buttons for accessibility (contrast) reasons */
/*    Contrast ratio: 4.77 : 1 (before), 7.03 : 1 (after)                    */

div#simpleSearch #searchButton { background-color: rgba(255,164,22,.75) !important; }
.oo-ui-textInputWidget input, .oo-ui-textInputWidget textarea, .oo-ui-tagMultiselectWidget-handle, div#simpleSearch #searchInput {
    background-color: #444444 !important;
    color: #DBDBDB !important;
}
.oo-ui-buttonElement-button, .mw-ui-button {
    color: #ffffff !important;
    background-color: #ffa416 !important;
    border-color: #ffa416 !important;
}
a[role=button] { color: #2b2b2b !important; }


/* Re-color footer legal text for accessibility (contrast) reasons */
/*    Contrast ratio: 3.35 : 1 (before), 7.04 : 1 (after)          */

#footer ul li { color: #b8b8b8 !important; }


/* De-color self-links because why did they design this skin to do this?! */

a.mw-selflink { color: inherit !important; }


/* Style <code> blocks */

code {
    width: auto;
    height: auto;
    padding: .2em;
    margin: -.2em 0;
    border: none;
    border-radius: 5px;
    font-family: Consolas, Andale Mono WT, DejaVu Sans Mono, Ubuntu Monospace, Courier New, monospace;
    text-indent: 0;
    white-space: pre-wrap;
    background-color: rgba(128,128,128,0.25);
}




.iconglow [class^="sprite-"] { filter: drop-shadow(0 0 1px rgba(255,255,255,1)) }
[class^="sprite-"] { display: inline-block; vertical-align: middle; margin-top: -3px; }
[class^="sprite-16-"] { width: 16px; height: 16px; }
/* [class^="sprite-24-"] { width: 24px; height: 24px; } */

.sprite-16-Acid { background: url('images/f/f0/Sprite-16.png') -1px -1px }
.sprite-16-AirPollution { background: url('images/f/f0/Sprite-16.png') -19px -1px }
.sprite-16-Aluminum { background: url('images/f/f0/Sprite-16.png') -1px -19px }
.sprite-16-MoltenAluminum { background: url('images/f/f0/Sprite-16.png') -19px -19px }
.sprite-16-Ammonia { background: url('images/f/f0/Sprite-16.png') -37px -1px }
.sprite-16-Bauxite { background: url('images/f/f0/Sprite-16.png') -37px -19px }
.sprite-16-Bedrock { background: url('images/f/f0/Sprite-16.png') -1px -37px }
.sprite-16-Brine { background: url('images/f/f0/Sprite-16.png') -19px -37px }
.sprite-16-CarbonDioxide { background: url('images/f/f0/Sprite-16.png') -37px -37px }
.sprite-16-Cement { background: url('images/f/f0/Sprite-16.png') -55px -1px }
.sprite-16-Chlorine { background: url('images/f/f0/Sprite-16.png') -55px -19px }
.sprite-16-Coal { background: url('images/f/f0/Sprite-16.png') -55px -37px }
.sprite-16-ConcreteSlab { background: url('images/f/f0/Sprite-16.png') -1px -55px }
.sprite-16-ConstructionParts { background: url('images/f/f0/Sprite-16.png') -37px -55px }
.sprite-16-ConstructionPartsII { background: url('images/f/f0/Sprite-16.png') -55px -55px }
.sprite-16-ConstructionPartsIII { background: url('images/f/f0/Sprite-16.png') -73px -1px }
.sprite-16-ConstructionPartsIV { background: url('images/f/f0/Sprite-16.png') -73px -19px }
.sprite-16-Copper { background: url('images/f/f0/Sprite-16.png') -73px -37px }
.sprite-16-CopperOreCrushed { background: url('images/f/f0/Sprite-16.png') -73px -55px }
.sprite-16-ImpureCopper { background: url('images/f/f0/Sprite-16.png') -1px -73px }
.sprite-16-CopperOre { background: url('images/f/f0/Sprite-16.png') -19px -73px }
.sprite-16-MoltenCopper { background: url('images/f/f0/Sprite-16.png') -37px -73px }
.sprite-16-Diesel { background: url('images/f/f0/Sprite-16.png') -55px -73px }
.sprite-16-Digestate { background: url('images/f/f0/Sprite-16.png') -73px -73px }
.sprite-16-Dirt { background: url('images/f/f0/Sprite-16.png') -91px -1px }
.sprite-16-Drugs { background: url('images/f/f0/Sprite-16.png') -91px -19px }
.sprite-16-Electricity { background: url('images/f/f0/Sprite-16.png') -91px -37px }
.sprite-16-Electronics { background: url('images/f/f0/Sprite-16.png') -91px -55px }
.sprite-16-ElectronicsII { background: url('images/f/f0/Sprite-16.png') -91px -73px }
.sprite-16-Exhaust { background: url('images/f/f0/Sprite-16.png') -1px -91px }
.sprite-16-Fertilizer { background: url('images/f/f0/Sprite-16.png') -19px -91px }
.sprite-16-FilterMedia { background: url('images/f/f0/Sprite-16.png') -37px -91px }
.sprite-16-Food { background: url('images/f/f0/Sprite-16.png') -55px -91px }
.sprite-16-FuelGas { background: url('images/f/f0/Sprite-16.png') -73px -91px }
.sprite-16-Glass { background: url('images/f/f0/Sprite-16.png') -91px -91px }
.sprite-16-GlassMix { background: url('images/f/f0/Sprite-16.png') -109px -1px }
.sprite-16-MoltenGlass { background: url('images/f/f0/Sprite-16.png') -109px -19px }
.sprite-16-Gold { background: url('images/f/f0/Sprite-16.png') -109px -37px }
.sprite-16-GoldOre { background: url('images/f/f0/Sprite-16.png') -109px -55px }
.sprite-16-GoldOreConcentrate { background: url('images/f/f0/Sprite-16.png') -109px -73px }
.sprite-16-GoldOreCrushed { background: url('images/f/f0/Sprite-16.png') -109px -91px }
.sprite-16-GoldOrePowder { background: url('images/f/f0/Sprite-16.png') -1px -109px }
.sprite-16-Graphite { background: url('images/f/f0/Sprite-16.png') -19px -109px }
.sprite-16-Gravel { background: url('images/f/f0/Sprite-16.png') -37px -109px }
.sprite-16-HouseholdElectronics { background: url('images/f/f0/Sprite-16.png') -55px -109px }
.sprite-16-HouseholdGoods { background: url('images/f/f0/Sprite-16.png') -73px -109px }
.sprite-16-Hydrogen { background: url('images/f/f0/Sprite-16.png') -91px -109px }
.sprite-16-Iron { background: url('images/f/f0/Sprite-16.png') -109px -109px }
.sprite-16-IronOreCrushed { background: url('images/f/f0/Sprite-16.png') -127px -1px }
.sprite-16-MoltenIron { background: url('images/f/f0/Sprite-16.png') -127px -19px }
.sprite-16-IronOre { background: url('images/f/f0/Sprite-16.png') -127px -37px }
.sprite-16-Limestone { background: url('images/f/f0/Sprite-16.png') -127px -55px }
.sprite-16-MaintenanceI { background: url('images/f/f0/Sprite-16.png') -127px -73px }
.sprite-16-MaintenanceII { background: url('images/f/f0/Sprite-16.png') -127px -91px }
.sprite-16-MechanicalPower { background: url('images/f/f0/Sprite-16.png') -127px -109px }
.sprite-16-MetalScrap { background: url('images/f/f0/Sprite-16.png') -1px -127px }
.sprite-16-Microchips { background: url('images/f/f0/Sprite-16.png') -19px -127px }
.sprite-16-Naphtha { background: url('images/f/f0/Sprite-16.png') -37px -127px }
.sprite-16-Nitrogen { background: url('images/f/f0/Sprite-16.png') -55px -127px }
.sprite-16-HeavyOil { background: url('images/f/f0/Sprite-16.png') -73px -127px }
.sprite-16-CrudeOil { background: url('images/f/f0/Sprite-16.png') -91px -127px }
.sprite-16-LightOil { background: url('images/f/f0/Sprite-16.png') -109px -127px }
.sprite-16-MediumOil { background: url('images/f/f0/Sprite-16.png') -127px -127px }
.sprite-16-Oxygen { background: url('images/f/f0/Sprite-16.png') -145px -1px }
.sprite-16-PCB { background: url('images/f/f0/Sprite-16.png') -145px -19px }
.sprite-16-Penicillin { background: url('images/f/f0/Sprite-16.png') -145px -37px }
.sprite-16-Plastic { background: url('images/f/f0/Sprite-16.png') -145px -55px }
.sprite-16-Quartz { background: url('images/f/f0/Sprite-16.png') -145px -73px }
.sprite-16-Rock { background: url('images/f/f0/Sprite-16.png') -145px -91px }
.sprite-16-Rubber { background: url('images/f/f0/Sprite-16.png') -145px -109px }
.sprite-16-Salt { background: url('images/f/f0/Sprite-16.png') -145px -127px }
.sprite-16-Sand { background: url('images/f/f0/Sprite-16.png') -1px -145px }
.sprite-16-Seawater { background: url('images/f/f0/Sprite-16.png') -19px -145px }
.sprite-16-SiliconPoly { background: url('images/f/f0/Sprite-16.png') -37px -145px }
.sprite-16-MoltenSilicon { background: url('images/f/f0/Sprite-16.png') -55px -145px }
.sprite-16-Slag { background: url('images/f/f0/Sprite-16.png') -73px -145px }
.sprite-16-SlagCrushed { background: url('images/f/f0/Sprite-16.png') -91px -145px }
.sprite-16-Sludge { background: url('images/f/f0/Sprite-16.png') -109px -145px }
.sprite-16-SpentFuel { background: url('images/f/f0/Sprite-16.png') -127px -145px }
.sprite-16-SourWater { background: url('images/f/f0/Sprite-16.png') -145px -145px }
.sprite-16-SolarCell { background: url('images/f/f0/Sprite-16.png') -163px -1px }
.sprite-16-SteamDepleted { background: url('images/f/f0/Sprite-16.png') -163px -19px }
.sprite-16-SteamHi { background: url('images/f/f0/Sprite-16.png') -163px -37px }
.sprite-16-SteamLo { background: url('images/f/f0/Sprite-16.png') -163px -55px }
.sprite-16-Steel { background: url('images/f/f0/Sprite-16.png') -163px -73px }
.sprite-16-MoltenSteel { background: url('images/f/f0/Sprite-16.png') -163px -91px }
.sprite-16-Sugar { background: url('images/f/f0/Sprite-16.png') -163px -109px }
.sprite-16-Sulfur { background: url('images/f/f0/Sprite-16.png') -163px -127px }
.sprite-16-ToxicSlurry { background: url('images/f/f0/Sprite-16.png') -163px -145px }
.sprite-16-UraniumOre { background: url('images/f/f0/Sprite-16.png') -1px -163px }
.sprite-16-UraniumOreCrushed { background: url('images/f/f0/Sprite-16.png') -19px -163px }
.sprite-16-UraniumPellets { background: url('images/f/f0/Sprite-16.png') -37px -163px }
.sprite-16-UraniumRod { background: url('images/f/f0/Sprite-16.png') -55px -163px }
.sprite-16-WasteWater { background: url('images/f/f0/Sprite-16.png') -73px -163px }
.sprite-16-Water { background: url('images/f/f0/Sprite-16.png') -91px -163px }
.sprite-16-WaterPollution { background: url('images/f/f0/Sprite-16.png') -109px -163px }
.sprite-16-Wood { background: url('images/f/f0/Sprite-16.png') -127px -163px }
.sprite-16-YellowCake { background: url('images/f/f0/Sprite-16.png') -145px -163px }

.sprite-24-Acid { background: url('images/2/20/Sprite-24.png') -1px -1px }
.sprite-24-AirPollution { background: url('images/2/20/Sprite-24.png') -27px -1px }
.sprite-24-Aluminum { background: url('images/2/20/Sprite-24.png') -1px -27px }
.sprite-24-MoltenAluminum { background: url('images/2/20/Sprite-24.png') -27px -27px }
.sprite-24-Ammonia { background: url('images/2/20/Sprite-24.png') -53px -1px }
.sprite-24-Bauxite { background: url('images/2/20/Sprite-24.png') -53px -27px }
.sprite-24-Bedrock { background: url('images/2/20/Sprite-24.png') -1px -53px }
.sprite-24-Brine { background: url('images/2/20/Sprite-24.png') -27px -53px }
.sprite-24-CarbonDioxide { background: url('images/2/20/Sprite-24.png') -53px -53px }
.sprite-24-Cement { background: url('images/2/20/Sprite-24.png') -79px -1px }
.sprite-24-Chlorine { background: url('images/2/20/Sprite-24.png') -79px -27px }
.sprite-24-Coal { background: url('images/2/20/Sprite-24.png') -79px -53px }
.sprite-24-ConcreteSlab { background: url('images/2/20/Sprite-24.png') -1px -79px }
.sprite-24-ConstructionParts { background: url('images/2/20/Sprite-24.png') -53px -79px }
.sprite-24-ConstructionPartsI { background: url('images/2/20/Sprite-24.png') -79px -79px }
.sprite-24-ConstructionPartsII { background: url('images/2/20/Sprite-24.png') -105px -1px }
.sprite-24-ConstructionPartsIV { background: url('images/2/20/Sprite-24.png') -105px -27px }
.sprite-24-Copper { background: url('images/2/20/Sprite-24.png') -105px -53px }
.sprite-24-CopperCrushed { background: url('images/2/20/Sprite-24.png') -105px -79px }
.sprite-24-ImpureCopper { background: url('images/2/20/Sprite-24.png') -1px -105px }
.sprite-24-CopperMolten { background: url('images/2/20/Sprite-24.png') -27px -105px }
.sprite-24-CopperOre { background: url('images/2/20/Sprite-24.png') -53px -105px }
.sprite-24-Diesel { background: url('images/2/20/Sprite-24.png') -79px -105px }
.sprite-24-Digestate { background: url('images/2/20/Sprite-24.png') -105px -105px }
.sprite-24-Dirt { background: url('images/2/20/Sprite-24.png') -131px -1px }
.sprite-24-Drugs { background: url('images/2/20/Sprite-24.png') -131px -27px }
.sprite-24-Electricity { background: url('images/2/20/Sprite-24.png') -131px -53px }
.sprite-24-Electronics { background: url('images/2/20/Sprite-24.png') -131px -79px }
.sprite-24-ElectronicsII { background: url('images/2/20/Sprite-24.png') -131px -105px }
.sprite-24-Exhaust { background: url('images/2/20/Sprite-24.png') -1px -131px }
.sprite-24-Fertilizer { background: url('images/2/20/Sprite-24.png') -27px -131px }
.sprite-24-FilterMedia { background: url('images/2/20/Sprite-24.png') -53px -131px }
.sprite-24-Food { background: url('images/2/20/Sprite-24.png') -79px -131px }
.sprite-24-FuelGas { background: url('images/2/20/Sprite-24.png') -105px -131px }
.sprite-24-Glass { background: url('images/2/20/Sprite-24.png') -131px -131px }
.sprite-24-GlassMix { background: url('images/2/20/Sprite-24.png') -157px -1px }
.sprite-24-MoltenGlass { background: url('images/2/20/Sprite-24.png') -157px -27px }
.sprite-24-Gold { background: url('images/2/20/Sprite-24.png') -157px -53px }
.sprite-24-GoldOre { background: url('images/2/20/Sprite-24.png') -157px -79px }
.sprite-24-GoldOreConcentrate { background: url('images/2/20/Sprite-24.png') -157px -105px }
.sprite-24-GoldOreCrushed { background: url('images/2/20/Sprite-24.png') -157px -131px }
.sprite-24-GoldOrePowder { background: url('images/2/20/Sprite-24.png') -1px -157px }
.sprite-24-Graphite { background: url('images/2/20/Sprite-24.png') -27px -157px }
.sprite-24-Gravel { background: url('images/2/20/Sprite-24.png') -53px -157px }
.sprite-24-HouseholdElectronics { background: url('images/2/20/Sprite-24.png') -79px -157px }
.sprite-24-HouseholdGoods { background: url('images/2/20/Sprite-24.png') -105px -157px }
.sprite-24-Hydrogen { background: url('images/2/20/Sprite-24.png') -131px -157px }
.sprite-24-Iron { background: url('images/2/20/Sprite-24.png') -157px -157px }
.sprite-24-IronOreCrushed { background: url('images/2/20/Sprite-24.png') -183px -1px }
.sprite-24-IronMolten { background: url('images/2/20/Sprite-24.png') -183px -27px }
.sprite-24-IronOre { background: url('images/2/20/Sprite-24.png') -183px -53px }
.sprite-24-Limestone { background: url('images/2/20/Sprite-24.png') -183px -79px }
.sprite-24-MaintenanceI { background: url('images/2/20/Sprite-24.png') -183px -105px }
.sprite-24-MaintenanceII { background: url('images/2/20/Sprite-24.png') -183px -131px }
.sprite-24-MechanicalPower { background: url('images/2/20/Sprite-24.png') -183px -157px }
.sprite-24-MetalScrap { background: url('images/2/20/Sprite-24.png') -1px -183px }
.sprite-24-Microchips { background: url('images/2/20/Sprite-24.png') -27px -183px }
.sprite-24-Naphtha { background: url('images/2/20/Sprite-24.png') -53px -183px }
.sprite-24-Nitrogen { background: url('images/2/20/Sprite-24.png') -79px -183px }
.sprite-24-CrudeOil { background: url('images/2/20/Sprite-24.png') -105px -183px }
.sprite-24-HeavyOil { background: url('images/2/20/Sprite-24.png') -131px -183px }
.sprite-24-LightOil { background: url('images/2/20/Sprite-24.png') -157px -183px }
.sprite-24-MediumOil { background: url('images/2/20/Sprite-24.png') -183px -183px }
.sprite-24-Oxygen { background: url('images/2/20/Sprite-24.png') -209px -1px }
.sprite-24-PCB { background: url('images/2/20/Sprite-24.png') -209px -27px }
.sprite-24-Penicillin { background: url('images/2/20/Sprite-24.png') -209px -53px }
.sprite-24-Plastic { background: url('images/2/20/Sprite-24.png') -209px -79px }
.sprite-24-Quartz { background: url('images/2/20/Sprite-24.png') -209px -105px }
.sprite-24-Rock { background: url('images/2/20/Sprite-24.png') -209px -131px }
.sprite-24-Rubber { background: url('images/2/20/Sprite-24.png') -209px -157px }
.sprite-24-Salt { background: url('images/2/20/Sprite-24.png') -209px -183px }
.sprite-24-Sand { background: url('images/2/20/Sprite-24.png') -1px -209px }
.sprite-24-SiliconPoly { background: url('images/2/20/Sprite-24.png') -27px -209px }
.sprite-24-Seawater { background: url('images/2/20/Sprite-24.png') -53px -209px }
.sprite-24-MoltenSilicon { background: url('images/2/20/Sprite-24.png') -79px -209px }
.sprite-24-Slag { background: url('images/2/20/Sprite-24.png') -105px -209px }
.sprite-24-SlagCrushed { background: url('images/2/20/Sprite-24.png') -131px -209px }
.sprite-24-Sludge { background: url('images/2/20/Sprite-24.png') -157px -209px }
.sprite-24-SolarCell { background: url('images/2/20/Sprite-24.png') -183px -209px }
.sprite-24-SpentFuel { background: url('images/2/20/Sprite-24.png') -209px -209px }
.sprite-24-SourWater { background: url('images/2/20/Sprite-24.png') -235px -1px }
.sprite-24-SteamDepleted { background: url('images/2/20/Sprite-24.png') -235px -27px }
.sprite-24-SteamHi { background: url('images/2/20/Sprite-24.png') -235px -53px }
.sprite-24-SteamLo { background: url('images/2/20/Sprite-24.png') -235px -79px }
.sprite-24-Steel { background: url('images/2/20/Sprite-24.png') -235px -105px }
.sprite-24-MoltenSteel { background: url('images/2/20/Sprite-24.png') -235px -131px }
.sprite-24-Sugar { background: url('images/2/20/Sprite-24.png') -235px -157px }
.sprite-24-Sulfur { background: url('images/2/20/Sprite-24.png') -235px -183px }
.sprite-24-ToxicSlurry { background: url('images/2/20/Sprite-24.png') -235px -209px }
.sprite-24-UraniumOre { background: url('images/2/20/Sprite-24.png') -1px -235px }
.sprite-24-UraniumOreCrushed { background: url('images/2/20/Sprite-24.png') -27px -235px }
.sprite-24-UraniumPellets { background: url('images/2/20/Sprite-24.png') -53px -235px }
.sprite-24-UraniumRod { background: url('images/2/20/Sprite-24.png') -79px -235px }
.sprite-24-WasteWater { background: url('images/2/20/Sprite-24.png') -105px -235px }
.sprite-24-Water { background: url('images/2/20/Sprite-24.png') -131px -235px }
.sprite-24-WaterPollution { background: url('images/2/20/Sprite-24.png') -157px -235px }
.sprite-24-Wood { background: url('images/2/20/Sprite-24.png') -183px -235px }
.sprite-24-YellowCake { background: url('images/2/20/Sprite-24.png') -209px -235px }