69 lines
1.2 KiB
SCSS
69 lines
1.2 KiB
SCSS
@import "theme.scss";
|
|
|
|
#guild-list-container {
|
|
display: flex;
|
|
flex-flow: column;
|
|
overflow-y: scroll;
|
|
box-sizing: border-box;
|
|
flex: none; /* >:| NOT GONNA SHINK BOI */
|
|
width: 72px; /* TODO: auto-calculated from content */
|
|
height: calc(100vh - 22px);
|
|
padding-top: 8px;
|
|
overflow-y: scroll;
|
|
}
|
|
|
|
#guild-list {
|
|
display: flex;
|
|
flex-flow: column;
|
|
}
|
|
|
|
#guild-list::-webkit-scrollbar {
|
|
display: none;
|
|
}
|
|
|
|
#add-guild,
|
|
#guild-list .guild {
|
|
cursor: pointer;
|
|
margin-bottom: 8px;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
#add-guild .pill,
|
|
#guild-list .guild .pill {
|
|
background-color: $header-primary;
|
|
width: 8px;
|
|
height: 0;
|
|
border-radius: 4px 4px;
|
|
margin-left: -4px;
|
|
margin-right: 8px;
|
|
transition: height .1s ease-in-out;
|
|
}
|
|
|
|
#guild-list .guild.active .pill {
|
|
height: 40px;
|
|
}
|
|
|
|
#guild-list .guild.unread:not(.active) .pill {
|
|
height: 8px;
|
|
}
|
|
|
|
#add-guild:hover .pill,
|
|
#guild-list .guild:not(.active):hover .pill {
|
|
height: 20px;
|
|
}
|
|
|
|
#add-guild img,
|
|
#guild-list .guild img {
|
|
width: 48px;
|
|
height: 48px;
|
|
border-radius: 24px;
|
|
transition: border-radius .1s ease-in-out;
|
|
}
|
|
|
|
#add-guild:hover img,
|
|
#guild-list .guild:hover img,
|
|
#guild-list .guild.active img {
|
|
border-radius: 16px;
|
|
}
|