adds friend badges to mediaitem square, working on adding to playlists/albums
This commit is contained in:
parent
a662192b2d
commit
4390493a9f
4 changed files with 138 additions and 10 deletions
|
@ -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;
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue