c4697e47c8
Add brochures section to frontpage Add grid view template Add article about medical cannabis study for patient organizations Add brochure for doctors Add brochure for patient organizations Add brochure for politicians Update styles to support new sections Update news article date
94 lines
2.6 KiB
PHP
94 lines
2.6 KiB
PHP
<?php if (!empty($pageContent)): ?>
|
|
<article class="list-intro">
|
|
<?= $pageContent ?>
|
|
</article>
|
|
<?php endif; ?>
|
|
|
|
<section class="brochure-grid-wrapper">
|
|
<div class="brochure-grid">
|
|
<?php foreach ($items as $item): ?>
|
|
<article>
|
|
<?php if ($item['cover']): ?>
|
|
<a href="<?= htmlspecialchars($item['url']) ?>">
|
|
<img src="<?= htmlspecialchars($item['cover']) ?>" alt="<?= htmlspecialchars($item['title']) ?>">
|
|
</a>
|
|
<?php endif; ?>
|
|
<h1>
|
|
<a href="<?= htmlspecialchars($item['url']) ?>">
|
|
<?= htmlspecialchars($item['title']) ?>
|
|
</a>
|
|
</h1>
|
|
<?php if (($metadata['show_date'] ?? true) && !empty($item['date'])): ?>
|
|
<p><?= htmlspecialchars($item['date']) ?></p>
|
|
<?php endif; ?>
|
|
<?php if ($item['summary']): ?>
|
|
<p><?= htmlspecialchars($item['summary']) ?></p>
|
|
<?php endif; ?>
|
|
<div class="brochure-actions">
|
|
<?php if (!empty($item['pdf'])): ?>
|
|
<a href="<?= htmlspecialchars($item['pdf']) ?>" class="btn-download" download>Last ned PDF</a>
|
|
<?php endif; ?>
|
|
<a href="<?= htmlspecialchars($item['url']) ?>" class="btn-read-more">Les mer</a>
|
|
</div>
|
|
</article>
|
|
<?php endforeach; ?>
|
|
</div>
|
|
</section>
|
|
|
|
<style>
|
|
main > section.brochure-grid-wrapper {
|
|
margin-top: 1.3em;
|
|
|
|
.brochure-grid {
|
|
display: grid;
|
|
grid-template-columns: repeat(auto-fit, minmax(clamp(15rem, 45%, 20rem), 1fr));
|
|
gap: clamp(1rem, 3vw, 2rem);
|
|
}
|
|
|
|
.brochure-grid > article {
|
|
background-color: white;
|
|
padding: 0;
|
|
overflow: hidden;
|
|
display: flex;
|
|
flex-direction: column;
|
|
|
|
> :not(img, a) {
|
|
padding-left: 1rem;
|
|
padding-right: 1rem;
|
|
}
|
|
|
|
h1 {
|
|
margin-top: 1rem;
|
|
font-size: clamp(1.5rem, 4vw, 2rem);
|
|
}
|
|
|
|
.brochure-actions {
|
|
margin-top: auto;
|
|
display: flex;
|
|
gap: 0.5rem;
|
|
flex-wrap: wrap;
|
|
padding-bottom: 1rem;
|
|
|
|
a {
|
|
margin-top: 1.3rem;
|
|
border-radius: 1rem;
|
|
background-color: var(--color-grey);
|
|
padding: 0.35rem 1rem;
|
|
color: white;
|
|
text-decoration: none;
|
|
|
|
&:hover {
|
|
background-color: var(--color-green);
|
|
color: white;
|
|
}
|
|
|
|
&:focus {
|
|
outline: 0.1rem var(--color-green) solid;
|
|
color: var(--color-grey);
|
|
background-color: white;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|