<!DOCTYPE html>

{% load static wysiwyg tailwind_tags %}

<html lang="pl" dir="ltr" class="h-full">
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="description" content="Podlaski Związek Brydża Sportowego" />
    <meta name="author" content="Nikola Kubiczek" />

    <link rel="icon" href="{% static 'favicon.ico' %}" type="image/x-icon" />
    <link
      rel="icon"
      type="image/png"
      sizes="192x192"
      href="{% static 'icon-192x192.png' %}"
    />
    <link
      rel="icon"
      type="image/png"
      sizes="512x512"
      href="{% static 'icon-512x512.png' %}"
    />

    <title>
      {% block title %}Podlaski Związek Brydża Sportowego{% endblock %}
    </title>
    <base href="/" />

    {% tailwind_css %}
  </head>

  <body class="antialiased flex flex-col gap-4 bg-base h-full">
    <header class="w-full bg-header shadow-lg border-b border-slate-400 pb-1">
      <nav
        class="m-4 container flex flex-col lg:flex-row items-center lg:items-start justify-center mx-auto"
      >
        <div class="self-center">
          <img class="max-h-[200px]" src="{% static 'labs.png' %}" alt="" />
        </div>
        <div class="flex flex-col lg:self-end w-full">
          <div class="mb-4 mx-auto p-2 text-center">
            <h1>
              Łomżyńska Akademia <br />
              Brydża Sportowego
            </h1>
          </div>
          {% if nav %}
          <ul
            class="flex flex-wrap justify-center lg:items-end gap-3 text-[15px] leading-5 my-2"
          >
            {% for button in nav %}
            <li>
              <a
                class="nbutton home {% if button.href == '/' %}{{ home }}{% elif button.href in request.path %}active{% endif %}"
                href="{{ button.link }}"
                target="{% if button.blank %}_blank{% else %}_self{% endif %}"
                >{{ button.title }}</a
              >
            </li>
            {% endfor %}
          </ul>
          {% endif %}
        </div>
        {% if uppernav %}
        <ul class="flex flex-wrap justify-center lg:w-40 gap-3 lg:m-0 mt-2">
          {% for button in uppernav %}
          <li title="{{ button.title }}">
            <a
              href="{{ button.href }}"
              target="{% if button.blank %}_blank{% else %}_self{% endif %}"
              ><img
                class="max-h-12"
                src="{{ button.photo.url }}"
                alt="{{ button.title }}"
            /></a>
          </li>
          {% endfor %}
        </ul>
        {% endif %}
      </nav>
    </header>
    {% if banner %}
    <article class="bg-white shadow-lg">
      <ul class="lg:m-0 prose max-w-full w-full">
        {% content banner %}
        <div class="flex flex-wrap gap-4 justify-center items-center mb-4">
          {% buttons banner.buttons %}
        </div>
      </ul>
    </article>
    {% endif %}
    <main
      class="container xl:max-w-screen-xl mx-auto p-4 prose-img:my-1 prose-p:my-[0.3em]"
    >
      {% block content %}{% endblock %}
    </main>
    <footer class="footer flex flex-col items-center gap-8 text-center shadow-lg border-t border-slate-400 bg-footer h-full">
      <h6 class="mt-4 font-medium text-xl">Nasi Partnerzy:</h6>
      <div class="flex gap-8">
        <div class="self-center">
          <img class="max-h-[90px]" src="{% static 'msit.png' %}" alt="" />
        </div>
        <div class="self-center">
          <img class="max-h-[90px]" src="{% static 'lomza.jpg' %}" alt="" />
        </div>
        <div class="self-center">
          <img class="max-h-[90px]" src="{% static 'podlaskie.jpg' %}" alt="" />
        </div>
      </div>
      <h6 class="mb-4 font-light italic">&copy; {% now "Y" %} Nikola Kubiczek</h6>
    </footer>
  </body>
</html>
