<!DOCTYPE html>
<html data-theme="cmyk">

<head>
  <title>Paris 2024 - {{translate_calendars}}</title>
  <link href="https://fabrice404.github.io/olympics-calendar/main.css?refresh={{refresh}}" rel="stylesheet">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="description" content="Paris 2024 - {{translate_calendars}}">
  <meta name="keywords" content="Paris 2024 - {{translate_calendars}}">
  <meta name="author" content="Fabrice LAMANT">
</head>

<body>
  <div class="p-4">
    <div class="navbar bg-base-100">
      <div class="navbar-start">
        <div class="dropdown">
          <div tabindex="0" role="button" class="btn btn-ghost btn-circle">
            <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24"
              stroke="currentColor">
              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h7" />
            </svg>
          </div>
          <ul tabindex="0" class="menu menu-sm dropdown-content bg-base-100 rounded-box z-50 mt-3 w-52 p-2 shadow">
            <li><a href="./index.html">{{translate_calendars}}</a></li>
            <li><a href="./today.html">{{translate_todaysEvents}}</a></li>
            <li><a href="./medals.html">{{translate_medalsTable}}</a></li>
            <hr />
            <!-- <li><a href="https://fabrice404.github.io/olympics-calendar/index.html">English</a></li>
            <li><a href="https://fabrice404.github.io/olympics-calendar/ja/index.html">日本語</a></li>
            <li><a href="https://fabrice404.github.io/olympics-calendar/ko/index.html">한국어</a></li>
            <li><a href="https://fabrice404.github.io/olympics-calendar/ru/index.html">Русский</a></li>
            <li><a href="https://fabrice404.github.io/olympics-calendar/zh/index.html">中文</a></li>
            <hr /> -->
            <li><a href="https://github.com/fabrice404/olympics-calendar" target="_blank">Source code</a></li>
          </ul>
        </div>
      </div>
      <div class="navbar-center">
        <a class="btn btn-ghost text-xl" href="./">Paris 2024 - {{translate_calendars}}</a>
      </div>
      <div class="navbar-end">
      </div>
    </div>

    <div>
      {{calendars}}
    </div>

    <dialog id="modal" class="modal">
      <div class="modal-box">
        </h3>
        <input type="text" class="input input-bordered w-full text-sm" id="link" readonly="readonly"></input>
        <div class="modal-action">
          <form method="dialog">
            <button class="btn">Close</button>
          </form>
        </div>
      </div>
    </dialog>

    <div class="text-sm my-10 text-center">
      {{translate_disclaimer}}
    </div>
  </div>
  <script>
    const showModal = (key, language) => {
      document.querySelector("#modal #link")
        .setAttribute('value', `https://fabrice404.github.io/olympics-calendar/${language}/${key}.ics`);
      modal.showModal();
    };
  </script>
  <!-- Google tag (gtag.js) -->
  <script async src="https://www.googletagmanager.com/gtag/js?id=G-0KQC1F1K4H"></script>
  <script>
    window.dataLayer = window.dataLayer || [];
    function gtag() { dataLayer.push(arguments); }
    gtag('js', new Date());
    gtag('config', 'G-0KQC1F1K4H');
  </script>
</body>
