Files
3dealer/resources/views/components/ui/product-card.blade.php
T

37 lines
1.2 KiB
PHP

@props([
'name' => '',
'price' => null,
'image' => null,
'href' => '#',
])
<div class="group">
<div class="relative flex items-center justify-center mb-4">
<a href="{{ $href }}" class="block w-full border border-black overflow-hidden bg-white">
@if($image)
<img
src="{{ $image }}"
alt="{{ $name }}"
loading="lazy"
class="w-full h-auto block"
>
@else
<div class="w-full aspect-square bg-neutral-300 flex items-center justify-center text-neutral-500 text-sm">
Χωρίς εικόνα
</div>
@endif
</a>
<x-ui.button size="md" position="absolute" class="opacity-0 group-hover:opacity-100 transition-opacity duration-100">
Προσθήκη στο καλάθι
</x-ui.button>
</div>
<div class="flex items-baseline justify-between gap-4">
<a href="{{ $href }}" class="font-bold text-xl leading-snug hover:text-brand">{{ $name }}</a>
@if($price !== null)
<span class="font-bold text-xl shrink-0"><x-ui.price :amount="$price" /></span>
@endif
</div>
</div>