MediaWiki:Fandomdesktop.css

/*****************/ /* Shared Styles */ /*****************/

/* Background */ body { background-image: var(--theme-body-background-image); background-repeat: repeat; background-attachment: fixed; }

.fandom-community-header__background, .fandom-community-header__background::before { background-image: none; }

/* Template:Main Page Infoblocks */ .infoblock { background-color: rgba(0,0,0,0.2); }

/* Template:NIWAnav */ background-color: var(--theme-page-background-color); }
 * 1) NIWA-nav .cell {

/***************/ /* Light Theme */ /***************/

/* Main Page Logo and Site Logo */ .theme-fandomdesktop-light #mf-zw-logo, .theme-fandomdesktop-light .fandom-community-header__image img { filter: invert(0.9); }

/* Header */ .theme-fandomdesktop-light .fandom-community-header__background { position: absolute; width: calc(100% - 66px); mix-blend-mode: hard-light; background-image: linear-gradient(to right, #709cc4 30%,transparent 60%), url(https://static.wikia.nocookie.net/zelda_gamepedia_en/images/3/30/CSS_Background_Header.png/revision/latest?cb=20210711213509); -webkit-mask-box-image: linear-gradient(to bottom, #709cc4 5%, transparent 100%); background-repeat: no-repeat; background-position: top right; }

/***************/ /* Dark Theme */ /***************/

/* Header */ .theme-fandomdesktop-dark .fandom-community-header__background { position: absolute; width: calc(100% - 66px); mix-blend-mode: screen; background-image: linear-gradient(to right, #13212D 30%,transparent 60%), url(https://static.wikia.nocookie.net/zelda_gamepedia_en/images/3/30/CSS_Background_Header.png/revision/latest?cb=20210711213509); -webkit-mask-box-image: linear-gradient(to bottom, #13212D 5%, transparent 100%); background-repeat: no-repeat; background-position: top right; }

/* Tabs */ .theme-fandomdesktop-dark .tabcontainer .tab { background-color: #1d578b; background-image:-webkit-linear-gradient(top, #1D679B, #1A4E7D); background-image:  -moz-linear-gradient(top, #1D679B, #1A4E7D); background-image:   -ms-linear-gradient(top, #1D679B, #1A4E7D); background-image:    -o-linear-gradient(top, #1D679B, #1A4E7D); background-image:       linear-gradient(top, #1D679B, #1A4E7D); }

.theme-fandomdesktop-dark .tabcontainer .tab:hover { background-color:#24527c; background-image:-webkit-linear-gradient(top, #305f89, #17456E); background-image:  -moz-linear-gradient(top, #305f89, #17456E); background-image:   -ms-linear-gradient(top, #305f89, #17456E); background-image:    -o-linear-gradient(top, #305f89, #17456E); background-image:       linear-gradient(top, #305f89, #17456E); color:#F4F26B; }

.theme-fandomdesktop-dark .tabcontainer .tab.active { background-color:#17456e !important; background-image:-webkit-linear-gradient(top, #1D578B, #17456E); background-image:  -moz-linear-gradient(top, #1D578B, #17456E); background-image:   -ms-linear-gradient(top, #1D578B, #17456E); background-image:    -o-linear-gradient(top, #1D578B, #17456E); background-image:       linear-gradient(top, #1D578B, #17456E); color:#F4F26B; }

/* Button-like gradient background */ .theme-fandomdesktop-dark .gradient { background-image:-webkit-linear-gradient(top, #2D679B, #1A4E7D); background-image:  -moz-linear-gradient(top, #2D679B, #1A4E7D); background-image:   -ms-linear-gradient(top, #2D679B, #1A4E7D); background-image:    -o-linear-gradient(top, #2D679B, #1A4E7D); background-image:       linear-gradient(top, #2D679B, #1A4E7D); }

.theme-fandomdesktop-dark .gradient:hover { background-image:-webkit-linear-gradient(top, #227777, #1A4E7D); background-image:  -moz-linear-gradient(top, #227777, #1A4E7D); background-image:   -ms-linear-gradient(top, #227777, #1A4E7D); background-image:    -o-linear-gradient(top, #227777, #1A4E7D); background-image:       linear-gradient(top, #227777, #1A4E7D); }

/* Reverse gradient */ .theme-fandomdesktop-dark .rgradient { background-image:-webkit-linear-gradient(bottom, #2D679B, #1A4E7D); background-image:  -moz-linear-gradient(bottom, #2D679B, #1A4E7D); background-image:   -ms-linear-gradient(bottom, #2D679B, #1A4E7D); background-image:    -o-linear-gradient(bottom, #2D679B, #1A4E7D); background-image:       linear-gradient(bottom, #2D679B, #1A4E7D); }

.theme-fandomdesktop-dark .rgradient:hover { background-image:-webkit-linear-gradient(bottom, #227777, #1A4E7D); background-image:  -moz-linear-gradient(bottom, #227777, #1A4E7D); background-image:   -ms-linear-gradient(bottom, #227777, #1A4E7D); background-image:    -o-linear-gradient(bottom, #227777, #1A4E7D); background-image:       linear-gradient(bottom, #227777, #1A4E7D); }