66 lines
		
	
	
		
			1.8 KiB
		
	
	
	
		
			CSS
		
	
	
	
	
	
			
		
		
	
	
			66 lines
		
	
	
		
			1.8 KiB
		
	
	
	
		
			CSS
		
	
	
	
	
	
.yt-navbar {
 | 
						|
  overflow-y:auto;
 | 
						|
}
 | 
						|
/* width */
 | 
						|
.yt-navbar::-webkit-scrollbar {
 | 
						|
  width: 5px;
 | 
						|
}
 | 
						|
 | 
						|
/* Track */
 | 
						|
.yt-navbar::-webkit-scrollbar-track {
 | 
						|
  background: #f1f1f1;
 | 
						|
}
 | 
						|
 | 
						|
/* Handle */
 | 
						|
.yt-navbar::-webkit-scrollbar-thumb {
 | 
						|
  background: #888;
 | 
						|
  border-radius:5px;
 | 
						|
}
 | 
						|
 | 
						|
/* Handle on hover */
 | 
						|
.yt-navbar::-webkit-scrollbar-thumb:hover {
 | 
						|
  background: #555;
 | 
						|
}
 | 
						|
.yt-left-navbar { position: absolute; left: 0; top: 0; height: calc(100% - 4.125rem); z-index: 10; background-color: rgb(25 25 25 / 95%); width: auto; max-width: 300px; margin-top: 4.125rem; }
 | 
						|
.yt-navbar-content ul { padding: 1rem 0rem; list-style-type: none; }
 | 
						|
.yt-navbar-content ul li { position: relative; display: flex; flex-wrap: wrap; flex-direction: column; }
 | 
						|
.yt-navbar-content ul li a { font-size: 0.9rem; padding: 0.75rem 1rem 0.75rem 2rem; position: relative; width: 100%; display:flex; justify-content: space-between;}
 | 
						|
.yt-navbar-content ul li a:hover { background-color: var(--theme-fusion-600); }
 | 
						|
.yt-navbar-content ul li a:active, .yt-navbar-content ul li a.active { background-color: var(--theme-light); }
 | 
						|
 | 
						|
.yt-navbar ul li a[data-nb-node-type=parent]::after {
 | 
						|
  content: ">";
 | 
						|
  font-family: cursive;
 | 
						|
  font-weight: 700;
 | 
						|
  margin-left:4rem;
 | 
						|
  transform:rotate(0deg);
 | 
						|
  transition:0.2s
 | 
						|
}
 | 
						|
 | 
						|
.yt-navbar ul li a[data-nb-node-type=parent][data-nb-node-status=open]::after {
 | 
						|
  transform:rotate(90deg);
 | 
						|
}
 | 
						|
 | 
						|
.yt-navbar-content ul li a[data-nb-node-type=parent] span:hover {
 | 
						|
  color: #886ab5;
 | 
						|
  background: white;
 | 
						|
}
 | 
						|
 | 
						|
.yt-navbar ul li a[data-nb-node-type=parent] ~ ul{
 | 
						|
  display:none;
 | 
						|
  opacity: 0;
 | 
						|
  transition: transform 0.3s;
 | 
						|
  transform: translateY(-5%);
 | 
						|
}
 | 
						|
.yt-navbar ul li a[data-nb-node-type=parent][data-nb-node-status=open] ~ ul{
 | 
						|
  transition: transform 0.3s;
 | 
						|
}
 | 
						|
 | 
						|
.yt-navbar-content ul.yt-navbar-dropdown {
 | 
						|
  padding:0;
 | 
						|
}
 | 
						|
 | 
						|
.yt-navbar-content ul.yt-navbar-dropdown li a {
 | 
						|
  padding: 0.75rem 0.5rem 0.75rem 3.5rem;
 | 
						|
}
 |