<?php
// Template name: Projects page
get_header();
$args = [
'post_type' => 'project',
'posts_per_page' => -1,
];
$projects = new WP_Query($args);
$template_directory = get_template_directory_uri();
$srcset = "srcset='{$template_directory}/assets/images/lazyload.png'";
?>
<main>
<?php $projects_fields = get_field('projects') ?>
<section class="projects-hero">
<div class="container-big">
<div class="projects-hero__wrapper">
<div class="section-title title-2"><?php echo $projects_fields['title']; ?></div>
<div class="section-description body-2"><?php echo $projects_fields['description']; ?></div>
<div class="projects-hero-image">
<img class="-lazyload" <?php echo $srcset; ?> src="<?php echo $projects_fields['image']['url']; ?>"
alt="<?php echo $projects_fields['image']['alt']; ?>">
</div>
</div>
</div>
</section>
<section class="projects-list">
<div class="container">
<?php if ($projects->have_posts()):
while ($projects->have_posts()): $projects->the_post();
?>
<div class="projects-list-item">
<div class="projects-list-item-info">
<h3 class="title title-3"><?php the_title(); ?></h3>
<div class="excerpt body-2"><?php the_excerpt(); ?></div>
<a href="<?php the_permalink(); ?>" class="button -outline -arrow">
Learn more
</a>
</div>
<div class="projects-list-item-image">
<div class="projects-list-item-image__wrapper">
<?php the_post_thumbnail('full', ['data-srcset' => $template_directory . '/assets/images/lazyload.png']); ?>
</div>
</div>
</div>
<?php endwhile; ?>
<?php wp_reset_postdata(); ?>
<?php else: ?>
<p>No whitepapers found.</p>
<?php endif; ?>
</div>
</section>
</main>
<?php
get_footer();