{% extends "base.html" %}

{% block html_lang %}{{ page.lang }}{% endblock%}

{% block extra_head %}
    {% import 'translations.html' as translations with context %}
    {% if translations.entry_hreflang(page) %}
        {{ translations.entry_hreflang(page) }}
    {% endif %}
    <meta name="author" content="{{ author }}">
{% endblock %}

{% block title %}{{ page.title }}{% endblock %}

{% block head %}
    {{ super() }}
    {% if page.styles %}
        {% for style in page.styles %}
            {{ style|format(SITEURL) }}
        {% endfor %}
    {% endif %}
    {% if page.js %}
        {% for script in page.js %}
            {% if 'top' in script[-7:] %}
                {{ script[:-5]|format(SITEURL) }}
            {% endif %}
        {% endfor %}
    {% endif %}
{% endblock %}

{% block content %}

    <div class="main-content">
        <div class="container">
	    <!-- start of pages -->
	    <div class="columns is-multiline is-centered">
	        <!-- start of page -->
	        <div class="column is-7">
	            <div class="card">
                        <!-- post header -->
                        <div class="card-content-header">
                            <h4 class="title is-4 has-text-centered">{{ page.title }}</h4>
                        </div>
                        <!-- end of post header -->
                        <!-- post content -->
                        <div class="card-content">
                            <div class="content">
	                        <div class="card-inner-wrapper">
	                            <!-- post text -->
	                            <div class="card-content-text has-text-justified">
                                        {{ page.content }}
	                            </div>
	                            <!-- end of post text -->

	                            <!-- post footer -->
	                            <div class="card-content-footer-small">
		                        <div class="navbar is-social-center">
		                            <a class="navbar-item" href="">
			                        <span class="icon">
			                            <i class="icon-gnusocial"></i>
			                        </span>
		                            </a>
		                            <a class="navbar-item" href="">
			                        <span class="icon">
			                            <i class="icon-diaspora"></i>
			                        </span>
		                            </a>
		                            <a class="navbar-item" href="">
			                        <span class="icon">
			                            <i class="icon-mastodon"></i>
			                        </span>
		                            </a>
		                        </div>
		                        <!-- post footer nav -->
		                        <div class="columns">
		                            <div class="column has-text-left">
                                                <a class="button is-small is-button-grey" href="{{ SITEURL }}/">{{ _('Regresar al Inicio') }}</a>
		                            </div>
		                            <div class="column has-text-right">
			                        <i class="fa fa-flag">
                                                    {% import 'translations.html' as translations with context %}
                                                    {% if translations.translations_for(page) %}
			                                <small>
                                                            {{ translations.translations_for(page) }}
                                                        </small>
                                                    {% endif %}
			                        </i>
		                            </div>
		                        </div>
		                        <!-- end of post footer nav -->
	                            </div>
	                            <!-- end of post footer -->
	                        </div>
                            </div>
                        </div>
                        <!-- end page content -->
                    </div>
                </div>
                <!-- end of page -->
            </div>
            <!-- end of pages -->
        </div>
    </div>

{% endblock %}