<?php
$galleryDatas = get_field('gallery');
?>

<div class="lightbox-gallery">
	<?php if ($galleryDatas): ?>
		<?php foreach ($galleryDatas as $picture): ?>
			<button class="lightbox-gallery__trigger">
				<img class="lightbox-gallery__picture" src="<?php echo $picture['url'] ?>" data-description="<?php echo $picture['description'] ?>" data-caption="<?php echo $picture['caption'] ?>" alt="<?php echo $picture['alt'] ?>" />
			</button>
		<?php endforeach; ?>
	<?php endif; ?>
</div>

<div class="lightbox lightbox--inactive" aria-hidden="true">
	<div class="lightbox__container">
		<button class="lightbox__close cta cta--button cta--button--mini cta--outline">
			Fermer
		</button>
		<button class="lightbox__prev">
			<img src='<?php echo get_template_directory_uri() . '/resources/img/graphic-assets/slider-next-right.svg'	?>' alt='<?php echo __("Image Précédente", "homegrade-theme__texte-fonctionnel") ?>'>
		</button>
		<div class="lightbox__current-picture">
			<img src="" alt="" />
			<p class="lightbox__current-picture-description"></p>
		</div>
		<button class="lightbox__next">
			<img src='<?php echo get_template_directory_uri() . '/resources/img/graphic-assets/slider-next-right.svg'	?>' alt='<?php echo __("Image Suivante", "homegrade-theme__texte-fonctionnel") ?>'>
		</button>
	</div>
</div>