Scrollbar styling

scrollbar.scss

@mixin scrollbar-mixin() {
	.mat-sidenav-content,
	.mat-sidenav {
		overflow-y: overlay !important;
	}

	.mat-sidenav-content:hover::-webkit-scrollbar,
	.mat-sidenav:hover::-webkit-scrollbar {
		display: initial;
	}

	.mat-sidenav-content::-webkit-scrollbar,
	.mat-sidenav::-webkit-scrollbar {
		display: none;
	}

	/* hidden elements */
	.mat-sidenav-content::-webkit-scrollbar-button,
	.mat-sidenav-content::-webkit-scrollbar-track-piece,
	.mat-sidenav-content::-webkit-scrollbar-corner,
	.mat-sidenav-content::-webkit-resizer,
	.mat-sidenav::-webkit-scrollbar-button,
	.mat-sidenav::-webkit-scrollbar-track-piece,
	.mat-sidenav::-webkit-scrollbar-corner,
	.mat-sidenav::-webkit-resizer {
		display: none;
	}

	::-webkit-scrollbar {
		width: 10px;
		height: 10px;
	}

	::-webkit-scrollbar-thumb {
		border-radius: 5px;
		background-color: #d8d8d8;
	}

	::-webkit-scrollbar-track {
		border-radius: 0;
		background-color: transparent;
	}

	::-webkit-scrollbar-corner {
		background-color: #2a2a2a;
	}
}