{% extends "basic/layout.html" %}

{% if not theme_project_icon and favicon %}
    {% set theme_project_icon = pathto('_static/' ~ theme_touch_icon, 1) + favicon %}
{% endif %}

{% if not title or "no title" in title %}
    {% if pagename == "index" %}
        {% set title = project %}
    {% else %}
        {% set title = pagename %}
    {% endif %}
{% endif %}

{%- block extrahead %}
  {{ super() }}
  {% if theme_touch_icon %}
    <link rel="apple-touch-icon" href="{{ pathto('_static/' ~ theme_touch_icon, 1) }}" />
  {% endif %}
  {% if theme_canonical_url %}
    <link rel="canonical" href="{{ theme_canonical_url }}{{ pagename }}.html"/>
  {% endif %}
    <meta name="viewport" content="width=device-width, initial-scale=0.9, maximum-scale=0.9" />
    {{ themata_fetch_syntax_highlighter_css(pathto('_static/' ~ theme_touch_icon, 1), theme_syntax_highlighter, theme_syntax_highlighter_theme, theme_syntax_highlighter_iframe_embed) }}
  {% if theme_metadata %}
        <meta property="og:url" content="{{ theme_metadata.url }}{{ '' if theme_metadata.url.endswith('/') else '/' }}{{ pagename }}.html" />
    {% if theme_metadata.dynamic %}
        <meta name="description" content="{{ themata_extract_metadata(body, 'description', theme_metadata.description) }}" />
        <meta name="keywords" content="{{ themata_extract_metadata(body, 'keywords', theme_metadata.keywords) }}" />
        <meta name="author" content="{{ themata_extract_metadata(project, 'author', theme_metadata.author) }}" />
        <meta name="og:type" content="{{ themata_extract_metadata('website', 'type', theme_metadata.website) }}" />
        <meta name="og:title" content="{{ themata_extract_metadata(title + ' - ' + project + ' documentation', 'title', theme_metadata.title) }}" />
        <meta name="og:description" content="{{ themata_extract_metadata(body, 'description', theme_metadata.description) }}" />
        <meta name="og:image" content="{{ themata_extract_metadata(body, 'image', theme_metadata.image) }}" />
    {% else %}
        <meta name="description" content="{{ theme_metadata.description }}">
        <meta name="keywords" content="{{ theme_metadata.keywords }}">
        <meta name="author" content="{{ theme_metadata.author }}">
        <meta property="og:type" content="{{ theme_metadata.type }}" />
        <meta property="og:title" content="{{ theme_metadata.title }}" />
        <meta property="og:description" content="{{ theme_metadata.description }}" />
        <meta property="og:image" content="{{ theme_metadata.image }}" />
    {% endif %}
  {% endif %}
  {% if theme_twitter_metadata %}
        <meta name="twitter:card" content="{{ theme_twitter_metadata.card if theme_twitter_metadata.card else 'summary' }}" />
    {% if theme_metadata.dynamic %}
        <meta name="twitter:site" content="{{ themata_extract_metadata('@'+project, 'site', theme_twitter_metadata.site) }}" />
        <meta name="twitter:creator" content="{{ themata_extract_metadata('@'+project, 'site', theme_twitter_metadata.creator) }}" />
        <meta name="twitter:title" content="{{ themata_extract_metadata(title + ' - ' + project + ' documentation', 'title', theme_twitter_metadata.title) }}" />
        <meta name="twitter:description" content="{{ themata_extract_metadata(body, 'description', theme_twitter_metadata.description) }}" />
        <meta name="twitter:image" content="{{ themata_extract_metadata(body, 'image', theme_twitter_metadata.image) }}" />
    {% else %}
        <meta name="twitter:site" content="{{ theme_twitter_metadata.site }}" />
        <meta name="twitter:creator" content="{{ theme_twitter_metadata.creator }}" />
        <meta name="twitter:title" content="{{ theme_twitter_metadata.title }}" />
        <meta name="twitter:description" content="{{ theme_twitter_metadata.description }}" />
        <meta name="twitter:image" content="{{ theme_twitter_metadata.image }}" />
    {% endif %}
  {% endif %}
  {% if theme_google_analytics_tracking_id %}
    <!-- Global Site Tag (gtag.js) - Google Analytics -->
    <script async src="https://www.googletagmanager.com/gtag/js?id={{ theme_google_analytics_tracking_id }}"></script>
    <script>
        window.dataLayer = window.dataLayer || [];
        function gtag(){dataLayer.push(arguments);}
        gtag('js', new Date());
        gtag('config', '{{ theme_google_analytics_tracking_id }}');
    </script>
  {% endif %}
  <script>
      const __themataOnloadCallbacks = [];
      const __themataJsLoadedCallbacks = [];
      const themataCurrentPageTitle = "{{ title }}";
      const themataCurrentProject = "{{ project }}";
      const themataCurrentProjectGithubLocation = "{{ theme_github_repo }}";
      const themataCurrentPagePath = "{{ pagename }}{{ page_source_suffix }}";
      const themataCurrentPageLocation = "{{ theme_source_root }}/{{ pagename }}{{ page_source_suffix }}".replace("/edit/", "/blob/");
      const themataGithubFeedbackProjectTemplate = `{{ theme_github_feedback_project_template }}`;
      const themataGithubFeedbackPageTemplate = `{{ theme_github_feedback_page_template }}`;
      function themataRegisterOnloadCallback(cb) {
        __themataJsLoadedCallbacks.push(cb);
      }
      function themataRegisterJsLoadedCallback(cb) {
        __themataOnloadCallbacks.push(cb);
      }
  </script>
{% endblock %}

