<!DOCTYPE html>
<html lang="en">
    <head>
        <!-- Required meta tags always come first -->
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
        <meta http-equiv="x-ua-compatible" content="ie=edge">

        <script src="/static/main.js"></script>

        <title>{% block title %}{{ app.main_window.title }}{% endblock %}</title>

        <style>
            body {
                padding-top: 5rem;
            }

            iframe.toga.WebView {
                width: 100%;
            }

            span.toga.Label {
                display: inline-block;
            }

            input.toga.TextInput {
            }

        </style>
{% block bytecode %}
{% endblock %}
    </head>
    <body id="toga:{{ app.id }}"
        data-toga-class="toga.App"
        data-toga-name="{{ app.name }}"
        data-toga-app-id="{{ app.app_id }}"
        data-toga-ports="{{ app.ports }}"
        class="app">
        <div class="container">
{% block content %}
{% endblock %}
        </div>
    </body>
</head>
