base for noita submitter
This commit is contained in:
@@ -34,8 +34,8 @@ const navigate = (path: string) => {
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="min-h-screen bg-base-200 flex items-center justify-center px-4">
|
||||
<div class="w-full max-w-4xl">
|
||||
<div class="min-h-screen bg-base-300 flex items-center justify-center px-4">
|
||||
<div class="w-full max-w-6xl">
|
||||
<!-- Header -->
|
||||
<div class="text-center mb-12">
|
||||
<h1 class="text-5xl font-bold mb-4">PolyLAN Submitter</h1>
|
||||
@@ -46,24 +46,13 @@ const navigate = (path: string) => {
|
||||
|
||||
<!-- Cards Grid -->
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
|
||||
<div
|
||||
v-for="game in games"
|
||||
:key="game.id"
|
||||
@click="navigate(game.path)"
|
||||
class="card bg-base-100 shadow-xl hover:shadow-2xl transition-all cursor-pointer transform hover:-translate-y-2 overflow-hidden"
|
||||
>
|
||||
<figure class="relative h-40 bg-base-300 overflow-hidden">
|
||||
<img
|
||||
v-if="!imageErrors.has(game.appId)"
|
||||
:src="getHeaderImage(game.appId)"
|
||||
:alt="game.title"
|
||||
@error="onImageError(game.appId)"
|
||||
class="w-full h-full object-cover"
|
||||
/>
|
||||
<div
|
||||
v-else
|
||||
class="w-full h-full bg-gradient-to-br from-blue-600 to-blue-400 flex items-center justify-center text-white"
|
||||
>
|
||||
<div v-for="game in games" :key="game.id" @click="navigate(game.path)"
|
||||
class="card card-xl bg-base-200 shadow-xl hover:shadow-2xl transition-all cursor-pointer transform hover:-translate-y-2 hover:scale-[1.05] hover:bg-base-100 overflow-hidden">
|
||||
<figure class="relative h-60 bg-base-300 overflow-hidden">
|
||||
<img v-if="!imageErrors.has(game.appId)" :src="getHeaderImage(game.appId)" :alt="game.title"
|
||||
@error="onImageError(game.appId)" class="w-full h-full object-cover" />
|
||||
<div v-else
|
||||
class="w-full h-full bg-gradient-to-br from-blue-600 to-blue-400 flex items-center justify-center text-white">
|
||||
<i class="mdi mdi-gamepad-variant text-5xl"></i>
|
||||
</div>
|
||||
<div class="absolute inset-0 bg-black/30 group-hover:bg-black/20 transition-colors"></div>
|
||||
@@ -74,7 +63,7 @@ const navigate = (path: string) => {
|
||||
<div class="card-actions justify-end mt-4">
|
||||
<button class="btn btn-primary">
|
||||
<i class="mdi mdi-arrow-right mr-2"></i>
|
||||
Get Started
|
||||
Submit results
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -86,5 +75,7 @@ const navigate = (path: string) => {
|
||||
<p>Select a game above to begin submitting</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
Reference in New Issue
Block a user