{%- block document %}
    <header>
        <div class="topnavbar">
            <div class="main-title">
                {% if theme_project_icon %}
                    <img class="icon" src="{{ theme_project_icon }}"></img>
                {% endif %}
                <a href="{{ pathto(master_doc) }}" class="title">{{ project }}</a>
            </div>
            <div class="search-container">
                <form class="search" action="{{ pathto('search', 1) }}.html" method="get">
                    <button type="submit"><i class="fa fa-search"></i></button>
                    <input type="text" placeholder="search..." name="q">
                </form>
            </div>
        </div>
    </header>
    <div class="documentwrapper">
        {% if theme_has_left_sidebar and not pagename.endswith(('.single')) and not pagename.endswith(('.right')) %}
            {% if (pagename != 'index') or (pagename == 'index' and not theme_index_is_single) %}
                {% if pagename not in theme_right_sidebar_only and pagename not in theme_no_sidebar %}
                <div class="sidebar-left">
                    </br>
                    {{ toctree(titles_only=True, includehidden=True) }}
                </div>
                {% endif %}
            {% endif %}
        {% endif %}
        <div class="bodywrapper">
                {% block body %} {% endblock %}
                
                </br>
                {% if theme_show_navigators %} 
                    {% if (pagename != 'index') or (pagename == 'index' and theme_show_navigators_in_index == True) %}
                        <div class="navigation">
                            {% if prev %}
                                <a class="reference navigator" style="float:left" href="{{ prev.link|e }}"><i class="fa fa-arrow-left"></i>{{ prev.title | replace("&lt;no title&gt;", "Previous Page") }}</a>
                            {% endif %}
                            {% if next %}
                                <a class="reference navigator" style="float:right;text-align:right;" href="{{ next.link|e }}">{{ next.title | replace("&lt;no title&gt;", "Next Page") }}<i class="fa fa-arrow-right"></i></a> 
                            {% endif %}           
                        </div>
                    {% endif %}
                {% endif %}
                <div style="clear:both"></div>
                <br/>
                {% if ((theme_enable_page_social_share == True) or (theme_page_rating_options != '') or theme_enable_github_page_feedback) == True %}
                    <div class="navigator" style="width: 100%; display: flex; flex-direction: column; padding: 15px; margin-bottom: 30px;">
                        <div style="display: flex; flex-direction: row;">
                            {% if theme_enable_page_social_share == True %}
                                <div style="display: flex; flex-direction: column; margin-top: 10px;">
                                    <span>{{ theme_social_share_label }}:</span>
                                    <div style="display: flex; flex-direction: row; flex-wrap: wrap; margin-top: 10px;">
                                        <a href="https://www.facebook.com/sharer/sharer.php?u=__themata_page_url__" target="_blank">
                                            <i class="fab fa-facebook" style="font-size: 35px; margin-right: 15px;"></i>
                                        </a>
                                        <a href="https://twitter.com/intent/tweet?text=Check this page {{ shorttitle }}: __themata_page_url__" target="_blank">
                                            <i class="fab fa-twitter" style="font-size: 35px; margin-right: 15px;"></i>
                                        </a>
                                        <a href="https://api.whatsapp.com//send?text=Check this page {{ shorttitle }}: __themata_page_url__" target="_blank">
                                            <i class="fab fa-whatsapp" style="font-size: 35px; margin-right: 15px;"></i>
                                        </a>
                                        <a href="https://www.linkedin.com/sharing/share-offsite/?url=__themata_page_url__" target="_blank">
                                            <i class="fab fa-linkedin" style="font-size: 35px; margin-right: 15px;"></i>
                                        </a>
                                        <!--<a href="#" target="_blank">
                                            <i class="fab fa-discord" style="font-size: 35px; margin-right: 15px;"></i>
                                        </a>-->
                                    </div>
                                </div>
                            {% endif %}
                            {% if theme_page_rating_options != '' %}
                                <div style="flex: 1; display: flex; flex-direction: column; align-items: flex-{{ 'end' if theme_enable_page_social_share == True else 'start' }};">
                                    <span>{{ theme_page_rating_options.title if theme_page_rating_options.title else "Did you find this page helpful?" }}</span> <!-- theme_option=page_rating_options.title -->
                                    <div style="display: flex; flex-direction: row; flex-wrap: wrap; margin-top: 10px;">
                                        <div style="overflow: hidden; border: 1px solid grey; padding: 10px 10px 5px 10px; cursor: pointer; width: 75px; height: 45px;" onclick='{{ theme_page_rating_options.positive_event }}'>
                                            {% if theme_page_rating_options.positive_icon %}
                                                {{ theme_page_rating_options.positive_icon }}
                                            {% else %}
                                                <i class="fa fa-smile" style="font-size: 40px; color: #FFCC4D;"></i>
                                            {% endif %}
                                        </div>
                                        <div style="overflow: hidden; border: 1px solid grey; padding: 10px 10px 5px 10px; cursor: pointer; width: 75px; height: 45px;" onclick='{{ theme_page_rating_options.negative_event }}'>
                                            {% if theme_page_rating_options.negative_icon %}
                                                {{ theme_page_rating_options.negative_icon }}
                                            {% else %}
                                                <i class="fa fa-frown" style="font-size: 40px; color: #FFCC4D;"></i>
                                            {% endif %}
                                        </div>
                                    </div>
                                </div>
                            {% endif %}
                            <!-- TOE -->
                        </div>
                        {% if theme_enable_github_page_feedback == True and theme_github_repo != '' %}
                            <div style="flex: 1; display: flex; flex-direction: column; {{ 'border-top: 1px solid #e6e6e6; margin-top: 20px; padding-top: 20px;' if ((theme_enable_page_social_share == True) or (theme_page_rating_options != '')) else '' }}">
                                <span id="__themata__feedback_label">{{ theme_github_page_feedback_title }}</span> <!-- theme_option=page_github_feedback -->
                                <div style="margin-top: 20px; display: flex; flex-direction: column; justify-content: space-between;">
                                    <div id="__themata__feedback_buttons_panel" style="display: flex; justify-content: space-between;">
                                        <div>
                                            <span id="__themata__feedback_this_product" class="reference navigator" style="cursor: pointer;"><i class="fab fa-github" style="margin-right: 10px;"> </i>This Project</span>
                                            <span id="__themata__feedback_this_page" class="reference navigator" style="cursor: pointer;"><i class="fab fa-github" style="margin-right: 10px;"> </i>This Page</span>
                                        </div>
                                        <a href='{{ theme_github_repo }}/issues?q="{{ title }}"&in=body' target="_blank">{{ theme_github_page_view_feedbacks_label }}</a>
                                    </div>
                                    <div id="__themata__feedback_input_panel" style="display: none; flex-direction: column; align-items: flex-end; padding-left: 7px;">
                                        <textarea id="__themata__feedback_textarea" style="border: 1px solid #e6e6e6; height: 120px; width: 100%;"></textarea>
                                        <span class="navigator" style="margin-top: 15px; max-width: 100px; margin-right: 0px; text-align: center; cursor: pointer;" onclick="themataSubmitGithubFeedback()">Submit</span>
                                    </div>
                                </div>
                            </div>
                        {% endif %}
                    </div>
                {% endif %}
                <hr/> <br/>
                
                <div class="footer">
                    <div class="social">
                        {% for social_icon in theme_social_icons %}
                            <a href="{{ social_icon[1] }}"><i class="{{ social_icon[0] }}"></i></a>
                        {% endfor %}
                    </div>
                    <div class="doc-sphinx-info">
                        {%- if show_copyright %}
                            {%- if hasdoc('copyright') %}
                                {% trans path=pathto('copyright'), copyright=copyright|e %}&copy; <a href="{{ path }}">Copyright</a> {{ copyright }}.{% endtrans %}
                            {%- else %}
                                {% trans copyright=copyright|e %}&copy; Copyright {{ copyright }}.{% endtrans %}
                            {%- endif %}
                        {%- endif %}
                        {%- if last_updated %}
                            {% trans last_updated=last_updated|e %}Last updated on {{ last_updated }}.{% endtrans %}
                        {%- endif %}
                        {%- if show_sphinx %}
                            {% trans sphinx_version=sphinx_version|e %}Created using <a href="http://sphinx.pocoo.org/">Sphinx</a> {{ sphinx_version }}
                            with <a href="https://thecarisma.github.io/themata/clear/index.html">clear</a> theme.{% endtrans %}
                        {%- endif %}
                    </div>
                </div>
                
                <br/><br/>
        </div>
        {% if theme_has_right_sidebar and not pagename.endswith(('.single')) and not pagename.endswith(('.left')) %}
            {% if (pagename != 'index') or (pagename == 'index' and not theme_index_is_single) %}
                {% if pagename not in theme_left_sidebar_only and pagename not in theme_no_sidebar %}
                <div class="sidebar-right">
                    {% if pagename != 'genindex' %}
                        <h2>Page Contents</h2>
                        {{ toc }}
                        {% if prev %}
                            <h2>Previous topic</h2>
                            <a href="{{ prev.link|e }}">{{ prev.title | replace("&lt;no title&gt;", "Previous Page") }}</a>
                        {% endif %}
                        {% if next %}
                            <h2>Next topic</h2>
                            <a href="{{ next.link|e }}">{{ next.title | replace("&lt;no title&gt;", "Next Page") }}</a>
                        {% endif %}
                        <h2>This Page</h2>
                        <a href="{{ pathto('_sources/', 1) }}{{ sourcename }}">Show source</a>
                        {% if theme_source_root != '' %}
                            <br/><a style="line-height: 25px;" href="{{ theme_source_root }}/{{ pagename }}{{ page_source_suffix }}">{{ theme_source_root_edit_text }}</a>
                        {% endif %}
                    {% endif %}
                </div>
                {% endif %}
            {% endif %}
        {% endif %}
        <div style="clear:both"></div>
    </div> 
    {% if theme_collapsible_sidebar == True %}
        <script>
            var coll = document.getElementsByClassName("caption");
            var i;

            for (i = 0; i < coll.length; i++) {
              coll[i].addEventListener("click", function() {
                this.classList.toggle("active");
                var content = this.nextElementSibling;
                if (content.style.display === "block") {
                  content.style.display = "none";
                } else {
                  content.style.display = "block";
                }
              });
            }
            </script>
    {% endif %}
    {{ themata_fetch_syntax_highlighter_js(pathto('_static/' ~ theme_touch_icon, 1), theme_syntax_highlighter, theme_code_block_editable, theme_syntax_highlighter_theme, theme_syntax_highlighter_iframe_embed) }}
    <script src="{{ pathto('_static/' ~ theme_touch_icon, 1) }}themata.js"></script>
{%- endblock %}


{% block footer %}{% endblock %}

{# do not display relbars nor sidebars #}
{% block relbar1 %}{% endblock %}
{% block relbar2 %}{% endblock %}
{% block sidebar1 %}{% endblock %}
{% block sidebar2 %}{% endblock %}