<?php
get_header();
$template_directory = get_template_directory_uri();
$srcset = "srcset='{$template_directory}/assets/images/lazyload.png'";
$start_date = get_field('start_date');
$end_date = get_field('end_date');
$place = get_field('place');
$mainImg = get_field('image');
$main_color = get_field('main_color');
$categories = get_the_category();
$link = get_field('link');
?>
<main>
<section class="event-section" data-animate-group="list">
<div class="container">
<div class="event-section__wrapper">
<div class="event-section-content">
<div class="event-section__categories">
<?php foreach ($categories as $category) : ?>
<div class="label" style="background-color: <?php echo $main_color ?>"
data-animate="fade">
<?php echo $category->name; ?>
</div>
<?php endforeach; ?>
</div>
<h1 class="title title-3" data-animate="word" data-index="1">
<?php echo the_title(); ?>
</h1>
<div class="event-section__info" data-animate="swim-top">
<div class="label -date">
<?php
$start_date_timestamp = strtotime($start_date);
$end_date_timestamp = strtotime($end_date);
$locale = get_locale();
setlocale(LC_TIME, $locale);
$start_day = strftime('%e', $start_date_timestamp);
$start_month = strftime('%b', $start_date_timestamp);
$end_day = strftime('%e', $end_date_timestamp);
$end_month = strftime('%b', $end_date_timestamp);
if ($start_month == $end_month) {
echo $start_day . '-' . $end_day . ' ' . $start_month . ', ' . strftime('%Y', $end_date_timestamp);
} else {
echo $start_day . ' ' . $start_month . ' - ' . $end_day . ' ' . $end_month . ', ' . strftime('%Y', $end_date_timestamp);
}
?>
</div>
<div class="label -place"><?php echo $place; ?></div>
</div>
<p class="text body-2" data-animate="swim-top">
<?php echo get_the_content(); ?>
</p>
<div class="buttons" data-animate="swim-top">
<?php $prepared_link = get_link_group_field($link['link']); ?>
<a class="button"
href="<?php echo $prepared_link['url']; ?>"
target="<?php echo $prepared_link['target']; ?>">
<?php echo $prepared_link['title']; ?>
</a>
</div>
</div>
<div class="event-section-media" data-animate="swim-top">
<?php if (!empty($mainImg)) : ?>
<img class="-lazyload" <?php echo $srcset; ?>
src="<?php echo $mainImg['url']; ?>"
alt="<?php echo $mainImg['alt']; ?>">
<?php endif; ?>
</div>
</div>
</div>
</section>
</main>
<?php
get_footer();
?>