feat: product screenshots gallery
Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Sonnet 5.5
parent
bf365d029f
commit
a3894d2f37
@@ -179,6 +179,34 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Screenshots -->
|
||||
<div x-data="{ previews: [] }">
|
||||
<label for="screenshots" class="block text-sm font-medium text-gray-700">
|
||||
Screenshots
|
||||
</label>
|
||||
<div class="mt-1">
|
||||
<input type="file"
|
||||
id="screenshots"
|
||||
name="screenshots[]"
|
||||
accept="image/*"
|
||||
multiple
|
||||
@change="previews = Array.from($event.target.files).map(f => URL.createObjectURL(f))"
|
||||
class="block w-full text-sm text-gray-500 file:mr-4 file:py-2 file:px-4 file:rounded-md file:border-0 file:text-sm file:font-semibold file:bg-primary-50 file:text-primary-700 hover:file:bg-primary-100">
|
||||
@error('screenshots')
|
||||
<p class="mt-2 text-sm text-red-600">{{ $message }}</p>
|
||||
@enderror
|
||||
@foreach($errors->get('screenshots.*') as $messages)
|
||||
<p class="mt-2 text-sm text-red-600">{{ $messages[0] }}</p>
|
||||
@endforeach
|
||||
<p class="mt-2 text-sm text-gray-500">Add several images (JPEG, PNG, or GIF, max 2MB each).</p>
|
||||
<div class="mt-3 flex flex-wrap gap-2" x-show="previews.length" style="display: none">
|
||||
<template x-for="src in previews" :key="src">
|
||||
<img :src="src" alt="" class="h-20 w-28 object-cover rounded border border-gray-300">
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Info Alert -->
|
||||
<div class="rounded-md bg-blue-50 p-4">
|
||||
<div class="flex">
|
||||
|
||||
Reference in New Issue
Block a user