{% extends 'base.html.twig' %}

{% import 'macros/blocks.html.twig' as blocks %}

{% block meta %}
    {{ blocks.meta(
    name,
    app.request.uri,
    'meta.description' | trans | striptags('sup'),
    app.request.schemeAndHttpHost~asset('resources/images/meta-logo.png'),
    256,
    256
    )}}
{% endblock %}

{% block body %}
    <div class="ui vertical inverted sidebar menu right">
        <div class="ui search item category center aligned">
            <div class="ui icon input transparent inverted">
                <input class="prompt" type="text" placeholder="Search..." >
                <i class="search icon"></i>
            </div>
            <div class="results transition"></div>
        </div>

        {{ knp_menu_render('mainMenu') }}
    </div>


    <div class="pusher">
        <div class="ui inverted vertical masthead center aligned segment">
            <div class="ui container">
                <div class="ui large secondary inverted menu main">
                    <a class="item header">
                        <img class="ui logo" src="{{ asset('resources/images/logo.svg') }}">
                        {{ name }}
                    </a>
                    <div class="left menu">
                        {{ knp_menu_render('mainMenu') }}
                    </div>
                    <div class="right menu">
                        <div class="ui search item category right aligned">
                            <div class="ui icon input transparent inverted">
                                <input class="prompt" type="text" placeholder="Search..." >
                                <i class="search icon"></i>
                            </div>
                            <div class="results transition"></div>
                        </div>
                    </div>
                    <a class="toc right floated item">
                        <i class="sidebar icon"></i>
                    </a>
                </div>
            </div>

            <div class="ui text container">
                <h1 class="ui inverted header">
                    <span class="content">
                            {{ name }}
                    </span>
                </h1>
                <span class="tagline">{{ 'meta.description' | trans | raw }}</span>
            </div>
        </div>

        <main class="ui full height segment vertical unpadded">
            <div class="ui main vertical stripe quote segment">
                <div class="ui container">
                    <div class="ui equal width stackable internally celled grid">
                        <div class="center aligned row">
                            <div class="column">
                                <h2 class="ui icon header">
                                    <i class="cube icon"></i>
                                    {{ models }} {{ 'homepage.models.title' | trans }}
                                </h2>
                                <p>{{ 'homepage.models.text' | trans | raw }}</p>
                                <a class="ui button big primary" href="{{ path('model_index') }}">{{ 'homepage.models.browse' | trans }}</a>
                            </div>
                            <div class="column">
                                <h2 class="ui icon header">
                                    <i class="cubes icon"></i>
                                    {{ sets }} {{ 'homepage.sets.title' | trans }}
                                </h2>
                                <p>{{ 'homepage.sets.text' | trans | raw }}</p>
                                <a class="ui button big primary" href="{{ path('set_index') }}">{{ 'homepage.sets.browse' | trans }}</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </main>
        {% include '::footer.html.twig' %}
    </div>
{% endblock %}