fix: huge refactor

web/templates/components/generic/navbar.html

@@ -1,102 +1,26 @@
 {% load i18n %}
 {% load static %}
-<nav class="navbar-bg">
-  <!-- Left side -->
-  <div class="navbar-content">
-    <div class="navbar-align">
+<nav class="navbar bg-base-100 shadow-sm">
+  <div class="flex-1">
 
-      <!-- Title -->
-      <div class="navbar-title">
-        <div class="shrink-0">
-          <a class="flex flex-row items-center" href="{% url 'web:index' %}">
-            <img class="w-8 h-8 mr-2" src="{{ logo }}" alt="{{ web_title }} logo">
-            <h1 class="navbar-web-title">{{ web_title }}</h1>
-          </a>
-        </div>
+    <a href="{% url 'web:index' %}" class="flex text-xl">
+      <img class="mr-4" src="{{ logo }}" alt="{{ web_title }} logo">
+      {{ web_title }}
+    </a>
 
-        <!-- Categories -->
-        <ul class="navbar-categories">
-          <li>
-            <a href="{% url 'web:index' %}" title=""
-               class="navbar-category-link">
-              {% translate 'Inicio' %}
-            </a>
-          </li>
-          {% for category in navbar_categories %}
-            <li class="shrink-0">
-              <a href="{% url 'web:category_view' slug=category.slug %}" title=""
-                 class="navbar-category-link">
-                {{ category.name }}
-              </a>
-            </li>
-          {% endfor %}
-        </ul>
-      </div>
+  </div>
 
-      <!-- Right side -->
-      <div class="relative flex items-center lg:space-x-2">
+  <div class="flex gap-2">
+    <input type="text" placeholder="{% trans 'Buscar...' %}" class="input input-bordered w-24 md:w-auto"/>
 
-        {% include 'components/theme-switch.html' %}
-        <!-- Show/Hide cart -->
-        <div id="navbar-cart-dropdown" hx-get="{% url 'web:cart_dropdown' %}"
-             hx-trigger="load, updated-cart from:body"></div>
-
-        {% if request.user.is_authenticated %}
-          <!-- Show/Hide user account dropdown -->
-          <button
-            hx-on:click="htmx.toggleClass(htmx.find('#userDropdown1'), 'hidden'); htmx.addClass(htmx.find('#myCartDropdown1'), 'hidden')"
-            id="userDropdownButton1"
-            data-dropdown-toggle="userDropdown1" type="button"
-            aria-label="show menu"
-            class="icon-button">
-            {% include 'components/icons/user.svg' %}
-            <span class="hidden sm:flex">
-              {% translate 'Mi cuenta' %}
-            </span>
-            {% include 'components/icons/dropdown.svg' %}
-          </button>
-
-          <!-- User account dropdown -->
-          <div id="userDropdown1"
-               class="absolute top-12 hidden z-12 w-56 divide-y divide-gray-100 overflow-hidden overflow-y-auto rounded-lg bg-white antialiased shadow dark:divide-gray-600 dark:bg-gray-700 right-0">
-            {% include 'components/users/user_dropdown.html' %}
-          </div>
-        {% else %}
-          <a href="{% url 'web:login' %}"
-             class="link-button">
-            {% translate 'Inicia sesión' %}
-          </a>
-        {% endif %}
-
-        <!-- Show/Hide menu items -->
-        <button hx-on:click="htmx.toggleClass(htmx.find('#ecommerce-navbar-menu-1'), 'hidden')" type="button"
-                data-collapse-toggle="ecommerce-navbar-menu-1" aria-controls="ecommerce-navbar-menu-1"
-                aria-expanded="false"
-                aria-label="show menu"
-                class="icon-button lg:hidden">
-          <span class="sr-only">
-            {% translate 'Abrir menú' %}
-          </span>
-          {% include 'components/icons/burger.svg' %}
-        </button>
-      </div>
-    </div>
-
-    <div id="ecommerce-navbar-menu-1"
-         class="navbar-dropdown-menu hidden">
-      <ul class="navbar-dropdown-menu-list">
-        <li>
-          <a href="{% url 'web:index' %}"
-             class="navbar-dropdown-menu-title">{% translate 'Inicio' %}</a>
-        </li>
-
-        {% for category in navbar_categories %}
-        <li>
-          <a href="{% url 'web:category_view' slug=category.slug %}"
-             class="navbar-dropdown-menu-title">{{ category.name }}</a>
-        </li>
-        {% endfor %}
-      </ul>
-    </div>
+    {% include 'components/generic/theme-switch.html' %}
+    {% if user.is_authenticated %}
+      {% include 'components/generic/user_dropdown.html' %}
+    {% else %}
+      <a href="{% url 'users:login' %}"
+         class="link-button flex items-center">
+        {% translate 'Inicia sesión' %}
+      </a>
+    {% endif %}
   </div>
 </nav>