mirrors/Hyperpipe
1
0
Fork 0
mirror of https://codeberg.org/Hyperpipe/Hyperpipe synced 2025-06-27 20:58:01 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

Overhaul playlist layout with flexbox

Browse source
This commit is contained in:
Denevola 2022-09-13 18:57:40 +02:00
parent fcc3d455c6
commit a56ba53c4a
1 changed files with 9 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

15
src/components/Playlists.vue
View file

@ -54,7 +54,11 @@ defineEmits(['playthis']);
--ico: '\f64d';
}
.pl-item {
padding: 1rem;
display: flex;
align-items: center;
grid-column-gap: 1rem;
padding: 0.4rem;
padding-right: 1rem;
margin: 0.125rem;
border-radius: 0.25rem;
background: var(--color-background);
@ -63,16 +67,15 @@ defineEmits(['playthis']);
background: var(--color-background-soft);
}
.pl-main {
padding-left: 2.75rem;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.pl-img {
top: 0.45rem;
left: 0.45rem;
position: absolute;
flex-shrink: 0;
background-image: var(--src);
height: 2.75rem;
width: 2.75rem;
border-radius: 0.125rem;
background-size: contain;
background-repeat: no-repeat;
}