MediaWiki:Gadgets/collapsibleSidebarSections/main.css

@media screen and (min-width:721px) {
	.client-js #mw-panel .vector-menu-portal .vector-menu-heading {
	  cursor: pointer;
	  display: flex;
	  align-items: center;
	  justify-content: space-between;
	}
	
	.client-js #mw-panel .vector-menu-portal .vector-menu-heading::after {
	  content: "";
	  display: block;
	  pointer-events: none;
	  width: 14px;
	  height: 14px;
	  margin-top: 1px; /* offset */
	  --mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-chevron-down' width='24' height='24' viewBox='0 0 24 24' stroke-width='2' stroke='currentColor' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'%3E%3C/path%3E%3Cpath d='M6 9l6 6l6 -6'%3E%3C/path%3E%3C/svg%3E") no-repeat;
	  -webkit-mask: var(--mask);
	  mask: var(--mask);
	  -webkit-mask-size: 100% 100%;
	  mask-size: 100% 100%;
	  -webkit-mask-position: center center;
	  mask-position: center center;
	  background-color: var(--wiki-sidebar-link-color);
	  transform: rotate(180deg);
	}
	
	.client-js #mw-panel .vector-menu-portal.collapsed .vector-menu-heading::after {
	  transform: rotate(0deg);
	}
	
	.client-js #mw-panel .vector-menu-portal::after {
	  transition:0.5s
	}
	
	.client-js #mw-panel .vector-menu-portal.collapsed::after {
	  border-image-slice:22% 45%;
	  transition:0.5s;
	}
}