/* Make sure that the ">" are visible. */
.sidebar-nav li {
    position: relative;
    margin: 0;
}

/* Add ">" to every li that has some child ul */
.sidebar-nav ul>li.folder>a::before,
.sidebar-nav ul>li.folder>p>a::before {
    content: '';
    display: block;
    position: absolute;
    top: 11px;
    left: -12px;
    height: 6px;
    width: 6px;
    border-right: 1px solid #505d6b;
    border-bottom: 1px solid #505d6b;
    transform: rotate(-45deg);
}

/* Rotate it downwards if it is active itself or has an active child. */
/* Note: Top level has an additional "p" tag for some reason. */
.sidebar-nav ul:not(.app-sub-sidebar)>li.open>a::before,
.sidebar-nav ul:not(.app-sub-sidebar)>li.open>p>a::before
{
    transform: rotate(45deg);
}

/* Hide all but the first level. */
.sidebar-nav ul > li > ul > li {
    display: none;
}

/* Show one layer below everything that is active or has active children. */
.sidebar-nav ul > li.open > ul > li
{
    display: block !important;
}