MediaWiki:Fandomdesktop.css

/***********************/ /* PAGE CONTENT - CUSTOM BACKGROUND IMAGE */ /* First implementation attempt: July 1–2, 2021*/

/* light Mode */

.theme-fandomdesktop-light .page__main {  background: url("https://images.wikia.nocookie.net/baccano/images/3/39/045.jpg") repeat; }

.theme-fandomdesktop-light .page__right-rail, .page__right-rail p { background: url("https://images.wikia.nocookie.net/baccano/images/3/39/045.jpg") repeat; }

.theme-fandomdesktop-light .page__right-rail section {   background: rgba(164,17,17,0); }

.theme-fandomdesktop-light #page-tools-module.rail-module.page-tools {  background: url("https://images.wikia.nocookie.net/baccano/images/3/39/045.jpg") repeat; }

.theme-fandomdesktop-light #wikia-recent-activity.rail-module.recent-wiki-activity.activity-module {   background: rgba(164,17,17,0); }

.theme-fandomdesktop-light .right-rail-wrapper>.rail-module:last-child, .right-rail-wrapper>:last-child>.rail-module:last-child {  background: url("https://images.wikia.nocookie.net/baccano/images/3/39/045.jpg") repeat; }

.theme-fandomdesktop-light #WikiaAdInContentPlaceHolder.rail-module {   background: rgba(164,17,17,0); }

.theme-fandomdesktop-light #recirculation-rail.popular-pages.premium-recirculation-rail {   background: rgba(164,17,17,0); }

/* Ladyshift's 2013 file, unaltered. This has been a staple of the wiki's aesthetic for so long that it would be a shame to lose.*/

/* Dark Mode */ /* Altered version of Ladyshift's file. Will do for now.*/ .theme-fandomdesktop-dark .page__main {  background: url("https://static.wikia.nocookie.net/baccano/images/3/31/PageContent_Background_DarkMode.png") repeat; }

.theme-fandomdesktop-dark .page__right-rail, .page__right-rail p { background: url("https://static.wikia.nocookie.net/baccano/images/3/31/PageContent_Background_DarkMode.png") repeat; }

.theme-fandomdesktop-dark .page__right-rail section {   background: rgba(164,17,17,0); }

.theme-fandomdesktop-dark #page-tools-module.rail-module.page-tools {  background: url("https://static.wikia.nocookie.net/baccano/images/3/31/PageContent_Background_DarkMode.png") repeat; }

.theme-fandomdesktop-dark #wikia-recent-activity.rail-module.recent-wiki-activity.activity-module {   background: rgba(164,17,17,0); }

.theme-fandomdesktop-dark .right-rail-wrapper>.rail-module:last-child, .right-rail-wrapper>:last-child>.rail-module:last-child {  background: url("https://static.wikia.nocookie.net/baccano/images/3/31/PageContent_Background_DarkMode.png") repeat; }

.theme-fandomdesktop-dark #recirculation-rail.popular-pages.premium-recirculation-rail {   background: rgba(164,17,17,0); }

.theme-fandomdesktop-dark #WikiaAdInContentPlaceHolder.rail-module {   background: rgba(164,17,17,0); }

/****************************/ /*       MAIN PAGE         */ /****************************/

