WebPlay/client
1
1
Fork 0
Code Issues 10 Pull Requests Packages Projects Releases Wiki Activity

adjust banner animation for smartphones
All checks were successful
continuous-integration/drone/push Build is passing
Details

Browse Source
This commit is contained in:
Artem Anufrij 2023-09-28 12:48:11 +02:00
parent dbefc505dd
commit 2abc46216d
1 changed files with 5 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/views/Home.vue
View File

@ -3,12 +3,12 @@
<div id="welcomeLeft" class="flex-column grow"> <div id="welcomeLeft" class="flex-column grow">
<div id="banner" class="center flex-column shadow"> <div id="banner" class="center flex-column shadow">
<div id="collage"> <div id="collage">
<svg width="100%" height="100%" viewBox="20 40 700 100"> <svg width="100%" height="100%" viewBox="20 40 600 100">
<g> <g>
<animateTransform id="animY1" attributeName="transform" type="translate" begin="0s; animY2.end" from="-40 -60" to="-10 -20" dur="30s" /> <animateTransform id="animY1" attributeName="transform" type="translate" begin="0s; animY2.end" from="0 -140" to="-20 -60" dur="30s" />
<animateTransform id="animY2" attributeName="transform" type="translate" begin="animY1.end" from="-10 -20" to="-40 -60" dur="30s" /> <animateTransform id="animY2" attributeName="transform" type="translate" begin="animY1.end" from="-20 -60" to="0 -140" dur="30s" />
<image :xlink:href="item.covers.cover64" :x="Math.floor(i / 4) * 64" :y="i % 4 * 64" width="64" height="64" v-for="(item, i) in randomCovers" :key="item" /> <image :xlink:href="item.covers.cover64" :x="Math.floor(i / 6) * 64" :y="i % 6 * 64" width="64" height="64" v-for="(item, i) in randomCovers" :key="item" />
</g> </g>
</svg> </svg>
</div> </div>
@ -113,7 +113,7 @@ export default {
this.$store.dispatch("tracks/loadMostListened"); this.$store.dispatch("tracks/loadMostListened");
this.$store.dispatch("videos/loadMostViewed"); this.$store.dispatch("videos/loadMostViewed");
if (this.randomCovers.length == 0) { if (this.randomCovers.length == 0) {
this.$store.dispatch("albums/loadRandomCovers", 48); this.$store.dispatch("albums/loadRandomCovers", 60);
this.$store.dispatch("albums/loadAlbums", true); this.$store.dispatch("albums/loadAlbums", true);
this.$store.dispatch("artists/loadArtists", true); this.$store.dispatch("artists/loadArtists", true);
} }