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

{% block title %}Technoone{% endblock %}

{% block content %}

    {% include "components/_intro.html.twig" with {options: {
        title: "homepage_intro_title"|trans|title,
        description: "homepage_intro_description"|trans,
        skip: ".home-about",
        breadcrumb: false
    }} %}
    <div class="home-about-wrapper section-wrapper">
        <div class="content-section home-about">
            <div class="content-title-wrapper">
                <span class="content-title">{{"about_technoone"|trans|title}}</span>
            </div>
            <div class="content-inner">
                {% include "components/_text-container.html.twig" with {content: {
                    title: "homepage_software_services_section_title"|trans|title,
                    description: "homepage_software_services_section_description"|trans|capitalize,
                    link: path('service_detail', {'alias': 'test'})
                }} %}
                <div class="content-img"><img src="{{asset('img/about.jpg')}}" alt=""></div>
            </div>
        </div>
    </div>
    <div class="home-projects-wrapper section-wrapper">
        <div class="content-section home-projects">
            {% include "components/_text-container.html.twig" with {content: {
                title: "homepage_projects_section_title"|trans|title,
                description: "homepage_projects_section_description"|trans|capitalize,
            }} %}
            <div class="project-container">
                <div class="row">
                    {% for project in getProjects({'homeProjects': true}, app.request) %}
                        {% set projectLang = getLang(project.getProjectLangs(), app.request) %}
                        <a href="https://{{project.link}}" target="_blank" class="project-grid-item project-site">
                            <div class="project-img"><img src="{{ asset('img/projects/'~project.bannerImage) }}"></div>
                            <div class="project-text-wrapper">
                                <div class="project-logo"><img src="{{asset('img/projects/'~project.logoImage)}}"></div>
                                <div class="project-text">{{projectLang.homeProjectsDescription}}</div>
                            </div>
                        </a>
                    {% endfor %}
                </div>
                <div class="row">
                
                    {% set i = 0 %}
                    {% set break = false %}
                    {% for service in services %}
                        {% if not break %}
                            {% set serviceLang = serviceLangs[i] %}
                            {% if serviceLang %}
                                {% set i = i + 1 %}
                                <a href="{{ path('service_detail', {'alias': serviceLang.alias}) }}" class="project-grid-item">
                                    <div class="project-img"><img src="{{asset('img/homepage/project-'~(i+2)~'.jpg')}}"></div>
                                    <div class="project-text-wrapper">
                                        <div class="project-text">{{serviceLang.title|title}}</div>
                                    </div>
                                </a>
                                {% if i == 4 %}
                                    {% set break = true %}
                                {% endif %}
                            {% endif %}
                        {% endif %}
                    {% endfor %}
                </div>
            </div>
        </div>
    </div>
    {% set homeBrands = getProjects({'homeBrands': true}, app.request) %}
    <div class="home-brands" data-color="{{homeBrands[0].color}}">
        <div class="content-section brands-content-wrapper">
            <div class="brands-left-container">
                <h1>{{"our_brands"|trans|title}}</h1>
                <span>{{"brands_slider_description"|trans|capitalize}}</span>
                <div class="brands-link-section">
                    <div class="brand-link standart-button black-button arrow-anim big-button">{{"inspect_our_solutions"|trans|capitalize}}</div>
                    <div class="skip-button border-button big-button" data-skip=".home-slider"><i class="arrow-down arrow-dark"></i></div>
                </div>
                <div class="brands-progress hide_1024" data-background="#fff" data-foreground="#3E7071"></div>
            </div>
            <div class="brands-content">
                <div class="scrolling">
                    {% for brandItem in homeBrands %}
                        {% set brandLang = getLang(brandItem.getProjectLangs(), app.request) %}
                        <div class="brand-item" data-color="{{ brandItem.color }}">
                            <div class="brand-banner"><img src="{{ asset('img/projects/'~brandItem.bannerImage) }}"></div>
                            <div class="brand-item-content">
                                <div class="brand-logo-container">
                                    <img src="{{ asset('img/projects/'~brandItem.iconImage) }}" class="brand-logo">
                                </div>
                                <div class="brand-text-container text-container">
                                    <div class="tag-container">
                                    {#
                                        {% for tagId in brandItem.tagIdArray["content"] %}
                                            {% set tag = getProjectTag(tagId, app.request) %}
                                            <div class="tag blog-tag">{{tag}}</div>
                                        {% endfor %}
                                    #}
                                    </div>
                                    <h3>{{ brandLang.title }}</h3>
                                    <span>{{ brandLang.homeBrandsDescription }}</span>
                                    
                                    <a class="black-button standart-button arrow-anim" href="{{ path('project_page', {'project_name': brandItem.identifier}) }}">{{"for_more_info"|trans|capitalize}}</a>
                                </div>
                            </div>
                        </div>
                    {% endfor %}
                </div>
            </div>
        </div>
    </div>
    {% include 'components/_locations-slider.html.twig' %}
    {% include 'components/_blog-section.html.twig' %}
    {% include 'components/_intern-section.html.twig' %}
{% endblock %}