{# Base template for (almost) all NetBox pages #}
{% load static %}
{% load helpers %}
{% load i18n %}
{% load django_htmx %}
<!DOCTYPE html>
<html
  lang="en"
  data-netbox-url-name="{{ request.resolver_match.url_name }}"
  data-netbox-base-path="{{ settings.BASE_PATH }}"
  {% with preferences|get_key:'ui.colormode' as color_mode %}
    data-netbox-color-mode="{{ color_mode|default:"unset" }}"
  {% endwith %}
  >
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width, viewport-fit=cover" />
    <meta name="htmx-config" content='{"scrollBehavior": "auto"}'>

    {# Page title #}
    <title>{% block title %}{% trans "Home" %}{% endblock %} | NetBox</title>

    {# Initialize color mode #}
    <script
      type="text/javascript"
      src="{% static 'setmode.js' %}"
      onerror="window.location='{% url 'media_failure' %}?filename=setmode.js'">
    </script>
    <script type="text/javascript">
      (function () {
        initMode()
      })();
      window.CSRF_TOKEN = "{{ csrf_token }}";
    </script>

    {# Static resources #}
    <link
      rel="stylesheet"
      href="{% static 'netbox-external.css'%}?v={{ settings.VERSION }}"
      onerror="window.location='{% url 'media_failure' %}?filename=netbox-external.css'"
    />
    <link
      rel="stylesheet"
      href="{% static 'netbox.css'%}?v={{ settings.VERSION }}"
      onerror="window.location='{% url 'media_failure' %}?filename=netbox.css'"
    />
    <link rel="icon" type="image/png" href="{% static 'netbox.ico' %}" />
    <link rel="apple-touch-icon" type="image/png" href="{% static 'netbox_touch-icon-180.png' %}" />

    {# Javascript #}
    <script
      type="text/javascript"
      src="{% static 'netbox.js' %}?v={{ settings.VERSION }}"
      onerror="window.location='{% url 'media_failure' %}?filename=netbox.js'">
    </script>
    {% django_htmx_script %}

    {# Additional <head> content #}
    {% block head %}{% endblock %}

  </head>
  <body>

    {# Page layout #}
    {% block layout %}{% endblock %}

    {# Additional Javascript #}
    {% block javascript %}{% endblock %}

    {# User messages #}
    {% include 'inc/messages.html' %}

  </body>
</html>
