{% extends "_layouts/main" %}

{% block main %}
<div class="full-bleed-header" style="background-size: 100%; height: 300px; background-image:url(/images/coffee-shop.jpg)">
    <!-- Photo by Nick Hillier on Unsplash -->
    <div class="page-title text-center">
        <h2 class="logo"><span class="scripty">Krafty</span> Kaffee</h2>
        <p class="tagline reverse">Kaffee für uns alle.</p>
        <p><a class="button radius" href="/getraenke">Unsere Getränke</a> <a class="button radius" href="/recipes">Rezepte        {{ craft.app.language }}
</a>
    </div>
</div>
<br>
<div class="row">
    <div class="large-6 small-12 columns">
       <h3>Unsere Liebling Getränke</h3>
        <div class="large-12 small-12 columns">
        	{% for entry in craft.entries.section('drinks').limit(5).all() %}
            <a href="{{ entry.url }}">
            <div class="row hp-brew-item" style="background-image:url({{ entry.drinkImage.one().getUrl('drinksHomepageThumb') }});">
                <!-- Photo by Nathan Dumlao on Unsplash -->
                <p class="reverse">{{ entry.title }}</p>
            </div>
            </a>
            <br>
            {% endfor %}
        </div>
    </div>
    <div class="large-6 small-12 columns">
        <h3>Nachrichten</h3>
        <ul class="news-listing">
        	{% for entry in craft.entries.section('news').limit(10).all() %}
            <li><a href="{{ entry.url }}">{{ entry.title }} &raquo;</a></li>
			{% endfor %}
        </ul>
    </div>
</div>
{% endblock %}