MediaWiki:Hydradark.css

/* CSS placed here will affect users of the HydraDark skin

/* darken background */ html{ background: url("/media/c/c7/Terraria_mushroom_background.jpg") no-repeat fixed center top / cover rgb(0, 0, 0); } html body { background: rgba(0, 0, 0, 0.5); }

/* -- */ /* layout style for all page */ /*tab*/ div.vectorMenu li a { color:#19999e; }

/* Sidebar */ div#p-personal h5 { color:#FFFFFF; } div#p-personal a { color: #FFFFFF; } div#p-personal a:hover { color: #FFFFFF; } div#mw-panel div.portal h3, color: #FFFFFF; }
 * 1) mw-panel.collapsible-nav .portal h3 a,
 * 2) mw-panel.collapsible-nav .portal h3 a:visited,
 * 3) mw-panel.collapsible-nav .portal.collapsed h3 a,
 * 4) mw-panel.collapsible-nav .portal.collapsed h3 a:visited {

div#mw-panel div.portal div.body ul li a:visited { color: #FFFFFF; } div#mw-panel div.portal div.body ul li a { color: #FFFFFF; } div.vectorTabs li a, div.vectorTabs li a span, div.vectorMenu li a, div#mw-panel div.portal div.body ul li a:link{ color: #FFFFFF !important; } /* Content */ div#content { box-shadow: 0 0 2px rgba(200,200,200,0.7); background-color: #202020; color: #ffffff; }

h1, h2, h3, h4, h5, h6 { color: #ffffff; } legend { color: white; }  border: 1px solid #808080; background-color: #181818; } ul#filetoc { border: 1px solid #808080; }  color:#19999e; } div#content a:visited{ color:#19999e; } a:visited, div#content a.external:visited, div#content a.extiw:visited{ color:#19999e; }   color: #ffffff; } /*override overrided color*/ div.vectorTabs li a:hover, div.vectorTabs li a:hover span{ color: #fff !important; } div.vectorTabs li.selected a, div.vectorTabs li.selected a:visited{ color: #fff !important; } div#footer ul li{ color: #fff; } /* -- */
 * toc, .toc, .mw-warning {
 * 1) content a{
 * 1) content a.mw-selflink{

background: rgba(0,0,0,0.5); box-shadow: inset 0 0 10px rgba(0,0,0,0.3); box-shadow: 0 0 2px rgba(200,200,200,0.3); }	background: rgba(0,0,0,0.5); box-shadow: inset 0 0 10px rgba(0,0,0,0.3); box-shadow: 0 0 2px rgba(200,200,200,0.3); }	background: rgba(0,0,0,0.5); box-shadow: inset 0 0 10px rgba(0,0,0,0.3); box-shadow: 0 0 2px rgba(200,200,200,0.3); } /* Desktop view for mobile screen. */ @media(max-width: 980px) { #menu-toggle-button { background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiB3aWR0aD0iMjQiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggY2xhc3M9Imhlcm9pY29uLXVpIiBzdHJva2U9IndoaXRlIiBmaWxsPSJ3aGl0ZSIgZD0iTTQgNWgxNmExIDEgMCAwIDEgMCAySDRhMSAxIDAgMSAxIDAtMnptMCA2aDE2YTEgMSAwIDAgMSAwIDJINGExIDEgMCAwIDEgMC0yem0wIDZoMTZhMSAxIDAgMCAxIDAgMkg0YTEgMSAwIDAgMSAwLTJ6Ii8+PC9zdmc+); }   div#mw-navigation div#mw-panel { background: rgba(0, 0, 0, 0.9); }   }
 * 1) footer{
 * 1) mw-panel .portal{
 * 1) mw-head{

/* -- */ /* Wiki editor fixes */ .wikiEditor-ui-tabs div a { background: #303030; /* you can use a gradient here if you want to get fancy */ } .wikiEditor-ui-tabs div.current { background-color: #303030; } textarea { background: #101010 !important; color: white !important; } /* -- */

/* -- */ /* Tables */ table { color: #ffffff; /* we don't want the bottom borders of s to be visible through floated tables */ background-color: #202020; } /* "terraria"-classed tables */ table.terraria { background: #383838; border-color: #808080; } .terraria th { background: #606060; color: fff; } .terraria caption { background: #606060; } .terraria > caption { border-color: #383838; box-shadow: 0 0 0 1px #808080; } .terraria > caption:after { background: #383838; border-left-color: #383838; border-right-color: #383838; } /* Auto line separators for tables */ table.lined td { border-bottom-color:#808080; } table tr.bottomline td { border-bottom-color:#808080; } table tr.topline td { border-top-color:#808080; } table.inner th { border:2px solid #606060; } /* -- */

/* -- */ /* Other "plaincollapse" styling */ .plaincollapse .mw-collapsible-toggle a, .plaincollapse .mw-collapsible-toggle  a:link, .plaincollapse .mw-collapsible-toggle a:visited, .plaincollapse .mw-collapsible-toggle a:hover { color:#19999e; } /* -- */

/* -- */ /* banner box */ .notice-banner>div{ border-color:#ccc; background-color: #606060; color: #fff; } /* -- */

/* ================================================================== */ /* Template-related styles */ /* ================================================================== */

/* -- */ /* For Template:Heading, mainly used in main page. */ div.heading{ background: #505050; color: #ccc; } /* -- */

/* -- item link - */ .item-link .id{ background-color:#606060; }

.item-link .note { color: #fff; font-size: 85.7142%; /*12px/14px*/ } /* -- */

/* -- crafts table -- */ div.crafts .wrap{ background: #303030; border-color: #808080; } div.crafts .wrap::after{ background: #383838; } div.crafts table::after { background: #383838; } div.crafts caption{ background: #606060; } div.crafts th{ background: #606060; border-right-color: #383838; border-left-color: #383838; } div.crafts td{ border-left-color: #808080; border-bottom-color: #808080; }

/* -- */

/* -- */ /* navbox */ .navbox{ border-color: 1px solid #808080; } .navbox > .header{ background: #383838; } .navbox > .vde { color: #ccc; } .navbox > .mw-collapsible-toggle:before{ border-left-color: #E4F0F7; border-top-color: #E4F0F7; } .navbox > .mw-collapsible-toggle.mw-collapsible-toggle-collapsed:before{ border-right-color: #E4F0F7; border-bottom-color: #E4F0F7; } .navbox .navbox > .mw-collapsible-toggle:before{ border-left-color: #E4F0F7; border-top-color: #E4F0F7; } .navbox .navbox > .mw-collapsible-toggle.mw-collapsible-toggle-collapsed:before{ border-right-color: #E4F0F7; border-bottom-color: #E4F0F7; } .navbox .h1::after{ border-bottom-color: #808080; } /* -- */

/* -- Infobox & infobox wrapper template style -- */ /* some rules just kept for "old" template. */ .infobox.bordered td, .infobox.bordered th { border-color: #808080; } /* styles for latest template */ .infobox{ border-color: #808080; background-color: #383838; } .infobox table th{ border-right-color: #383838; } .infobox .title{ background-color: #606060; color: #fff; } .infobox > .title > span{ color: #ccc; } .infobox .variant{ background-color: #606060; color: #ccc; } .infobox tr.buff th, .infobox tr.buff td{ background-color: #606060; border-color: #383838; } .infobox .section.ids{ border-top-color: #999; background-color: #606060; color: #ccc; } .infobox .section.ids li{ border-bottom-color: #f9f9f9; } .infobox .drops.items th{ background-color: #606060; color: #ccc; }

.infobox .drops.items td{ border-top-color: #808080; } .infobox .drops tr.caption td{ border-top-color: #606060; color:#fff; background:#606060; } .infobox .drops tr.group_end td{ border-bottom-color:#808080; } .infobox .drops tr.group_end td::after{ background-color: #383838; } /* for item infobox */ .item.infobox .images ul.inline li::before{ background: #666; } .item.infobox .images ul.block li::before{ background: #666; } /* -- */

/* */ .infocard{ border: 1px solid #808080; background: #202020; color: #fff; } .infocard > .card .image{ background: #808080; border-left: 1px solid #202020; border-right: 1px solid #202020; } .infocard > .card .content{ border: 1px solid #808080; background: #202020; } .infocard .main-heading{ background:#606060; border-right-color:#606060; } .infocard .main-heading .hgroup{ background: #202020; color: #fff; } .infocard .main-heading .hgroup > .main{ color: #fff; } .infocard .main-heading .hgroup > .main span{ color: #ccc; } .infocard .box{ border: 1px solid #606060; background: #383838; } .infocard.terraria{ background: #fcfcfc; border-color: #AFCFE2; } .infocard.terraria .main-heading .hgroup{ background: #202020; }

/* ========================================================================== */ /* === New flex mainpage styles ============================================= */ /* ========================================================================== */  background:#202020; }  color: #E4F0F7; background: #202020; border-color: #606060; box-shadow: 0 0 0 1px #808080; }  border-right-color: #E4F0F7; border-bottom-color: #E4F0F7; }  border-left-color: #E4F0F7; border-top-color: #E4F0F7; }  background: #202020; }  color: #19999e; }  color: #bbb; } .fp-box { border-color: #808080; }  border-color: #808080; background:#606060; } /* ========================================================================== */ /* === New flex mainpage styles end ========================================= */ /* ========================================================================== */
 * 1) mainpage-global-wrapper {
 * 1) mf-wikiheader{
 * 1) mf-wikiheader-toggle-link :first-child::before{
 * 1) mf-wikiheader-toggle-link :last-child::before{
 * 1) mf-wikiheader .related-info{
 * 1) latest-version a.external{
 * 1) latest-version ul li > div > small{
 * 1) mainpage-global-wrapper .footer > div{

/* Page history */ div#pagehistory li.selected { background-color: transparent; border: none; } div#pagehistory li { background-color: transparent; border: none; } table.diff { background: transparent; } td.diff-context { background: none repeat scroll 0 0 transparent; color: #ffffff; } td.diff-deletedline { background-color: #FFE49C; border-color: #FFE49C; color: #000000; } td.diff-addedline { background-color: #0085ff; border-color: #0085ff; color: #000000; } /* -- */

/* Expert */ .expert { color:#FFBA75; cursor:pointer; }

.feature, .documentation { background: #383838; border: 1px solid rgba(0, 0, 0, 0.2); border-radius: 5px; padding: 10px; } /* -- */

/* note text, Template:note, Template:item, etc. */ .note-text { color: #fff; }

/* Highlight fields inside code class (eg. Template:Code) */ .code .mw-highlight{ background: #282828 !important; }

/* Special:Preferences */ .skin-hydradark #preftoc a, .skin-hydradark #preftoc a:active { color: #19999e; }

/* Thumbnail background for images */ html .thumbimage { background-color: #181818; }

/* image filter for icons to make them more readable */ img[src*="3DS.svg"]{ filter: hue-rotate(180deg) invert(100%) saturate(300%) contrast(150%); } img[src*="Playstation"]{ filter: hue-rotate(180deg) invert(100%); } img[src*="Amazon.svg"]{ filter: hue-rotate(180deg) invert(100%); } img[src*="Tux.svg"]{ filter: drop-shadow(0 0 1px #f2f2f2); }