<template>
  <div class="flex min-h-screen flex-col items-center gap-10">
    <div class="flex items-start justify-center space-x-8 p-8">
      <!-- First Grid -->
      <div class="w-1/2">
        <h2 class="mb-4 text-xl font-bold">You smashed</h2>
        <div
          class="grid grid-cols-1 gap-2 lg:grid-cols-3 xl:grid-cols-5 xl:gap-4"
        >
          <div
            v-for="(img, idx) in imagesListOne"
            :key="idx"
            class="flex items-center justify-center rounded p-2 shadow"
          >
            <img
              :src="img"
              alt="Image from Smash List"
              class="h-32 w-full rounded object-cover"
            />
          </div>
        </div>
      </div>
      <!-- Second Grid -->
      <div class="w-1/2">
        <h2 class="mb-4 text-xl font-bold">You passed</h2>
        <div
          class="grid grid-cols-1 gap-2 lg:grid-cols-3 xl:grid-cols-5 xl:gap-4"
        >
          <div
            v-for="(img, idx) in imagesListTwo"
            :key="idx"
            class="flex items-center justify-center rounded p-2 shadow"
          >
            <img
              :src="img"
              alt="Image from pass list"
              class="h-32 w-full rounded object-cover"
            />
          </div>
        </div>
      </div>
    </div>
    <Button label="Return" class="h-16 w-64" />
  </div>
</template>

<script setup>
const imagesListOne = [
  // Replace with your image URLs
  "https://picsum.photos/id/1011/200/200",
  "https://picsum.photos/id/1012/800/400",
  "https://picsum.photos/id/1013/200/200",
  "https://picsum.photos/id/1014/200/200",
  "https://picsum.photos/id/1015/200/200",
  "https://picsum.photos/id/1016/200/200",
  // ...more images
];

const imagesListTwo = [
  "https://picsum.photos/id/1021/200/200",
  "https://picsum.photos/id/1022/200/200",
  "https://picsum.photos/id/1023/200/200",
  "https://picsum.photos/id/1024/200/200",
  "https://picsum.photos/id/1025/200/200",
  "https://picsum.photos/id/1026/200/200",
  // ...more images
];
</script>
