adds friend badges to mediaitem square, working on adding to playlists/albums

This commit is contained in:
booploops 2021-12-30 06:05:19 -08:00
parent a662192b2d
commit 4390493a9f
4 changed files with 138 additions and 10 deletions

View file

@ -2053,6 +2053,34 @@ input[type="range"].web-slider.display--small::-webkit-slider-thumb {
}
}
.friends-info {
display: flex;
flex-flow: column;
.badge-container {
display: flex;
flex-flow: wrap;
.socialBadge {
width: 40px;
height: 40px;
border-radius: 100%;
overflow: hidden;
box-shadow: var(--mediaItemShadow-ShadowSubtle);
transition: transform .2s var(--appleEase);
margin: 6px;
&:hover {
transform: scale(1.2);
}
}
}
.friends-name {
text-align: center;
font-size: 0.9em;
margin: 8px;
}
}
.playlist-time {
font-size: 0.9em;
margin: 6px;
@ -2892,6 +2920,22 @@ input[type="range"].web-slider.display--small::-webkit-slider-thumb {
}
}
.badge-container {
transition: opacity 0.1s var(--appleEase);
opacity: 1;
.socialBadge {
width: 32px;
height: 32px;
position: absolute;
right: 14px;
bottom: 14px;
border-radius: 100%;
overflow: hidden;
z-index: 2;
pointer-events: none;
}
}
> .play-btn,
> .menu-btn {
opacity: 0;
@ -2922,7 +2966,9 @@ input[type="range"].web-slider.display--small::-webkit-slider-thumb {
}
&:hover {
> .badge-container {
opacity: 0;
}
> .play-btn,
> .menu-btn {
opacity: 1;