diff options
Diffstat (limited to 'src/App.vue')
| -rw-r--r-- | src/App.vue | 24 |
1 files changed, 20 insertions, 4 deletions
diff --git a/src/App.vue b/src/App.vue index 10537d6..6c2e619 100644 --- a/src/App.vue +++ b/src/App.vue @@ -11,10 +11,26 @@ export default { </script> <template> - <div class="bg-black flex flex-row flex-wrap justify-center"> - <img v-for="tile in tiles" :src="'/src/assets/' + tile.name + '.jpg'" :alt="tile.name" :id="tile.name" - @click="$event.target.style.transform = 'translate(20%,30%)'" - class="m-1 flex-auto transition-transform duration-300"/> + <div class="h-[100vh] bg-black"> + <div class="flex flex-row flex-wrap gap-1 p-1"> + <img v-for="tile in tiles" :src="'/src/assets/' + tile.name + '.jpg'" :alt="tile.name" :id="tile.name" + @click="$event.target.style.transform = 'translate(20%,30%)'" + class="max-w-full transition-transform duration-300"/> + </div> + <!-- + <div class="flex flex-row gap-1 p-1"> + <img v-for="tile in tiles" :src="'/src/assets/' + tile.name + '.jpg'" :alt="tile.name" :id="tile.name" + @click="$event.target.style.transform = 'translate(20%,30%)'" + class="w-full transition-transform duration-300"/> + </div> + --> + <!-- + <div class="flex flex-col max-h-full gap-1 p-1"> + <img v-for="tile in tiles" :src="'/src/assets/' + tile.name + '.jpg'" :alt="tile.name" :id="tile.name" + @click="$event.target.style.transform = 'translate(20%,30%)'" + class="h-full mr-auto transition-transform duration-300"/> + </div> + --> </div> </template> |