{% extends 'layout.html.twig' %}
{% block title %}
    {{ getDynLocalizedStr(project.name) }}
{% endblock %}
{% block content %}
    <div class="container">
        <div class="about-header">
            <a href="/">{{ getLocalizedStr('go-back-to-main') }}</a>
        </div>
        <div>
        <h1>{{ getLocalizedStr('projects.project') }} {{ getDynLocalizedStr(project.name) }}</h1>

        {% if project.background is defined %}
        <h2>{{ getLocalizedStr('projects.background') }}</h2>
        <p>
        {{ getDynLocalizedStr(project.background) }}
        </p>
        {% endif %}

        {% if project.solution is defined %}
        <h2>{{ getLocalizedStr('projects.solution') }}</h2>
        <p>
        {{ getDynLocalizedStr(project.solution) }}
        </p>
        {% endif %}

        <h2>{{ getLocalizedStr('projects.technologies') }}</h2>
        <p>
        <div class="chips">
        {% for tech in project.technologies %}
            <div class="project-technology chip">
                {{ tech.name }}
            </div>
        {% endfor %}
        </div>
        </div>
    </div>
{% endblock %}