MediaWiki:Home.css

/* Home Page */ /** Main **/ .main-page { margin-bottom: 0.8em; border-radius: 12px; text-align: center; width: 100%; } .main-page a:hover, .main-page a:active { text-decoration: none; } .main-page_head { background-color: var(--theme-link-color); color: #fff; border-radius: 12px 12px 0 0; padding: 0.4em; font-size: 140%; font-weight: bold; margin-bottom: 0.08em; } .main-page_subhead { background-color: var(--theme-link-color); color: #fff; padding: 0.2em; font-size: 100%; font-weight: bold; } .main-page_body { padding: 0.2em; } .main-page_foot { background-color: var(--theme-link-color); color: #fff; border-radius: 0 0 12px 12px; padding: 0.4em; font-size: 90%; color: #fff !important; } .main-page_foot a { color: #fff; } .theme-fandomdesktop-light .main-page { background: url('https://sp.ten-sura.com/quiz/assets/img/illust_bg_.png') repeat center; background-color: #CBDBFB; } .theme-fandomdesktop-dark .main-page { background: url('https://sp.ten-sura.com/quiz/assets/img/illust_bg_.png') repeat center; background-color: #0B1836; }

/*** Countdown ***/ .count { border-radius: 12px; width: 100%; margin-bottom: 0.4em; height: 60px; background: var(--theme-link-color); --bg: #fff; --hover-bg: var(--theme-link-color); --hover-text: #fff; border: 1px solid var(--theme-link-color); color: #fff; transition: 0.4s; } .count:hover { color: var(--hover-text); transform: translate(-0.25rem,-0.25rem); background: var(--hover-bg); box-shadow: 0.25rem 0.25rem var(--bg); } .count a { color: #fff !important; } .count th { padding: 0 6px; pointer-events: none; } .count td { padding: 0.8em; width: 100%; } .count b { font-size: 100%; } .count div { float: right; font-size: 80%; font-variant: small-caps; font-weight: bold; }

/*** Welcome ***/ .welcome { padding-top: 2em; pointer-events: none; } .theme-fandomdesktop-light .w_logo-dark { display: none; } .theme-fandomdesktop-dark .w_logo-light { display: none; } .welcome_title { font-size: 200%; font-variant: small-caps; padding: 0.25em 0em 0.75em; 0em; color: var(--theme-page-text-color); } .welcome_nav { margin: auto; font-variant: small-caps; color: var(--theme-page-text-color); } .welcome_nav td a { color: var(--theme-page-text-color); transition: 0.4s; } .welcome_nav a:hover { transform: scale(1.2); color: var(--theme-link-color); }

/*** Featured ***/ .featured_content { text-align: center; color: #fff; } .featured_content a { color: #fff !important; } .featured_content th { padding: 15px 20px; } .featured_content td { background-color: var(--theme-link-color); border: 1px solid var(--theme-link-color); border-radius: 12px; padding: 15px 20px; width: 75%; vertical-align: top; } .featured_content span { font-size: 120%; } .featured_content b { font-size: 120%; }

/*** Affiliates ***/ padding: 0.5em; }   max-width: 100%; margin: auto; display: inline-block; transition: 0.4s; }   transform: scale(1.025); } .affiliates { height: 275px; overflow: auto; margin-bottom: 3px; } .affiliates-table { width: 100%; text-align: center; padding: 2.5px; } .affiliates-table td { width: calc(100% * 1/3) } .affiliates-table tr:nth-child(odd) td:nth-child(odd), .affiliates-table tr:nth-child(even) td:nth-child(even) { background-color: var(--theme-link-color); }
 * 1) wmDiv {
 * 1) wmDiv img {
 * 1) wmDiv img:hover {

/*** Tally ***/ .mp-tally { border-radius: 12px; width: 200px; margin-bottom: 0.2em; background-color: var(--theme-link-color); border: 1px solid var(--theme-link-color); color: #fff; transition: 0.4s; padding: 0.4em; } .mp-tally:hover { transform: scale(0.985); } .mp-tally a { color: #fff !important; } .mp-tally b { float: left; font-size: 100%; } .mp-tally div { float: right; font-size: 80%; font-variant: small-caps; font-weight: bold; }

/*** External Links ***/ .e-links { width: 100%; text-align: center; padding: 2.5px; font-size: 80%; transition: 0.2s; } .e-links th { background-color: var(--theme-link-color); color: #fff; font-size: 120%; padding: 5px } .e-links td { width: calc(100% * 1/3); color: var(--theme-link-color) !important; border: 1px solid var(--theme-link-color); padding: 5px border-radius: 7.5px; } .e-links td a, .e-links td a.new { display: block; color: inherit; } .e-links td > .selflink, .e-links td > span, .e-links td a > span { display: block; padding: 2.5px; } .e-links td:hover { background-color: var(--theme-link-color); color: #fff !important; text-shadow: 0px; }

/*** Line ***/ .line-solid { border-top: 1px solid var(--theme-link-color); } .line-dashed { border-top: 1px dashed var(--theme-link-color); }

/*** Alert ***/ .alert { padding: 8px; border: 1px solid var(--theme-link-color); background-color: var(--theme-link-color); border-radius: 12px; color: #fff; text-align: center; transition: 0.4s; } .alert:hover { transform: scale(0.985); } .alert a { color: #fff !important; }

/*** "More" Button ***/ .more { border-radius: 12px; cursor: pointer; background-color: var(--theme-link-color); font-weight: bold; text-decoration: none; transition: 0.4s; padding: 0 0.5em; } .more:hover { transform: scale(0.985); } .more a { color: #fff !important; padding: 0 0.5em; }

/*** Discord Widget ***/ .discord-widget .widget-header { background-color: var(--theme-link-color); } .discord-widget .widget-footer { background-color: var(--theme-link-color); } .discord-widget .widget-body { background: linear-gradient(to right, rgba(000, 000, 000, 0.25), rgba(000, 000, 000, 0.25)), url(https://static.wikia.nocookie.net/tensei-shitara-slime-datta-ken/images/a/a9/Rimuru_rest.jpg/revision/latest?cb=20190313063419&format=original) top / cover; } .discord-widget .widget-member-avatar img { border: 2px solid var(--theme-link-color); background-color: var(--theme-link-color); } .discord-widget .widget-member .widget-member-name { background-color: var(--theme-link-color); } .discord-widget .widget-btn-connect { color: var(--theme-link-color) !important; background-color: #FFFFFF; border: 1px solid var(--theme-link-color); } .discord-widget .widget-btn-connect:hover { opacity: 1; background: #EEEEEE; color: var(--theme-link-color--hover) !important; border: 1px solid var(--theme-link-color); text-decoration: none; text-shadow: none; } .discord-widget .widget-role-name { color: #FFFFFF !important; background: var(--theme-link-color); background-size: 20px; padding: 5px; border-radius: 5px; } .discord-widget .widget-body::-webkit-scrollbar { width: 5px; } .discord-widget .widget-body::-webkit-scrollbar-track { background: transparent; margin: 1px 0; } .discord-widget .widget-body::-webkit-scrollbar-thumb { background: var(--theme-link-color); }

/*** Releases ***/ .releases { margin: auto; } .releases tr { vertical-align: top; } .releases td { padding: 5px; width: calc(100% * 1/3); transition: 0.4s; } .release_type div:before, .release_type div:after { font-weight: normal; display: inline-block; background: var(--theme-link-color); position: relative; vertical-align: middle; content: ""; width: 7.5%; height: 1px; } .release_type div:before { right: 12px; } .release_type div:after { left: 12px; } .release_type { padding: 0 200px; margin: 1em 0 0.25em 0; text-align: center; } .release_type div { color: var(--theme-link-color); font-weight: bold; } .release_content { width: auto; margin: auto; text-align: center; padding: 0.5em 0; width: 200px; } .release_content a:active { text-decoration: none; } .release_content td { padding-top: 0.5em; padding: 8px; color: var(--theme-link-color); } .release_content td a { color: var(--theme-link-color); } .release_content div { font-size: 75%; margin-top: -0.25em; font-style: normal; font-weight: 300; }

/**** Cover Hover — Loving Yamada at Lv999! Wiki ****/ .book-container, .book-container-comic { -moz-perspective: 1200px; -webkit-perspective: 1200px; -moz-user-select: none; -webkit-user-select: none; user-select: none; -khtml-user-drag: none; -moz-user-drag: none; -ms-user-drag: none; -webkit-user-drag: none; user-drag: none; display: block; margin: 0 auto; perspective: 1200px; width: 250px; }

.book, .book-comic { -moz-transform-origin: 125px 0; -moz-transform-style: preserve-3d; -moz-transition: 0.75s; -webkit-transform-origin: 125px 0; -webkit-transform-style: preserve-3d; -webkit-transition: 0.75s; box-shadow: 0 2px 4px rgba(227, 109, 118, 0.25); transform-origin: 125px 0; transform-style: preserve-3d; transition: 0.75s; z-index: 5; } .book:after, .book-comic:after { bottom: 0; content: ""; left: 3px; position: absolute; top: 0; width: 7px; z-index: 20; } .book:hover { -moz-transform: translateX(-10px) translateZ(35px) translateX(35px) rotateY(45deg); -webkit-transform: translateX(-10px) translateZ(35px) translateX(35px) rotateY(45deg); transform: translateX(-10px) translateZ(35px) translateX(35px) rotateY(45deg); } .book-comic:hover { -moz-transform: translateX(-10px) translateZ(5px) translateX(5px) rotateY(45deg); -webkit-transform: translateX(-10px) translateZ(5px) translateX(5px) rotateY(45deg); transform: translateX(-10px) translateZ(5px) translateX(5px) rotateY(45deg); } .book-container { width: 250px; } .book-container-comic { width: 150px; } .book-cover { position: relative; z-index: 10; } .book-cover img { height: auto; max-width: 100%; vertical-align: bottom; } .book-spine { background: url(https://i.imgur.com/Mshm8sZ.png); } .book-spine-comic1 { background: #FFFFFF; } .book-spine-comic2 { background: #FFFFFF; } .book-spine-comic3 { background: #FFFFFF; } .book-spine-comic1, .book-spine-comic2, .book-spine-comic3, .book-spine { -moz-transform-origin: 0; -moz-transform: rotateY(-90deg) translateX(-49px); -webkit-transform-origin: 0; -webkit-transform: rotateY(-90deg) translateX(-49px); background-size: auto 100%; bottom: 0; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.25); color: #FFFFFF; smargin-left: 5px; overflow: hidden; position: absolute; top: 0; transform-origin: 0; z-index: 5; } .book-spine { transform: rotateY(-90deg) translateX(-30px); width: 30px; } .book-spine-comic1, .book-spine-comic2, .book-spine-comic3 { transform: rotateY(-90deg) translateX(-20px); width: 20px; } .book-spine-comic1 h1, .book-spine-comic2 h1, .book-spine-comic3 h1, .book-spine h1 { -moz-transform-origin: 0; -moz-transform: rotateZ(90deg); -webkit-font-smoothing: antialiased; -webkit-transform-origin: 0; -webkit-transform: rotateZ(90deg); color: #FFFFFF; display: block; font-size: 2em; font-weight: normal; left: 39px; opacity: 0.75; position: absolute; text-align: left; text-indent: 43px; text-transform: uppercase; top: 0; transform-origin: 0; transform: rotateZ(90deg); width: 250px; } .book-spine-comic1:before, .book-spine-comic2:before, .book-spine-comic3:before, .book-spine:before { content: ""; display: block; height: 100%; width: 100%; }