From a349205af9cac3a1ac7188e7ca60d5ed4a057c9e Mon Sep 17 00:00:00 2001
From: valere <dev@valerebron.com>
Date: Tue, 10 Feb 2026 21:14:14 +0100
Subject: [PATCH] random -> index

---
 app/pages/index.vue  | 95 ++++++++++++++++++++++++++++++++++++++++++--
 app/pages/random.vue | 94 -------------------------------------------
 2 files changed, 92 insertions(+), 97 deletions(-)
 delete mode 100644 app/pages/random.vue

diff --git a/app/pages/index.vue b/app/pages/index.vue
index f3afffb..41ad0d7 100644
--- a/app/pages/index.vue
+++ b/app/pages/index.vue
@@ -1,5 +1,94 @@
 <template>
-  <div>
-    here is the New New front
-  </div>
+  <section class="platine-card" :class="{ 'platine-card--platine-open': platineOpen }">
+    <Card :card="card!" :is-face-up @click="clickOnCard" :role="platineOpen ? 'img' : 'button'" showPlayButtonFaceUp />
+    <Platine v-if="platineOpen && card" :card="card" autoplay />
+    <CloseButton v-if="platineOpen" @click="platineOpen = false" />
+  </section>
 </template>
+
+<script setup lang="ts">
+import type { Card } from '~~/types/types'
+
+const { data: card, pending, error } = await useFetch<Card>('/api/card/random')
+
+const isFaceUp = ref(false)
+const platineOpen = ref(false)
+
+useHead({
+  title: computed(() =>
+    card.value ? `${card.value.artist} - ${card.value.title}` : 'Loading...'
+  )
+})
+
+onMounted(() => {
+  setTimeout(() => {
+    isFaceUp.value = true
+  }, 700)
+})
+
+const clickOnCard = () => {
+  platineOpen.value = !platineOpen.value
+}
+</script>
+
+<style scoped lang="scss">
+$open-speed: 0.4s;
+
+.platine-card {
+  @apply screen-centered h-screen;
+
+  :deep(.card) {
+    transition: width $open-speed, height $open-speed, transform 0.1s;
+    position: absolute;
+
+    .face-up,
+    .pochette {
+      transition: border-radius $open-speed, box-shadow $open-speed;
+
+      &:active {
+        .play-button {
+          @apply scale-90;
+        }
+      }
+    }
+  }
+
+  &--platine-open {
+    .card {
+      pointer-events: none;
+
+      &:focus {
+        @apply z-auto scale-100;
+      }
+    }
+
+    .card,
+    .platine {
+      width: 100vmin;
+      height: 100vmin;
+    }
+
+    &:deep(.card) {
+      .face-up {
+        border-radius: 999px;
+        @apply shadow-xl;
+
+        .pochette {
+          border-radius: 999px;
+        }
+
+        .rank {
+          opacity: 0;
+        }
+      }
+
+      .play-button,
+      .card-body,
+      .face-down {
+        display: none;
+        opacity: 0;
+      }
+    }
+  }
+}
+</style>
\ No newline at end of file
diff --git a/app/pages/random.vue b/app/pages/random.vue
deleted file mode 100644
index 41ad0d7..0000000
--- a/app/pages/random.vue
+++ /dev/null
@@ -1,94 +0,0 @@
-<template>
-  <section class="platine-card" :class="{ 'platine-card--platine-open': platineOpen }">
-    <Card :card="card!" :is-face-up @click="clickOnCard" :role="platineOpen ? 'img' : 'button'" showPlayButtonFaceUp />
-    <Platine v-if="platineOpen && card" :card="card" autoplay />
-    <CloseButton v-if="platineOpen" @click="platineOpen = false" />
-  </section>
-</template>
-
-<script setup lang="ts">
-import type { Card } from '~~/types/types'
-
-const { data: card, pending, error } = await useFetch<Card>('/api/card/random')
-
-const isFaceUp = ref(false)
-const platineOpen = ref(false)
-
-useHead({
-  title: computed(() =>
-    card.value ? `${card.value.artist} - ${card.value.title}` : 'Loading...'
-  )
-})
-
-onMounted(() => {
-  setTimeout(() => {
-    isFaceUp.value = true
-  }, 700)
-})
-
-const clickOnCard = () => {
-  platineOpen.value = !platineOpen.value
-}
-</script>
-
-<style scoped lang="scss">
-$open-speed: 0.4s;
-
-.platine-card {
-  @apply screen-centered h-screen;
-
-  :deep(.card) {
-    transition: width $open-speed, height $open-speed, transform 0.1s;
-    position: absolute;
-
-    .face-up,
-    .pochette {
-      transition: border-radius $open-speed, box-shadow $open-speed;
-
-      &:active {
-        .play-button {
-          @apply scale-90;
-        }
-      }
-    }
-  }
-
-  &--platine-open {
-    .card {
-      pointer-events: none;
-
-      &:focus {
-        @apply z-auto scale-100;
-      }
-    }
-
-    .card,
-    .platine {
-      width: 100vmin;
-      height: 100vmin;
-    }
-
-    &:deep(.card) {
-      .face-up {
-        border-radius: 999px;
-        @apply shadow-xl;
-
-        .pochette {
-          border-radius: 999px;
-        }
-
-        .rank {
-          opacity: 0;
-        }
-      }
-
-      .play-button,
-      .card-body,
-      .face-down {
-        display: none;
-        opacity: 0;
-      }
-    }
-  }
-}
-</style>
\ No newline at end of file