DynamicOldNav.css

/* Navbar branding. */
/** For Fandom wikis. **/
body.skin-fandomdesktop > .global-navigation {
    --fandom-global-nav-link-color: #2cc3d8; /* Top sidebar navigation. */
    --fandom-global-nav-icon-border-color: #2cc3d8; /* User icon. */
    --fandom-global-nav-bottom-icon-color: #2cc3d8; /* Bell icon. */
    --fandom-global-nav-background-color: #002A32; /* Sidebar. */
	--fandom-dropdown-background-color: #002A32;
	--fandom-accent-color: #2cc3d8 !important;
	--fandom-link-color: #2cc3d8 !important;
	--fandom-text-color: #f5f3f5 !important;
	--fandom-text-color--rgb: 245,243,245 !important;
	--fandom-global-nav-counter-background-color: #f5f3f5 !important;
	--fandom-global-nav-counter-label-color: #520044 !important;
	--fandom-notifications-background-color: #1e0c1b !important;
	--fandom-notifications-read-card-background-color: #002A32; /* Notification card background. */
	--fandom-notifications-unread-card-background-color: #003a42; /* Notification unread card background. */
	--fandom-notifications-footer-text-color: #FFF; /* Notification card footer text. */
}

/*** Replace new Fandom icon with old Fandom icon. ***/
body.skin-fandomdesktop .global-navigation__logo svg.wds-icon {
    background: url(https://images.wikia.com/central/images/archive/e/e6/20210803135431%21Site-logo.png) center / contain no-repeat;
    transform: scale(.7);
}

/** For Gamepedia wikis. **/
body.is-gamepedia > .global-navigation {
	--fandom-global-nav-link-color: #F48331; /* Top sidebar navigation. */
	--fandom-global-nav-icon-border-color: #F48331; /* User icon. */
	--fandom-global-nav-bottom-icon-color: #F48331; /* Bell icon. */
	--fandom-global-nav-background-color: #202020; /* Sidebar. */
	--fandom-dropdown-background-color: #202020;
	--fandom-accent-color: #F48331 !important;
	--fandom-link-color: #F48331 !important;
	--fandom-notifications-background-color: transparent !important;
	--fandom-notifications-read-card-background-color: #202020; /* Notification card background. */
	--fandom-notifications-unread-card-background-color: #404040; /* Notification unread card background. */
	--fandom-notifications-footer-text-color: #FFF; /* Notification card footer text. */
}

/*** Replace Fandom heart with Gamepedia book. ***/
body.is-gamepedia .global-navigation__logo svg.wds-icon {
	background: url(https://static.wikia.nocookie.net/ucp-internal-test-starter-commons/images/e/e6/Logo_icon_dark_transparent.png/revision/latest?cb=20200818142707&format=original) center / contain no-repeat !important;
}

/* Styles for all wikis. */
/** Vertical menus styling. **/
.global-navigation__nav + div > div > div,
.global-navigation__nav + div > div > div > span {
    background-color: var(--fandom-global-nav-background-color);
}

.global-navigation__nav + div > div > div div {
    color: var(--fandom-global-nav-link-color);
}

.global-navigation__nav + div > div > div a > div:first-child {
    border-bottom-color: var(--fandom-global-nav-link-color);
}

.global-navigation__nav + div > div > div svg {
    fill: var(--fandom-global-nav-link-color);
}

/** Hide sidebar. **/
/*** Move sidebar outside the screen, use pseudo-element for hover event. ***/
body.skin-fandomdesktop > .global-navigation {
	transform: translateX(-66px);
    transition: transform var(--global-nav-slide__duration, 500ms) var(--global-nav-slide__timing-function, ease);
	z-index: 201;
}

[dir='rtl'] > body.skin-fandomdesktop > .global-navigation {
	transform: translateX(66px);
}

/****
***** If the devide/browser is using a fine pointer, display the global nav bar
***** on either hover or focus-within. If the pointer is coarse (e.g. touch
***** devices' pointers), show it when a class is available at the body element
***** which is triggered by the JavaScript.
*****
***** This part hasn't been tested with a device that supports both pointer
***** types at the same time, so it may need some adjustments depending on how
***** it works in that scenario.
****/
@media only screen and (pointer: fine) {
	body.skin-fandomdesktop > .global-navigation:is(:hover, :focus-within) {
		transform: translateX(0px);
	}
}

body.global-navigation-is-visible > .global-navigation {
    transform: translateX(0px);
}

/**** Pseudo-element that extends the nav bar's touch bounding box. ****/
body.skin-fandomdesktop > .global-navigation::before {
    content: '';
    height: 100%;
    position: fixed;
    left: 66px;
    top: 0;
    width: 14px;
    z-index: -1;
}

[dir='rtl'] body.skin-fandomdesktop > .global-navigation::before {
    left: unset;
    right: 66px;
}

/****
***** Extra pseudo-element that further extends the nav bar's touch bounding
***** box *only* if the pointer is coarse as to make it easier to click.
****/
@media only screen and (pointer: coarse) {
	body.skin-fandomdesktop > .global-navigation::after {
		content: '';
		height: 100%;
		left: 66px;
		position: fixed;
		top: 0;
		width: 64px;
		z-index: -2;
	}

	[dir='rtl'] > body.skin-fandomdesktop > .global-navigation::after {
		left: unset;
		right: 66px;
	}
}

/** Remove search modal placement compensation from the global nav bar. **/
body.skin-fandomdesktop:not(.global-navigation-is-visible) > .search-modal,
body.skin-fandomdesktop:not(.global-navigation-is-visible) > .search-modal::before {
	left: 0;
    right: 0;
}

/** Extend main content. **/
body.skin-fandomdesktop .main-container {
	margin-left: 0;
    margin-right: 0;
	width: 100%;
}

/** Extend fandom header. **/
body.skin-fandomdesktop > .fandom-sticky-header {
	left: 0;
    right: 0;
}

/** Remove nav bar placement compensation. **/
/** Background fix on some wikis. **/
body.skin-fandomdesktop .fandom-community-header__background {
	width: 100%;
}

/* Hide useless stuff. */
#wds-brand-fandom-logomark path, /* Hide Fandom heart */
.global-navigation__logo span,
body.is-gamepedia .global-navigation__links {
	display: none !important;
}

@media (prefers-reduced-motion: reduce) {
	body.skin-fandomdesktop > .global-navigation {
		transition-duration: 0s !important;
	}
}