description = "Footer"

[viewBag]

[blogPosts]
pageNumber = "{{ :page }}"
postsPerPage = 3
noPostsMessage = "No posts found"
sortOrder = "published_at desc"
categoryPage = "blog/blog-category"
postPage = "blog/blog-post"

[mailSignup]

[topPosts]
period = 5
category = 0
postPerPage = 3
postPage = "blog/blog-post"
slug = "{{ :slug }}"

[tagList]
orderBy = "name asc"
postSlug = "{{ :tag }}"
limit = 10
enableTagFilter = "never"
tagPage = "blog/tag-posts"
tagsPage = "blog/tag-posts"
==
<div class="footer pt-12 display-13 {{ this.theme.footer_bg }}">
    {% if this.theme.footer_topbar %}
    <div class="{{ this.theme.footer_container }} f-topbar pb-5 border-b-1 {{ this.theme.footer_font == 'text-white' ? 'border-white-10' : 'border-black-10' }}">
        <div class="d-md-flex justify-content-between">
            {% for fields in this.theme.footer_topbar %}
            {% if fields._group == 'footer_topbar_brand' %}
            <!-- Navbar brand -->
            {% partial "site/brand" %}
            {% endif %}
            {% if fields._group == 'footer_topbar_desc' %}
            <div class="d-flex align-items-center mb-5 mb-md-0">
                <!-- Navbar brand -->
                {% partial "site/brand" %}
                <span class="{{ this.theme.footer_font }} opacity-50 max-w-sm mr-md-5">{{ fields.footer_topbar_desc_item|raw }}</span>
            </div>
            {% endif %}
            {% if fields._group == 'footer_topbar_menu' %}
            <nav class="horizontal-nav navbar p-0 navbar-expand-lg f1-nav mb-5 mb-md-0">
                <a class="navbar-no-brand d-lg-none text-uppercase display-13 font-weight-medium {{ this.theme.footer_font }}">Footer Navbar</a>
                <button class="navbar-toggler {{ this.theme.footer_font }}" type="button" data-toggle="collapse" data-target="#ft1" aria-controls="ft1" aria-expanded="false" aria-label="Toggle navigation"> <span class="fa fa-bars"></span> </button>
                <div class="collapse navbar-collapse" id="ft1">
                    <ul class="navbar-nav font-weight-normal">
                        {% for menu in fields.footer_topbar_menu_item %}
                        <li class="nav-item">
                            <a class="nav-link p-4 {{ this.theme.footer_font }} opacity-50 hover-opacity-100" href="{{ menu.footer_topbar_menu_item_clink ? menu.footer_topbar_menu_item_clink : (menu.footer_topbar_menu_item_plink | staticPage) }}">{{ menu.footer_topbar_menu_item_title }}</a>
                        </li>
                        {% endfor %}
                    </ul>
                </div>
            </nav>
            {% endif %}
            {% if fields._group == 'footer_topbar_copyright' %}
            <div class="align-self-center mb-5 mb-md-0 mr-md-5 {{ this.theme.footer_font }} opacity-50">
                <span>{{ this.theme.site_name }}</span> © {{ "now"|date("Y") }}. All rights reserved. Designed & Developed by 
                <a class="{{ this.theme.footer_font }}" href="http://ketikidis.com">Ketitkidis.com</a>
            </div>
            {% endif %}
            {% if fields._group == 'footer_topbar_subscribe' %}
            <div id="{{ mailSignup.id }}container" class="align-self-center mb-5 mb-md-0">
                <form
                    data-request="{{ mailSignup }}::onSignup"
                    data-request-update="'{{ mailSignup }}::result': '#{{ mailSignup.id }}container'">
                    <div class="input-group">
                        <input name="email" type="text" class="display-12 opacity-50 form-control form-control-lg" placeholder="john.smith@example.com">
                        <div class="input-group-append">
                          <button class="btn btn-danger" type="submit">Subscribe</button>
                        </div>
                    </div>
                </form>
            </div>
            {% endif %}
            {% if fields._group == 'footer_topbar_btn' %}
            <a class="d-flex align-items-center text-uppercase" href="{{ fields.footer_topbar_btn_url }}">
                <i class="{{ fields.footer_topbar_btn_icon }} text-danger display-10 mr-3"></i>{{ fields.footer_topbar_btn_label }}
            </a>
            {% endif %}
            {% if fields._group == 'footer_topbar_social' %}
            <div class="d-flex">
            {% for fields in this.theme.footer_social %}
                <a href="{{ fields.footer_social_url }}" class="d-flex justify-content-center align-items-center rounded-circle btn w-10r h-10r p-0 mx-1 {{ this.theme.footer_font == 'text-white' ? 'btn-outline-white' : 'btn-outline-dark'}}"><i class="{{ fields.footer_social_icon }}"></i></a>
            {% endfor %}
            </div>
            {% endif %}
            
            {% endfor %}
        </div>
    </div>
    {% endif %}
    {% if this.theme.footer %}
    <div class="{{ this.theme.footer_container }} f-main py-10">
        <!-- Row  -->
        <div class="row">
            {% for fields in this.theme.footer %}
            <!-- Column -->
            {% if fields._group == "footer_desc" %}
            <div class="{{ fields.footer_desc_size }} mb-7">
                {% if fields.footer_desc_title %}<h6 class="font-weight-medium {{ this.theme.footer_font }}">{{ fields.footer_desc_title }}</h6>{% endif %}
                <div class="pt-2 {{ this.theme.footer_font }} opacity-50">{{ fields.footer_desc_text|raw }}</div>
                <div class="mt-5 mb-7">
                {% for fields in this.theme.footer_social %}
                    <a href="{{ fields.footer_social_url }}" class="py-4 pr-3 {{ this.theme.footer_font }} opacity-50 hover-opacity-100"><i class="{{ fields.footer_social_icon }}"></i></a>
                {% endfor %}
                </div>
            </div>
            {% endif %}
            {% if fields._group == 'footer_menu' %}
            <div class="{{ fields.footer_menu_size }} mb-7">
                {% if fields.footer_menu_title %}<h6 class="font-weight-medium {{ this.theme.footer_font }}">{{ fields.footer_menu_title }}</h6>{% endif %}
                <ul class="list-unstyled">
                {% for menu in fields.footer_menu_item %}
                    <li class="py-2">
                        <a href="{{ menu.footer_menu_item_clink ? menu.footer_menu_item_clink : (menu.footer_menu_item_plink | staticPage) }}" class="{{ this.theme.footer_font }} opacity-50 hover-opacity-100">{{ menu.footer_menu_item_title }}</a>
                    </li>
                {% endfor %}
                </ul>
            </div>
            {% endif %}
            {% if fields._group == 'footer_info' %}
            <div class="{{ fields.footer_info_size }} mb-7">
                {% if fields.footer_info_title %}<h6 class="font-weight-medium {{ this.theme.footer_font }}">{{ fields.footer_info_title }}</h6>{% endif %}
                <div class="">
                {% for info in fields.footer_info_item %}
                    <div class="d-flex mb-2 mt-5">
						{% if info.footer_info_item_icon %}
                        <div class="display-9 mr-5 align-self-top"><i class="{{ info.footer_info_item_icon }} {{ this.theme.footer_font }} opacity-50"></i></div>
						{% endif %}
                        <div class="">
                            {% if info.footer_info_item_url %}
                            <a class="d-block {{ this.theme.footer_font }} opacity-50 hover-opacity-100" href="{{ info.footer_info_item_url }}">{{ info.footer_info_item_text|raw }}</a>
                            {% else %}
                            <span class="d-block {{ this.theme.footer_font }} opacity-50 hover-opacity-100">{{ info.footer_info_item_text|raw }}</span>
                            {% endif %}
                        </div>
                    </div>
                {% endfor %}
                </div>
            </div>
            {% endif %}
            {% if fields._group == 'footer_latest' %}
            <div class="{{ fields.footer_latest_size }} mb-7">
                {% if fields.footer_latest_title %}<h6 class="font-weight-medium {{ this.theme.footer_font }}">{{ fields.footer_latest_title }}</h6>{% endif %}
                {% set posts = blogPosts.posts %}
                {% for post in posts %}
                <div class="d-flex align-items-center mt-5">
                    <div class="mr-5">
                    {% if post.featured_images.count > 0 %}
                    <img src="{{ post.featured_images.first.getThumb(70, 70, 'crop') }}" alt="{{ image.title }}"/>
                    {% endif %}
                    </div>
                    <div class=""><a href="{{ post.url }}" class="{{ this.theme.footer_font }} opacity-50 hover-opacity-100">{{ post.title }}</a></div>
                </div>
                {% else %}
                <div class="d-flex align-items-center mt-5">{{ noPostsMessage }}</div>
                {% endfor %}
            </div>
            {% endif %}
            {% if fields._group == 'footer_tags' %}
            <div class="{{ fields.footer_tags_size }} mb-7">
                {% if fields.footer_tags_title %}<h6 class="font-weight-medium {{ this.theme.footer_font }}">{{ fields.footer_tags_title }}</h6>{% endif %}
                <div class="tagcloud">
                    {% set tags = tagList.tags %}
                    {% if tags | length %}
                    <div class="d-flex flex-wrap">
                        {% for item in tags %}
                        {% set postCount = item.posts|length %}
                        <a href="{{ item.url }}" class="btn btn-sm display-14 font-weight-light {{ this.theme.footer_font == 'text-white' ? 'btn-outline-white' : 'btn-outline-dark'}} px-2 m-1">
                            {{ item.name }}
                            {% if postCount %}
                                <span class="badge">{{ postCount }}</span>
                            {% endif %}
                        </a>
                        {% endfor %}
                    </div>
                    {% else %}
                        {{ "ginopane.blogtaxonomy::lang.components.tag_list.no_tags_message" | trans }}
                    {% endif %}
                </div>
            </div>
            {% endif %}
            {% if fields._group == 'footer_subscribe' %}
            <div class="{{ fields.footer_subscribe_size }} mb-7">
                {% if fields.footer_subscribe_title %}<h6 class="font-weight-medium {{ this.theme.footer_font }}">{{ fields.footer_subscribe_title }}</h6>{% endif %}
                <div id="{{ mailSignup.id }}container" class="bg-black-10 p-6">
                    <div class="{{ this.theme.footer_font }} opacity-50"><i class="{{ fields.footer_subscribe_icon }} display-4"></i></div>
                    <p class="{{ this.theme.footer_font }} opacity-75">{{ fields.footer_subscribe_text }}</p>
                    <form
                        data-request="{{ mailSignup }}::onSignup"
                        data-request-update="'{{ mailSignup }}::result': '#{{ mailSignup.id }}container'">
                        <div class="mb-5">
                            <input name="email" type="text" class="bg-transparent rounded-0 border-top-0 border-left-0 border-right-0 border-b-1 form-control p-0" placeholder="john.smith@example.com"/>
                        </div>
                        <button class="btn btn-danger btn-rounded" type="submit">Subscribe</button>
                    </form>
                </div>
            </div>
            {% endif %}
            {% if fields._group == 'footer_social' %}
            <div class="{{ fields.footer_social_size }} mb-7">
                {% if fields.footer_social_title %}<h6 class="font-weight-medium {{ this.theme.footer_font }}">{{ fields.footer_social_title }}</h6>{% endif %}
                <div class="d-flex mt-5">
                {% for social in this.theme.footer_social %}
                    <a href="{{ social.footer_social_url }}" class="d-flex justify-content-center align-items-center rounded-circle btn w-10r h-10r p-0 mx-1 {{ this.theme.footer_font == 'text-white' ? 'btn-outline-white' : 'btn-outline-dark'}}"><i class="{{ social.footer_social_icon }}"></i></a>
                {% endfor %}
                </div>
            </div>
            {% endif %}
            {% endfor %}
            <!-- Column -->
        </div>
        <!-- Row  -->
    </div>
    {% endif %}
    {% if this.theme.footer_bottombar %}
    <div class="f-bottom-bar {{ this.theme.footer_bg == 'bg-white' ? 'border-t-1 border-black-10' : 'bg-black-10' }} py-5">
        <div class="{{ this.theme.footer_container }}">
            <div class="d-md-flex justify-content-between">
                {% for fields in this.theme.footer_bottombar %}
                {% if fields._group == 'footer_bottombar_brand' %}
                <!-- Navbar brand -->
                {% partial "site/brand" %}
                {% endif %}
                {% if fields._group == 'footer_bottombar_desc' %}
                <div class="d-flex align-items-center">
                    <!-- Navbar brand -->
                    {% partial "site/brand" %}
                    <span class="{{ this.theme.footer_font }} opacity-50 max-w-sm mr-md-5">{{ fields.footer_bottombar_desc_item|raw }}</span>
                </div>
                {% endif %}
                {% if fields._group == 'footer_bottombar_menu' %}
                <nav class="horizontal-nav navbar p-0 navbar-expand-lg f1-nav mb-5 mb-md-0">
                    <a class="navbar-no-brand d-lg-none text-uppercase display-13 font-weight-medium {{ this.theme.footer_font }}">Footer Navbar</a>
                    <button class="navbar-toggler {{ this.theme.footer_font }}" type="button" data-toggle="collapse" data-target="#ft1" aria-controls="ft1" aria-expanded="false" aria-label="Toggle navigation"> <span class="fa fa-bars"></span> </button>
                    <div class="collapse navbar-collapse" id="ft1">
                        <ul class="navbar-nav font-weight-normal flex-row justify-content-start">
                        {% for menu in fields.footer_bottombar_menu_item %}
                            <li class="nav-item">
                                <a class="nav-link p-4 {{ this.theme.footer_font }} opacity-50 hover-opacity-100" href="{{ menu.footer_bottombar_menu_item_clink ? menu.footer_bottombar_menu_item_clink : (menu.footer_bottombar_menu_item_plink | staticPage) }}">{{ menu.footer_bottombar_menu_item_title }}</a>
                            </li>
                        {% endfor %}
                        </ul>
                    </div>
                </nav>
                {% endif %}
                {% if fields._group == 'footer_bottombar_copyright' %}
                <div class="align-self-center mb-5 mb-md-0 mr-md-5 {{ this.theme.footer_font }} opacity-50">
                    <span>{{ this.theme.site_name }}</span> © {{ "now"|date("Y") }}. All rights reserved. Designed & Developed by 
                    <a class="{{ this.theme.footer_font }}" href="http://ketikidis.com">Ketitkidis.com</a>
                </div>
                {% endif %}
                {% if fields._group == 'footer_bottombar_subscribe' %}
                <div id="{{ mailSignup.id }}container" class="no-shrink align-self-center">
                    <form
                        data-request="{{ mailSignup }}::onSignup"
                        data-request-update="'{{ mailSignup }}::result': '#{{ mailSignup.id }}container'">
                        <div class="input-group">
                            <input name="email" type="text" class="display-12 opacity-50 form-control form-control-lg" placeholder="john.smith@example.com">
                            <div class="input-group-append">
                              <button class="btn btn-danger" type="submit">Subscribe</button>
                            </div>
                        </div>
                    </form>
                </div>
                {% endif %}
                {% if fields._group == 'footer_bottombar_btn' %}
                    <a class="d-flex text-uppercase" href="{{ fields.footer_bottombar_btn_url }}">
                        <i class="{{ fields.footer_bottombar_btn_icon }} text-danger display-10 mr-2"></i>{{ fields.footer_bottombar_btn_label }}
                    </a>
                {% endif %}
                {% if fields._group == 'footer_bottombar_social' %}
                <div class="mt-2 mb-2 align-self-center">
                    {% for fields in this.theme.footer_social %}
                        <a class="px-2 {{ this.theme.footer_font }}" href="{{ fields.footer_social_url }}"><i class="{{ fields.footer_social_icon }}"></i></a>
                    {% endfor %}
                </div>
                {% endif %}
                {% endfor %}
            </div>
        </div>
    </div>
    {% endif %}
</div>