<html>
    {% load static %}

    <head>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link
            rel="stylesheet" type="text/css"
            href="{% static 'tournaments/foundation.min.css' %}"
        />
        <link rel="stylesheet" href="{% static 'tournaments/css/basics.css' %}" />
        <link rel="stylesheet" type="text/css" href="{% static 'tournaments/style.css' %}" />

        <link
            rel="icon"
            type="image/png"
            href="{% static 'tournaments/favicon.png' %}"
        />

        <title>Padel Club</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>
        <div class="wrapper">
            <main class="page-body">
                <div class="container">
                    <div class="grid-x">
                        <div class="cell medium-6 large-6 topblock my-block">
                            <div class="bubble">
                                <img
                                    src="{% static 'tournaments/PadelClub_logo_512.png' %}"
                                    class="logo inline"
                                />
                                <div class="inline">
                                    <h1 class="club">Bienvenue !</h1>
                                    <h1 class="event">Tournois</h1>
                                    <!-- <span>Propulsé par Padel Club</span> -->
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="grid-x">
                        {% if live %}

                        <div class="cell medium-6 large-6 topblock my-block">
                            <div class="bubble">
                                <label class="matchtitle">En cours</label>
                                <div class="test1">test1</div>

                                {% for tournament in live %}

                                <div>
                                    <div class="w15 inline">
                                        <div>{{ tournament.level }}</div>
                                        <div>{{ tournament.category }}</div>
                                    </div>
                                    <div class="w60 inline">
                                        {{ tournament.event.club.name }}
                                    </div>
                                    <div class="w25 mybox inline">
                                        {{ tournament.start_date|date:"Y-m-d" }}
                                    </div>
                                </div>

                                {% endfor %}
                            </div>
                        </div>

                        {% endif %}
                    </div>
                </div>
            </main>
        </div>
    </body>
</html>
