31 lines
1.1 KiB
JavaScript
31 lines
1.1 KiB
JavaScript
// src/components/Gallery.jsx
|
|
import { h } from 'preact';
|
|
|
|
export default function Gallery({ images = [] }) {
|
|
// Uvijek vraćamo isti 'div' wrapper da spriječimo hydration mismatch
|
|
return (
|
|
<div style={{ marginTop: '1rem' }}>
|
|
{!images || images.length === 0 ? (
|
|
<p class="text-sm text-gray-500 italic">Nema fotografija za ovaj nalog.</p>
|
|
) : (
|
|
<div style={{ display: 'grid', gridTemplateColumns: 'repeat(auto-fill, minmax(150px, 1fr))', gap: '1rem' }}>
|
|
{images.map((item) => (
|
|
<a
|
|
href={item.slika}
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
key={item.id}
|
|
style={{ display: 'block', borderRadius: '8px', overflow: 'hidden', border: '1px solid #333' }}
|
|
>
|
|
<img
|
|
src={item.slika}
|
|
alt={item.opis || 'Foto dokumentacija'}
|
|
style={{ width: '100%', height: '150px', objectFit: 'cover' }}
|
|
/>
|
|
</a>
|
|
))}
|
|
</div>
|
|
)}
|
|
</div>
|
|
);
|
|
} |