artwork-material now uses mediaitem-artwork

This commit is contained in:
booploops 2022-06-14 05:02:31 -07:00
parent b2dad9d857
commit a47fa00093
4 changed files with 7 additions and 7 deletions

View file

@ -634,7 +634,7 @@
opacity : .7; opacity : .7;
animation : playlistArtworkFadeIn 1s var(--appleEase); animation : playlistArtworkFadeIn 1s var(--appleEase);
.artworkMaterial>img { .artworkMaterial img {
filter : brightness(100%) blur(80px) saturate(100%) contrast(1); filter : brightness(100%) blur(80px) saturate(100%) contrast(1);
object-position: center; object-position: center;
object-fit : cover; object-fit : cover;
@ -990,7 +990,7 @@
opacity : .7; opacity : .7;
animation : playlistArtworkFadeIn 1s var(--appleEase); animation : playlistArtworkFadeIn 1s var(--appleEase);
.artworkMaterial>img { .artworkMaterial img {
filter : brightness(100%) blur(80px) saturate(100%) contrast(1); filter : brightness(100%) blur(80px) saturate(100%) contrast(1);
object-position: center; object-position: center;
object-fit : cover; object-fit : cover;

View file

@ -311,19 +311,19 @@ a.dropdown-item {
overflow: hidden; overflow: hidden;
pointer-events: none; pointer-events: none;
> img { img {
position: absolute; position: absolute;
width: 200%; width: 200%;
opacity: 0.5; opacity: 0.5;
filter: brightness(200%) blur(180px) saturate(280%) contrast(2); filter: brightness(200%) blur(180px) saturate(280%) contrast(2);
} }
> img:first-child { img:first-child {
top: 0; top: 0;
left: 0; left: 0;
} }
> img:last-child { img:last-child {
bottom: 0; bottom: 0;
right: 0; right: 0;
transform: rotate(180deg); transform: rotate(180deg);

View file

@ -1,6 +1,6 @@
<script type="text/x-template" id="artwork-material"> <script type="text/x-template" id="artwork-material">
<div class="artworkMaterial"> <div class="artworkMaterial">
<img :src="src" v-for="image in images"/> <mediaitem-artwork :url="src" :size="500" v-for="image in images"/>
</div> </div>
</script> </script>

View file

@ -121,7 +121,7 @@
</div> </div>
</div> </div>
<div class="artworkContainer" v-if="data.attributes.artwork != null"> <div class="artworkContainer" v-if="data.attributes.artwork != null">
<artwork-material :url="data.attributes.artwork.url" size="260" images="1"></artwork-material> <artwork-material :url="data.attributes.artwork.url" size="500" images="1"></artwork-material>
</div> </div>
<button class="md-btn md-btn-small editTracksBtn" v-if="(data.attributes.canEdit && data.type == 'library-playlists')" @click="editing = !editing"> <button class="md-btn md-btn-small editTracksBtn" v-if="(data.attributes.canEdit && data.type == 'library-playlists')" @click="editing = !editing">
<span v-if="!editing"> <span v-if="!editing">