{% extends "base.html" %} {% block content %}

<div class="section">
    <div class="container is-desktop">
    <div class="columns is-centered is-desktop">
        <div class="column is-narrow is-two-third-touch">
            <div class="card has-background-primary-light" style="position: sticky; top: 3em;">
                <div class="card-content">
                    <div class="media">
                        <div class="media-left">
                            <a href="/">
                                <figure class="image is-1by1 is-128x128">
                                    <img class="is-rounded" src="/img/glitch.png" alt="A glitched image"></img>
                                </figure>
                            </a>
                        </div>
                        <div class="media-content">
                            <h1 class="title is-1 has-text-primary-dark has-text-right">{{ config.title }}</h1>
                            <p class="subtitle is-4 has-text-primary-dark has-text-right">Créatrice d'objets singuliers</p>
                            <div class="buttons has-addons is-pulled-right">
                            {%- if not current_path == "/" -%}
                                <a class="button is-link is-outlined is-pulled-right" href="/">Accueil</a>
                            {%- endif -%}
                            {%- if not page or page and not page.title == "Contact" -%}
                                <a class="button is-link is-outlined is-pulled-right" href="/contact">Me contacter</a>
                            {%- endif -%}
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="column is-full-until-widescreen is-offset-one-third">
            {%- if section -%}
                {%- if not section.extra.hide_title -%}
                    <h2 class="title is-3">{{- section.title -}}</h2>
                    {%- if section.extra.subtitle -%}
                        <p class="subtitle is-5 has-text-primary-dark">{{- section.extra.subtitle -}}</p>
                    {%- endif -%}
                {%- endif -%}
                {{- section.content | safe -}}
                {% for sect in section.subsections %}
                    {%- set sect = get_section(path=sect) %}
                    <section class="content-section">
                        <div class="columns is-mobile">
                            <div class="column">
                                <h2 class="title is-4"><a href="{{ get_url(path=sect.path | safe) }}">{{ sect.title }}</a></h2>
                                <p class="subtitle is-5">{{ sect.extra.subtitle }}</p>
                            </div>
                            {%- if sect.extra.button -%}
                            <div class="column is-pulled-right is-narrow">
                                <p>
                                    <a class="button" href="{{ get_url(path=sect.path | safe) ~ '#continue-reading' }}">{{- sect.extra.button -}}</a>
                                </p>
                            </div>
                            {%- endif -%}
                        </div>
                            {{- sect.content  | split(pat="<!-- cut -->") | first | safe -}}
                        <br>
                    </section>
                    {% if not loop.last %} <hr> {% endif %}
                {% endfor -%}
            {%- endif -%}
            {%- if page -%}
                {%- if not page.extra.hide_title -%}
                    <h2 class="title is-3">{{- page.title -}}</h2>
                    {%- if page.extra.subtitle -%}
                        <p class="subtitle is-5 has-text-primary-dark">{{- page.extra.subtitle -}}</p>
                    {%- endif -%}
                {%- endif -%}
                <div class="content">
                    {{- page.content | safe -}}
                </div>
            {%- endif -%}
        </div>
    </div>
    </div>
</div>
{% endblock content %}