div.quick-links {
    /* Give quick links as much space as possible, any more and it start looking wrong. */
    margin: 0 -7px;
    /* the last menu link has a bottom outline, make enough space for it */
    margin-bottom: 2px;
}

div.quick-links div.toggle {
    position: relative; /* so ::before/::after works in relation to this element */
    background-color: #444444;
    cursor: pointer;
}

div.quick-links div.toggle:hover {
    background-color: #5f5f5f;
}

div.quick-links div.toggle::before {
    font-family: "tme-fa-icons";
    position: absolute;
    left: 5px;
    content: "\e818";
}

div.quick-links div.collapsed div.toggle::before {
    content: "\e81a";
}

div.quick-links div.content {
    margin: 0 5px;
}

div.quick-links div.collapsed div.content {
    display: none
}

div.quick-links div.menu-link {
    background-color: #2b2b2b;
    border: solid #3c3c3c;
    border-width: 0 2px;
    margin: 0 2px;
    /* we cannot detect if an element has something after it, so we just add a shadow to every element. Only for the
        last element the shadow is not hidden behind another element. */
    box-shadow: 0 2px 0 0 #3c3c3c;
    /* make sure the notification is relative to the correct element */
    position: relative;
}

div.quick-links > div.menu-link:first-child, /* give the very first link an upper border */
div.quick-links div:not(.menu-link):not(.collapsed) + div.menu-link /* give the link directly after an opened toggle an upper border */
{
    border-top-width: 2px;
}

/* notification */
div.quick-links div.notification:not(.category)::after /* notification for entry */,
div.quick-links div.category.notification.collapsed > div.toggle::after /* notification for category, disable when uncollapsed */
{
    font-family: "tme-fa-icons";
    position: absolute;
    right: 5px;
    top: 0;
    content: "\e80c";
    color: yellow;
}

src/003-assets/CSS/quicklinks.css