MediaWiki:Vector.less/vectorsidebar.less

From Brighter Shores Wiki
Jump to navigation Jump to search
// sidebar
#mw-panel {
	padding-top: 2.5em;
}

// sidebar links
.vector-menu-portal {
	.vector-menu-heading {
		color: var(--background-text-color);
		font-weight: bold;
		background: none;
	}

	.vector-menu-content li {
		a,
		a:visited {
			color: var(--background-link-color);
		}
	}
}

// logo
#p-logo {
	filter: drop-shadow(0 2px 5px rgba(0,0,0,.25));
	margin: -1.5em 0 0;
}

/* [[Forum:Add a better Discord link to the sidebar]] */
#n-Discord a {
	color: @white !important;
//	font-size: 12px; // default sidebar font size
	font-weight: bold;
	border-radius: @border-radius * 2;
	border: 1px solid @discord-bg-darker;
	background-color: @discord-bg;
	
	display: block;
	position: relative;
	padding: 4px 4px 5px calc(17px + 6.5px * 2); // width of icon + padding on either side
	box-shadow: 0 2px 3px rgba(0, 0, 0, .1);
	transition: .2s; // `ease` is the default timing-function
	
	&::before {
		content: 'Chat on ';
		font-weight: normal;
		opacity: .85;
	}

	&::after {
		content: '';
		background: url('filepath://Discord_logo_icon.svg') no-repeat;
		background-size: 17px 13px;
		filter: drop-shadow(0 1px 1px rgba(0, 0, 0, .1));

		position: absolute;
		top: 5px;
		left: 7px;
		width: 17px;
		height: 13px;
	}

	&:hover {
		text-decoration: none;
		background-color: @discord-bg-dark;
	}

}

.wgl-theme-dark #n-Discord a {
	background-color: @discord-bg-dark;

	&:hover {
		background-color: @discord-bg-darker;
	}
}