/* H2 Header Custom Styling for Light & Dark Modes */ .theme-fandomdesktop-light .lcs-container h2 { background-color:#4e1804; padding: 0.2em 0.4em; margin: 0 0 10px 0; border-radius: 7px; color: white; font-variant: small-caps; justify-content: center; text-shadow: 1px 3px 3px black; font-weight: bold; font-size: 140%; }

.theme-fandomdesktop-light .rcs-container h2 { background-color:#4e1804; padding: 0.2em 0.4em; margin: 0 0 10px 0; border-radius: 7px; color: white; font-variant: small-caps; justify-content: center; text-shadow: 1px 3px 3px black; font-weight: bold; font-size: 140%; }

.theme-fandomdesktop-dark .lcs-container h2 { background-color: #743C1A; text-align: center; padding: 0.2em 0.4em; margin: 0 0 10px 0; border-radius: 7px; color: white; font-variant: small-caps; justify-content: center; text-shadow: 1px 3px 3px black; font-weight: bold; font-size: 140%; }

.theme-fandomdesktop-dark .rcs-container h2 { background-color: #743C1A; text-align: center; padding: 0.2em 0.4em; margin: 0 0 10px 0; border-radius: 7px; color: white; font-variant: small-caps; justify-content: center; text-shadow: 1px 3px 3px black; font-weight: bold; font-size: 140%; }

/****************************/ /*       INFOBOXES         */ /****************************/ /* Create import doc later */

/* Portable Infoboxes | GENERAL | Template style */

.portable-infobox { width: 280px; }

.portable-infobox .pi-header { padding: 5px; }

.pi-image img { width: 100%; height: 100%; }

.pi-data { grid-column-gap: 5px; }

.pi-collapse .pi-header:first-child { padding-right: 0; }

/* Portable Infoboxes | GENERAL | Tabs */ .pi-navigation.pi-item-spacing { padding-top: 1px; }

.pi-navigation { padding-left: 0px; padding-right: 0px; }

.pi-image-collection .wds-tabs__tab-label { font-family: Rubik; font-size: 12px; margin: 0px 2px; height: 20px; } .pi-image-collection ul.wds-tabs { /* All tabs */ line-height: 19px; padding: 0px; margin: 1px 0 1px; justify-content: center; }

.portable-infobox .wds-tabs { justify-content: center; height: 20px; }

.page-content ul.wds-tabs {	justify-content: center; } /* All tabs, not just PI tabs. Should be put into a Tabs section. */

.wds-tabs__tab-label { align-items: center; display: inline-flex; font-size: 14px; font-weight: 500; height: 20px; letter-spacing: .5px; margin: 0 11px; text-align: center; text-decoration: none; transition: color .1s; white-space: nowrap; }

.wds-tabs__wrapper.with-bottom-border { border-bottom: none; }

.pi-image-collection .wds-tabber img { width: 100%; height: 100%; }

.pi-image-collection .wds-tabs__arrow-left, .pi-image-collection .wds-tabs__arrow-right { display: none; }

.wds-tabs__wrapper.right-arrow-visible .wds-tabs, .wds-tabs__wrapper.left-arrow-visible .wds-tabs { -webkit-mask-image: none; }

/*.pi-image-collection .wds-tabs__tab:hover { Hover Inactive background-color: #d3bbb2; color: #2d2d2d; } */

/* Portable Infoboxes | LIGHT MODE | General */ .theme-fandomdesktop-light .portable-infobox { border: 1px solid #c9a79a; background-color: #d0baae; color: black; margin-bottom: 0.5em; margin-left: 1em; float: right; clear: right; }

.theme-fandomdesktop-light .portable-infobox .pi-title { background-color: rgba(164,17,17,0); color: #620101; margin-bottom: 1px; padding: 5px 5px 1px 5px; }

.theme-fandomdesktop-light .pi-header:first-child { background-color: #c9a79a; cursor: pointer; color: black; font-style: bold; position: relative; text-align: center; }

.theme-fandomdesktop-light .pi-item-spacing { border-color: #c9a79a; }

/* Portable Infoboxes | LIGHT MODE | Tabs */

.theme-fandomdesktop-light .pi-image-collection .wds-tabs__tab.wds-is-current, .pi-image-collection .wds-tabs__tab.wds-is-current:hover { /* Active */ box-shadow: none; background-color: #c9a79a; color: #2d2d2d; font-weight: normal; }

.theme-fandomdesktop-light .pi-image-collection .wds-tabs__tab.wds-is-current:hover { /* Active Hover*/ box-shadow: none; background-color: #b19287; color: #2d2d2d; font-weight: normal; }

.theme-fandomdesktop-light .pi-image-collection .wds-tabs__tab { /* Inactive */ background-color: #d0baae; color: #000; padding: 0px 3px; margin: 0 1px; border-bottom: none; }

.theme-fandomdesktop-light .pi-image-collection .wds-tabs__tab:hover { /* Inactive Hover */ box-shadow: none; background-color: #c2a899; color: #2d2d2d; font-weight: normal; }

/* Portable Infoboxes | DARK MODE | General */ .theme-fandomdesktop-dark .portable-infobox { border: 1px solid #2b2625; background-color: #252121; color: #fff; margin-bottom: 0.5em; margin-left: 1em; float: right; clear: right; }

.theme-fandomdesktop-dark .portable-infobox .pi-title { background-color: rgba(164,17,17,0); color: #fff; margin-bottom: 1px; padding: 5px 5px 1px 5px; }

.theme-fandomdesktop-dark .pi-header:first-child { background-color: #67615f; color: #000; }

.theme-fandomdesktop-dark .pi-item-spacing { border-color: #2b2625; }

/* Portable Infoboxes | DARK MODE | Tabs */

.theme-fandomdesktop-dark .pi-image-collection .wds-tabs__tab.wds-is-current { /* Active */ box-shadow: none; background-color: #7C5641; color: #2d2d2d; font-weight: normal; }

.theme-fandomdesktop-dark .pi-image-collection .wds-tabs__tab.wds-is-current:hover { /* Active Hover */ box-shadow: none; background-color: #776256; color: #2d2d2d; font-weight: normal; }

.theme-fandomdesktop-dark .pi-image-collection .wds-tabs__tab { /* Inactive */ background-color: #a77b62; color: #000; padding: 0px 3px; margin: 0 1px; border-bottom: none; }

.theme-fandomdesktop-dark .pi-image-collection .wds-tabs__tab:hover { /* Inactive Hover */ box-shadow: none; background-color: #C9A28C; color: #2d2d2d; font-weight: normal; }

/*************************************/ /* TableA Class - Light & Dark Modes */ /*************************************/

.theme-fandomdesktop-light .tableA th { text-align: center; background: #BA9D7F; color: black; border-collapse: collapse; padding: 5px 2px; } .theme-fandomdesktop-light .tableA td { text-align: left; color: black; border-bottom: 1px solid #b89571; background-color: #D4C2B0; padding: 6px 12px; }

.theme-fandomdesktop-light .tableA { border-collapse: collapse; border-bottom: #CEB9A3; border-spacing: 2px; margin: 1em 1em 1em 0; }

.theme-fandomdesktop-dark .tableA th { text-align: center; background: #312e2d; color: #fff; border-collapse: collapse; padding: 5px 2px; } .theme-fandomdesktop-dark .tableA td { text-align: left; color: black; border-bottom: 1px solid #312e2d; background-color: #67615f; padding: 6px 12px; }

.theme-fandomdesktop-dark .tableA { border-collapse: collapse; border-bottom: #312e2d; border-spacing: 2px; margin: 1em 1em 1em 0; }

/***********************************************/ /* Special Table Class for Home Video Releases */ /***********************************************/ .theme-fandomdesktop-light .tableHVR th { text-align: center; background: #BA9D7F; color: black; border-collapse: collapse; padding: 5px 2px; } .theme-fandomdesktop-light .tableHVR td { text-align: left; color: black; border-bottom: 1px solid #b89571; background-color: #D4C2B0; padding: 6px 12px; }

.theme-fandomdesktop-light .tableHVR { border-collapse: collapse; border-bottom: #CEB9A3; border-spacing: 2px; margin: 1em 1em 1em 0; }

.theme-fandomdesktop-dark .tableHVR th { text-align: center; background: #312e2d; color: #fff; border-collapse: collapse; padding: 5px 2px; } .theme-fandomdesktop-dark .tableHVR td { text-align: left; color: black; border-bottom: 1px solid #312e2d; background-color: #67615f; padding: 6px 12px; }

.theme-fandomdesktop-dark .tableHVR { border-collapse: collapse; border-bottom: #312e2d; border-spacing: 2px; margin: 1em 1em 1em 0; }

/*****************/ /*  Templates   */ /*****************/

/* Custom 2006/2015 Volume List templates */

.OhSixVolumeList, .FifteenVolumeList { border-collapse: collapse; width: 100%; }

.theme-fandomdesktop-light .OhSixVolumeList th { background:#BA9D7F; color: white; }

.theme-fandomdesktop-light .OhSixVolumeList td { background:#D4C2B0; color: white; }

.theme-fandomdesktop-dark .FifteenVolumeList th { background:#82613F; color: white; }

.theme-fandomdesktop-dark .FifteenVolumeList td { background:#A48466; color: white; }

/****************/ /*   IMAGES   */ /****************/ /* Embedded Images */

.tright, .tleft { border: none; } /*remove border from thumb class entirely*/