40 lines
1.4 KiB
Plaintext
40 lines
1.4 KiB
Plaintext
{{ layout 'default.vto' }}
|
|
<main class="mi-main mi-cards">
|
|
<div class="mi-logo">
|
|
<picture>
|
|
<source media="(max-width: 500px)" srcset="/img/logo-500.jpg" />
|
|
<source media="(min-width: 501px) and (max-width: 700px)" srcset="/img/logo-700.jpg" />
|
|
<source media="(min-width: 701px) and (max-width: 799px)" srcset="/img/logo-1000.jpg" />
|
|
<source media="(min-width: 800px) and (max-width: 1400)" srcset="/img/logo-500.jpg" />
|
|
<source media="(min-width: 1401px) and (max-width: 1899px)" srcset="/img/logo-700.jpg" />
|
|
<source media="(min-width: 1900px)" srcset="/img/logo-1000.jpg" />
|
|
<img class="mi-logo--img" src="/img/logo-500.jpg" alt="MiOM Logo" />
|
|
</picture>
|
|
</div>
|
|
|
|
<div class="mi-tagline">
|
|
{{ tagline |> md |> safe }}
|
|
</div>
|
|
|
|
{{ for card of cards }}
|
|
<a
|
|
class="mi-card"
|
|
href="{{ card.link }}"
|
|
>
|
|
<picture>
|
|
<source media="(max-width: 500px)" srcset="/img/home-{{ card.image.url }}-500.jpg" />
|
|
<source media="(min-width: 501px)" srcset="/img/home-{{ card.image.url }}-700.jpg" />
|
|
<img
|
|
class="mi-card--background"
|
|
src="/img/home-{{ card.image.url }}-500.jpg"
|
|
alt="{{ card.image.alt }}"
|
|
/>
|
|
</picture>
|
|
<div class="mi-card--text">{{ card.text }}</div>
|
|
</a>
|
|
{{ /for }}
|
|
|
|
</main>
|
|
<div class="mi-page-filler"></div>
|
|
{{ /layout }}
|