CompactAccount.theme.css

//META{"name":"Compact_Account","description":"edits for that account thingy under the channels","author":"maple - Nirewen's Edit","version":"1.22"}*//{}

/* Original version: https://github.com/mrmaple240/betterdiscord-mini-themes/blob/master/CompactAccount.theme.css */

.account {
    border-top: 1px solid rgba(180,180,180,.4) !important;
}
.account .avatar-small {
    left: -10px;
    width: 70px;
    height: 70px;
    background-size: 100%;
    border: 0px !important;
    border-radius: 0;
}
.account .avatar-small:hover {
    opacity: 1;
    -webkit-filter: grayscale(15%);
}
.account .btn-group {
    position: fixed;
    left: 180px;
    opacity: 0;
    transition: opacity 250ms;
}
.account:hover .btn-group {
    opacity: 1;
    transition: opacity 200ms;
    transition-delay: 150ms;
}
#voice-connection .btn, .account .btn {
    height: 40px;
    width: 40px;
}
.account .account-details {
    position: fixed;
    left: 170px;
    max-width: 130px;
    clip: rect(0px,148px,32px,0px);
    transition: opacity 500ms, clip 300ms;
}
.account:hover .account-details {
    opacity: 0;
    clip: rect(0px,0px,32px,0px);
    transition: opacity 500ms, clip 250ms;
}
.account .account-details .username {
    font-size: 18px;
    max-width: 150px;
    text-shadow: 1px 1.35px 1.5px rgba(20,20,28,.3);
}
.account .account-details .discriminator {
    font-size: 13px;
}
.account .status {
    border: none;
    border-radius: 0;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    position: absolute;
    height: 70px;
    width: 6px;
    bottom: 0px;
    left: 70px;
    box-shadow: inset 0 0 0 1.2px rgba(220,220,220,.2);
    border: 0px;
    border-radius: 0px;
}

div.popout.popout-top {
    top: inherit !important;
    bottom: -103px !important;
    left: 80px !important;
    transform: none !important;
}
.popout.popout-top .popout-menu {
    left: 20px;
    height: 70px;
    width: 70px;
    display: flex;  
    flex-wrap: wrap;
    border-radius: 0;
    border: 0px;;
}
.popout.popout-top .popout-menu .popout-menu-item {
    height: 35px;
    width: 35px;
    padding: 0;
}
.popout.popout-top .popout-menu-item .status {
    height: 35px;
    width: 35px;
    border-radius: 0;
}
.status-picker .popout-menu-item .helper {
    display: none;
}