FEAT: evilspins v3 :: tracks info in player

2024-10-22 23:36:04 +02:00
parent bf7c68fa35
commit e1ed518ce4
22 changed files with 381 additions and 236 deletions
--- a/components/compilationObject.vue
+++ b/components/compilationObject.vue
@@ -0,0 +1,23 @@
+<template>
+  <NuxtLink :to="'/compilations/' + props.data.id" class="compilation mx-auto p-4 inline-flex">
+    <atropos-component ref="atropos" class="my-atropos" active-offset="80" shadow-scale="1.05">
+      <img :src="props.data.id + '/bkg.jpg'" data-atropos-offset="-8" />
+      <img :src="props.data.id + '/object.png'" data-atropos-offset="-3" class="absolute inset-0 object-cover" />
+      <img :src="props.data.id + '/name.png'" data-atropos-offset="0" class="absolute inset-0 object-cover" />
+      <img src="/logo.svg" data-atropos-offset="0" width="70%" class="logo absolute inset-0" />
+    </atropos-component>
+  </NuxtLink>
+</template>
+
+<script setup>
+const props = defineProps(['data', 'template'])
+const atropos = ref(null)
+</script>
+
+<style scoped>
+.logo {
+  filter: drop-shadow(4px 4px 0 rgb(0 0 0 / 0.5));
+  left: 14%;
+  top: 10%;
+}
+</style>