{% extends "dtale/base.html" %}

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

{% block full_content %}
<header class="app-header">
    <span
        class="{{ '' if main_title_font else 'title-font '}}title-font-base"
        style="{{'font-family: ' + main_title_font if main_title_font else ''}}">
        {{ main_title if main_title else "D-TALE" }}
    </span>
    <span style="font-size: 16px" class="pl-5 mt-4">{{popup_title}}</span>
    <nav class="app-header__nav--secondary">
        <ul class="nav-menus">
            {% if grid_links|length > 0 %}
            <li>
                <div class="dropdown">
                    <span class="dropbtn nav-link dropdown-toggle">
                        {{back_to_data}}
                    </span>
                    <div class="dropdown-content">
                        {% for id, label in grid_links %}
                            <a href="../../main/{{id}}" class="dropdown-item data-grid-link" target="{{'_self' if is_vscode else '_blank'}}">
                                <span class="ml-3">{{label}}</span>
                            </a>
                        {% endfor %}
                    </div>
                </div>
            </li>
            {% endif %}
        </ul>
    </nav>
</header>
<div class="container-fluid {{js_prefix}}" style="padding-top: 2.25em !important">
    <div id="popup-content" />
</div>
{% endblock %}

{% block js %}
<script type="text/javascript" src="{{ url_for('static', filename='dist/dtale_bundle.js') }}"></script>
{% endblock %}
