Ryan/drop
1
0
Fork 0
mirror of https://github.com/Drop-OSS/drop.git synced 2025-11-12 15:52:39 +10:00
Code Issues Packages Projects Releases Wiki Activity

feat: sleak transition from store page to item

Browse Source
This commit is contained in:
Huskydog9988
2025-04-07 16:17:55 -04:00
parent 657fd50702
commit 106b3f66a4
4 changed files with 66 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
pages/store/[id]/index.vue
View File

@ -27,8 +27,9 @@
class="col-start-1 lg:col-start-4 flex flex-col gap-y-6 items-center"
>
<img
class="transition-all duration-300 hover:scale-105 hover:rotate-[-1deg] w-64 h-auto rounded"
class="transition-all duration-300 hover:scale-105 hover:rotate-[-1deg] w-64 h-auto rounded gameCover"
:src="useObject(game.mCoverId)"
:alt="game.mName"
/>
<div class="flex items-center gap-x-2">
<AddLibraryButton :gameId="game.id" />
@ -219,3 +220,19 @@ useHead({
title: game.mName,
});
</script>
<style scoped>
h1 {
view-transition-name: header;
}
img.gameCover {
view-transition-name: selected-game;
}
</style>
<style>
::view-transition-old(header),
::view-transition-new(header) {
width: auto;
}
</style>