<!DOCTYPE html>
<html>
    {% load static %}
    {% load qr_code %}

    <head>
        {% include 'tournaments/broadcast/base_head.html' %}

        <script src="{% static 'tournaments/js/alpine.min.js' %}"></script>

        <title>{% block head_title %}Page Title{% endblock %}</title>

        <!-- Matomo -->
        <script>
          var _paq = window._paq = window._paq || [];
          /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
          _paq.push(["setDocumentTitle", document.domain + "/" + document.title]);
          _paq.push(["setDoNotTrack", true]);
          _paq.push(['trackPageView']);
          _paq.push(['enableLinkTracking']);
          (function() {
            var u="//matomo.padelclub.app/";
            _paq.push(['setTrackerUrl', u+'matomo.php']);
            _paq.push(['setSiteId', '1']);
            var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
            g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
          })();
        </script>
        <!-- End Matomo Code -->

    </head>

    <body>

        <header>
            <div id="header">
                <div class="left-content bubble">
                    <img src="{% static 'tournaments/images/PadelClub_logo_512.png' %}" alt="logo" class="logo">
                    <div class="left-margin">
                        <h1 class="club">{% block first_title %}Page Title{% endblock %}</h1>
                        <h1 class="event">{% block second_title %}Page Title{% endblock %}</h1>
                    </div >
                </div>
                {% if qr_code_options %}
                <div class="right-content">{% qr_from_text qr_code_url options=qr_code_options %}</div>
                {% endif %}
            </div>
        </header>

        <div class="wrapper">

            <main>
            <!-- Content -->
            {% block content %}
            <!-- The content of child templates will be inserted here -->
            {% endblock %}
            </main>
        </div>
    </body>

</html>
