Makes the wiki page full-width and adds a sidebar with a sticky header and fixed search bar.
/* ==UserStyle==
-- THEME STUFF --
@name Fandom | Modern Full Width Theme
@version 1.0.1
@description Makes the wiki page full-width and adds a sidebar with a sticky header and fixed search bar.
-- AUTHOR STUFF --
@namespace Freeplay
@author Freeplay (https://pages.codeberg.org/freeplay/)
@homepageURL https://codeberg.org/Freeplay/UserStyles
@supportURL https://codeberg.org/Freeplay/UserStyles/issues
@preprocessor stylus
==/UserStyle== */
@media only screen and (min-width: 1225px) {
div {
scrollbar-color: darkorange #0000 !important;
}
.banner-notifications-placeholder {
z-index: 0;
}
.wds-banner-notification__container {
width: calc(100% - 350px);
right: 0;
margin: 0;
margin-left: auto;
}
.WikiaTopAds {
width: calc(100% - 350px);
right: 0;
margin: 0;
margin-left: auto;
padding: 0;
}
/* Fandom Header */
.wds-global-navigation {
position: relative;
margin-right: 0px;
margin-left: auto;
width: calc(100% - 350px)
}
/* Wiki Header */
.wds-community-header {
margin-right: 0px;
position: sticky;
height: 125px;
top: -70px;
width: calc(100% - 350px);
opacity: 0.95;
}
.wds-community-header__wordmark {
height: 55px;
margin-bottom: 0px;
position: sticky;
top: 0;
}
.wds-community-header__local-navigation {
justify-content: center;
position: absolute;
bottom: 5px;
width: 100%;
}
/* Page */
.WikiaPage {
margin-right: 0px;
padding: 0px;
width: calc(100% - 350px);
box-shadow: -150px 0px 140px rgba(255, 255, 255, .875);
border: none;
}
.WikiaPageContentWrapper {
padding: 20px;
}
.WikiaMainContent {
width: 100%;
}
#WikiaPageBackground {
opacity: 0.95;
}
.community-background {
top: 0;
width: 100%;
object-fit: fill;
}
body.skin-oasis.background-not-tiled{
background-size: cover;
}
/* Fan Feed */
#mixed-content-footer {
margin: 0;
}
.mcf-column {
width: 33.33%;
}
.mcf-card {
width: 99%;
}
/*** Sidebar ***/
.WikiaRail {
position: fixed;
top: 55px;
left: 0;
margin: 0px;
height: calc(100% - 55px);
width: 350px;
color: orange;
background-color: #002a32;
z-index: 0;
}
.wikia-rail-inner {
overflow: auto;
padding-top: 45px;
}
.WikiaRail .rail-module h2.has-icon svg {
fill: orange;
}
/* Pages i'm following */
.WikiaRail .module {
background-color: transparent;
border: none;
}
.FollowedPagesModule a {
color: cyan;
}
/* Recent Wiki Activities */
.WikiaRail .activity-module .page-title > a {
color: cyan;
font-weight: bold;
}
.WikiaRail .activity-module .edit-info {
color: rgba(255, 255, 255, 0.75);
}
.WikiaRail .activity-module .edit-info .edit-info-user {
color: white;
}
/* Help grow the wiki */
.WikiaRail .rail-module .wds-button.wds-is-secondary {
border-color: gray;
border-radius: 10px;
color: cyan;
}
.WikiaRail .rail-module .wds-button.wds-is-secondary:focus:not(:disabled), .WikiaRail .rail-module .wds-button.wds-is-secondary:hover:not(:disabled), .WikiaRail .rail-module .wds-button.wds-is-secondary:active, .WikiaRail .rail-module .wds-button.wds-is-secondary.wds-is-active {
color: lightblue;
border-radius: 5px;
}
/* Popular Pages */
#WikiaAdInContentPlaceHolder.rail-sticky-module {
position: relative;
top: 0;
}
.WikiaRail .premium-recirculation-rail a {
color: lightgrey;
}
/*Top Pages*/
.Search.this-wiki .SearchAdsTopWrapper {
margin-top: 0;
padding: 20px;
padding-top: 0;
width: 310px;
height: calc(100% - 70px);
overflow-y: auto;
}
.WikiaRail .side-articles {
height: auto;
overflow: auto;
width: 320px;
min-height: 800px;
padding-right: 10px;
}
.Search .result {
border: none !important;
}
/* Search Bar */
.wds-global-navigation__search-container {
position: fixed;
left: 0;
margin: 0px;
width: 310px;
height: 55px;
background-color: #002a32;
padding-left: 20px;
padding-right: 20px;
}
.wds-dropdown.wds-has-dark-shadow .wds-dropdown__content {
width: 350px;
margin-left: -55px;
}
/* Contents */
#toc {
position: fixed;
left: 0;
top: 55px;
margin: 0px;
width: 350px;
padding: 0px;
border: none;
background-color: #002a32;
color: white;
box-shadow: 0px 0px 20px rgb(255, 255, 255, .35);
height: 30px;
overflow: auto;
z-index: 10;
}
nav.toc.show > ol {
z-index: 10;
overflow: auto;
position: fixed;
width: 310px;
padding-left: 20px;
padding-right: 20px;
background-color: #002a32;
height: calc(100% - 90px);
max-height: calc(100% - 90px);
color: white;
}
/* Footer */
.wds-global-footer {
z-index: 10;
margin-left: auto;
margin: 0;
}
}