django-unfold 0.63.0__py3-none-any.whl → 0.64.1__py3-none-any.whl

unfold/templates/unfold/components/table.html

@@ -11,10 +11,14 @@
         <div {% if height %}style="max-height: {{ height }}px;" data-simplebar{% endif %}>
             <table class="block border-spacing-none border-separate w-full lg:table">
                 {% if table.headers %}
-                    <thead class="text-font-important-light dark:text-font-important-dark {% if height %}sticky top-0{% endif %}">
+                    <thead class="text-font-important-light dark:text-font-important-dark {% if height %}sticky top-0 z-100{% endif %}">
                         <tr class="bg-base-50 dark:bg-base-900">
-                            {% for  header in table.headers %}
-                                <th class="align-middle border-b border-base-200 font-semibold py-2 text-left whitespace-nowrap sortable column-description hidden px-3 lg:table-cell dark:border-base-800 dark:bg-white/[.02] {% if card_included == 1 %}first:pl-6 last:pr-6{% endif %}">
+                            {% if table|has_nested_tables %}
+                                <th class="align-middle border-b border-base-200 font-semibold py-2 text-left whitespace-nowrap hidden px-3 lg:table-cell dark:border-base-800 dark:bg-white/[.02]"></th>
+                            {% endif %}
+
+                            {% for header in table.headers %}
+                                <th class="align-middle border-b border-base-200 font-semibold py-2 text-left whitespace-nowrap hidden px-3 lg:table-cell dark:border-base-800 dark:bg-white/[.02] {% if card_included == 1 %}first:pl-6 last:pr-6{% endif %}">
                                     {{ header|capfirst }}
                                 </th>
                             {% endfor %}
@@ -23,17 +27,59 @@
                 {% endif %}
 
                 {% if table.rows %}
-                    <tbody class="block lg:table-row-group">
-                        {% for row in table.rows %}
-                            <tr class="{% if striped == 1 %}{% cycle '' 'bg-base-50 dark:bg-white/[.02]' %}{% endif %} block group {% if forloop.first %}first-row{% endif %} {% if not card_included == 1 %}border border-base-200 mb-3 rounded-default shadow-xs{% else %}border-b border-base-200 last:border-b-0{% endif %} lg:table-row lg:border-none lg:mb-0 lg:shadow-none dark:border-base-800">
-                                {% for cell in row %}
+                    {% for row in table.rows %}
+                        <tbody class="block relative lg:table-row-group" x-data="{ rowOpen: false }">
+                            <tr class="{% if striped == 1 %}{% cycle '' 'bg-base-50 dark:bg-white/[.02]' %}{% endif %} block group {% if forloop.first %}first-row{% endif %} {% if not card_included == 1 %}border border-base-200 mb-3 rounded-default shadow-xs{% else %}border-b border-base-200 {% if forloop.last %}last:border-b-0{% endif %}{% endif %} lg:table-row lg:border-none lg:mb-0 lg:shadow-none dark:border-base-800">
+                                {% if row.table.rows %}
+                                    <td class="cursor-pointer px-3 py-2 lg:pr-0 align-middle flex border-t border-base-200 font-normal gap-4 min-w-0 overflow-hidden text-left before:flex before:capitalize before:content-[attr(data-label)] before:font-semibold before:text-font-important-light dark:before:text-font-important-dark before:items-center before:mr-auto max-lg:first:border-t-0 lg:group-[.first-row]:border-t-0 lg:before:hidden lg:py-3 lg:table-cell dark:border-base-800 lg:w-px" data-label="{% trans "Expand row" %}">
+                                        <span class="material-symbols-outlined select-none block! h-[18px] w-[18px] -rotate-90 transition-all" x-on:click="rowOpen = !rowOpen" x-bind:class="{'rotate-0': rowOpen}">
+                                            expand_more
+                                        </span>
+                                    </td>
+                                {% endif %}
+
+                                {% for cell in row.cols|default:row %}
                                     <td class="px-3 py-2 align-middle flex border-t border-base-200 font-normal gap-4 min-w-0 overflow-hidden text-left before:flex before:capitalize before:content-[attr(data-label)] before:font-semibold before:text-font-important-light dark:before:text-font-important-dark before:items-center before:mr-auto first:border-t-0 lg:group-[.first-row]:border-t-0 lg:before:hidden {% if not forloop.parentloop.first %}lg:first:border-t{% endif %} lg:py-3 lg:table-cell dark:border-base-800 {% if card_included == 1 %}lg:first:pl-6 lg:last:pr-6{% endif %}" {% if table.headers %}data-label="{{ table.headers|index:forloop.counter0 }}"{% endif %}>
                                         {{ cell }}
                                     </td>
                                 {% endfor %}
                             </tr>
-                        {% endfor %}
-                    </tbody>
+
+                            {% if "table" in row %}
+                                <tr class="block lg:table-row" x-show="rowOpen">
+                                    <td class="block lg:table-cell" colspan="100%">
+                                        <div class="absolute bg-primary-600 -bottom-px hidden left-0 top-0 w-0.5 z-[50] lg:block" x-show="rowOpen"></div>
+
+                                        <table class="block w-full lg:table">
+                                            {% if row.table.headers %}
+                                                <thead>
+                                                    <tr class="bg-base-50 dark:bg-white/[.02]">
+                                                        {% for header in row.table.headers %}
+                                                            <th class="align-middle border-b border-t border-base-200 font-semibold py-2 text-left whitespace-nowrap sortable column-description hidden px-3 lg:table-cell dark:border-base-800 dark:bg-white/[.02]">
+                                                                {{ header }}
+                                                            </th>
+                                                        {% endfor %}
+                                                    </tr>
+                                                </thead>
+                                            {% endif %}
+
+                                            <tbody class="block lg:table-row-group">
+                                                {% for nested_row in row.table.rows %}
+                                                    <tr class="{% if row.table.striped == 1 %}{% cycle '' 'bg-base-50 dark:bg-white/[.02]' %}{% endif %} block group {% if forloop.first %}first-row{% endif %} border border-base-200 mb-3 rounded-default shadow-xs lg:table-row lg:border-none lg:mb-0 lg:shadow-none dark:border-base-800">
+                                                        {% for cell in nested_row %}
+                                                            <td class="px-3 py-2 align-middle flex border-t border-base-200 font-normal gap-4 min-w-0 overflow-hidden text-left before:flex before:capitalize before:content-[attr(data-label)] before:font-semibold before:text-font-important-light dark:before:text-font-important-dark before:items-center before:mr-auto first:border-t-0 lg:group-[.first-row]:border-t-0 lg:before:hidden {% if not forloop.parentloop.first %}lg:first:border-t{% endif %} lg:py-3 lg:table-cell dark:border-base-800" {% if row.table.headers %}data-label="{{ row.table.headers|index:forloop.counter0 }}"{% endif %}>
+                                                                {{ cell }}
+                                                            </td>
+                                                        {% endfor %}
+                                                    </tr>
+                                                {% endfor %}
+                                            </tbody>
+                                        </table>
+                                    </td>
+                                </tr>
+                            {% endif %}
+                        </tbody>
+                    {% endfor %}
                 {% endif %}
             </table>
         </div>

unfold/templates/unfold/helpers/boolean.html

@@ -1,15 +1,15 @@
 {% load i18n %}
 
-<div class="flex items-center ">
-    <div class="block mr-3 outline rounded-full ml-1 h-1 w-1 {% if value == '' or value == None %}bg-base-500 outline-gray-500/20{% elif value %}bg-green-500 outline-green-200 dark:outline-green-500/20{% else %}bg-red-500 outline-red-200 dark:outline-red-500/20{% endif %}"></div>
+<div class="inline-flex font-semibold items-center justify-center leading-normal h-6 w-6 rounded-full uppercase whitespace-nowrap {% if value == '' or value == None %}bg-base-100 text-base-700 dark:bg-base-500/20 dark:text-base-200{% elif value %}bg-green-100 text-green-700 dark:bg-green-500/20 dark:text-green-400{% else %}bg-red-100 text-red-700 dark:bg-red-500/20 dark:text-red-400{% endif %}"
+     title="{% if value == '' or value == None %}{% trans "Unknown" %}{% elif value %}{% trans "True" %}{% else %}{% trans "False" %}{% endif %}">
 
-    <span>
+    <span class="material-symbols-outlined">
         {% if value == '' or value == None %}
-            {% trans 'Unknown' %}
+            question_mark
         {% elif value %}
-            {% trans 'True' %}
+            check_small
         {% else %}
-            {% trans 'False' %}
+            close_small
         {% endif %}
     </span>
 </div>

unfold/templates/unfold/helpers/command.html

@@ -0,0 +1,53 @@
+{% load i18n %}
+
+{% if request.user.is_staff %}
+    <div class="backdrop-blur-xs bg-base-900/80 flex flex-col fixed inset-0 p-4 lg:p-32 z-[1000]"
+         x-data="searchCommand()"
+         x-on:opencommand.window="handleOpen()"
+         x-on:keydown.window="handleShortcut($event)"
+         x-show="openCommandResults">
+        <div class="bg-white flex flex-col max-w-3xl min-h-0 mx-auto overflow-hidden rounded-default shadow-lg w-full dark:bg-base-800" x-on:click.outside="handleOutsideClick()">
+            <div class="flex flex-row items-center px-4 w-full">
+                <button type="submit" id="command-submit" class="group flex items-center focus:outline-hidden">
+                    <span class="block material-symbols-outlined text-xl text-base-400 dark:text-base-500 group-[.htmx-request]:hidden">
+                        search
+                    </span>
+
+                    <span class="hidden material-symbols-outlined text-xl text-base-400 dark:text-base-500 group-[.htmx-request]:block animate-spin">
+                        progress_activity
+                    </span>
+                </button>
+
+                <input
+                    autocomplete="off"
+                    type="search"
+                    placeholder="{% trans "Type to search" %}"
+                    class="font-medium grow px-2 py-4 placeholder-font-subtle-light text-font-default-light focus:outline-hidden dark:placeholder-font-subtle-dark dark:text-font-default-dark"
+                    name="s"
+                    id="search-input-command"
+                    x-ref="searchInputCommand"
+                    hx-indicator="#command-submit"
+                    x-on:keydown.escape.prevent="handleEscape()"
+                    x-on:keydown.arrow-down.prevent="nextItem()"
+                    x-on:keydown.arrow-up.prevent="prevItem()"
+                    x-on:keydown.enter.prevent="selectItem()"
+                    hx-get="{% url "admin:search" %}?extended=1"
+                    hx-trigger="keyup changed delay:500ms"
+                    hx-select="#command-results-list"
+                    hx-select-oob="#command-results-note"
+                    hx-target="#command-results">
+
+                {% include "unfold/helpers/shortcut.html" with shortcut="esc" %}
+            </div>
+
+            <div class="grow h-full overflow-auto w-full dark:border-base-700" data-simplebar x-on:htmx:after-swap="handleContentLoaded($event)" x-bind:class="{'border-t border-base-200': items !== undefined && items.length > 0}">
+                <div id="command-results"></div>
+
+                {% if command_show_history %}
+                    {% include "unfold/helpers/command_history.html" %}
+                {% endif %}
+
+                <div id="command-results-note"></div>
+            </div>
+        </div>
+{% endif %}

unfold/templates/unfold/helpers/command_history.html

@@ -0,0 +1,54 @@
+{% load i18n %}
+
+<div id="command-history" x-show="!hasResults">
+    <template x-if="commandHistory.length > 0">
+        <div class="">
+            <h3 class="border-b border-base-200 font-semibold text-font-important-light dark:text-font-important-dark dark:border-base-700 p-4">
+                {% trans "Recent searches" %}
+            </h3>
+
+            <ul>
+                <template x-for="(item, index) in commandHistory">
+                    <li class="border-b border-base-200 dark:border-base-700 last:border-b-0"
+                        x-bind:class="{'active': currentIndex === index + 1}"
+                        x-on:mouseenter="currentIndex = index + 1">
+                        <a class="block flex flex-row gap-4 items-center p-4 transition-colors"
+                           x-bind:data-title="item.title"
+                           x-bind:data-description="item.description"
+                           x-bind:href="item.link"
+                           x-bind:class="{'bg-base-50 dark:bg-white/[.04]': currentIndex === index + 1}">
+                            <span class="truncate">
+                                <span class="font-medium text-font-important-light dark:text-font-important-dark" x-text="item.title"></span>
+                                <span class="mx-1 opacity-50 group-[.active]:text-white">•</span>
+                                <span class="text-font-subtle-light dark:text-font-subtle-dark group-[.active]:text-white" x-text="item.description"></span>
+                            </span>
+
+                            <span class="flex flex-row items-center ml-auto">
+                                <span class="material-symbols-outlined text-base-400 dark:text-base-500 hover:text-primary-600 dark:hover:text-primary-500"
+                                      x-on:click="toggleFavorite($event, index);"
+                                      x-bind:class="{'text-primary-600 dark:text-primary-500': item.favorite}">
+                                    favorite
+                                </span>
+
+                                <span class="bg-base-200 h-6 w-px mx-3"></span>
+
+                                <span class="material-symbols-outlined text-base-400 dark:text-base-500 hover:text-base-500 dark:hover:text-base-400" x-on:click="removeFromHistory($event, index);">
+                                    close
+                                </span>
+                            </span>
+                        </a>
+                    </li>
+                </template>
+            </ul>
+        </div>
+    </template>
+
+    <template x-if="commandHistory.length === 0">
+        <div class="border-t border-base-200 px-4 py-8 dark:border-base-700">
+            <p class="text-lg text-center">
+                {% trans "No recent searches" %}
+            </p>
+        </div>
+    </template>
+</div>
+</div>

unfold/templates/unfold/helpers/command_results.html

@@ -0,0 +1,50 @@
+{% load i18n %}
+
+{% if results %}
+    <ul id="command-results-list" class="flex flex-col gap-1.5 p-4">
+        {% for item in results %}
+            <li class="group"
+                x-bind:class="{'active': currentIndex === {{ forloop.counter }}}"
+                x-on:mouseenter="currentIndex = {{ forloop.counter }}">
+                <a class="bg-base-100 flex items-center rounded-default px-3.5 py-3 transition-colors group-[.active]:bg-primary-600 group-[.active]:text-white dark:bg-white/[.04] dark:text-base-200 dark:group-[.active]:bg-primary-600 dark:group-[.active]:text-white"
+                   href="{{ item.link }}"
+                   data-title="{{ item.title }}"
+                   data-description="{{ item.description }}"
+                   x-on:click="selectItem({% if command_show_history %}true{% else %}false{% endif %})">
+                    {% if item.icon %}
+                        <span class="bg-white border border-base-300 h-8 mr-4 w-8 flex items-center justify-center rounded-default group-[.active]:bg-transparent group-[.active]:border-white/40 dark:bg-base-800 dark:border-base-700">
+                            <span class="material-symbols-outlined text-font-subtle-light text-sm dark:text-font-subtle-dark group-[.active]:text-white">
+                                {{ item.icon }}
+                            </span>
+                        </span>
+                    {% endif %}
+
+                    <span>
+                        <span class="font-medium">{{ item.title }}</span>
+                        <span class="mx-1 opacity-50 group-[.active]:text-white">•</span>
+                        <span class="text-font-subtle-light dark:text-font-subtle-dark group-[.active]:text-white">{{ item.description|capfirst }}</span>
+                    </span>
+
+                    <span class="material-symbols-outlined ml-auto text-sm transition-all group-[.active]:text-white group-[.active]:-mr-1">arrow_forward</span>
+                </a>
+            </li>
+        {% endfor %}
+    </ul>
+{% else %}
+    <ul id="command-results-list" class="px-4 py-8 flex items-center justify-center">
+        <li class="text-lg">
+            {% trans "No results matching your query" %}
+        </li>
+    </ul>
+{% endif %}
+
+
+<div id="command-results-note" x-show="hasResults">
+    <div class="border-t border-base-200 px-4 py-3 flex items-center justify-center text-xs dark:border-base-700">
+        {% blocktranslate count counter=results|length with time=execution_time|floatformat:2 %}
+            Found {{ counter }} result in {{ time }} seconds
+        {% plural %}
+            Found {{ counter }} results in {{ time }} seconds
+        {% endblocktranslate %}
+    </div>
+</div>

unfold/templates/unfold/helpers/header_back_button.html

@@ -1,7 +1,15 @@
-{% load admin_urls i18n %}
+{% load admin_urls i18n unfold %}
 
 {% if show_back_button %}
-    {% if opts and adminform %}
+    {% if object %}
+        {% url object|admin_object_app_url:"changelist" as changelist_url %}
+
+        <a href="{{ changelist_url }}" class="block h-[18px] mr-3" title="{% trans "Go back" %}">
+            <span class="material-symbols-outlined">
+                arrow_back
+            </span>
+        </a>
+    {% elif opts and adminform %}
         {% url opts|admin_urlname:'changelist' as changelist_url %}
 
         <a href="{% add_preserved_filters changelist_url %}" class="block h-[18px] mr-3" title="{% trans "Go back" %}">

unfold/templates/unfold/helpers/header_title.html

@@ -0,0 +1,11 @@
+{% spaceless %}
+    {% for part in parts %}
+        <{% if part.link %}a href="{{ part.link }}"{% else %}span{% endif %} class="align-middle inline-block leading-5 tracking-tight">
+        {{ part.title|capfirst }}
+        </{% if part.link %}a{% else %}span{% endif %} >
+
+        {% if not forloop.last %}
+            <span class="material-symbols-outlined inline-block align-middle leading-5 mx-2 text-base-400 dark:text-base-500">chevron_right</span>
+        {% endif %}
+    {% endfor %}
+{% endspaceless %}

unfold/templates/unfold/helpers/label.html

@@ -1,4 +1,4 @@
-<span class="inline-block font-semibold leading-normal px-2 py-1 rounded-default text-[11px] uppercase whitespace-nowrap
+<span class="inline-block font-semibold h-6 leading-6 px-2 rounded-default text-[11px] uppercase whitespace-nowrap
              {% if type == 'info' %}
                  bg-blue-100 text-blue-700 dark:bg-blue-500/20 dark:text-blue-400
              {% elif type == 'danger' %}

unfold/templates/unfold/helpers/navigation_header.html

@@ -1,6 +1,6 @@
 {% load unfold %}
 
-<div class="border-b border-base-200 flex gap-3 items-center h-[65px] mb-5 dark:border-base-800 px-3 {% element_classes 'navigation_header' %}" {% if site_dropdown %}x-data="{ openDropdown: false }"{% endif %}>
+<div class="border-b border-base-200 flex gap-3 items-center h-[65px] mb-6 dark:border-base-800 px-3 {% element_classes 'navigation_header' %}" {% if site_dropdown %}x-data="{ openDropdown: false }"{% endif %}>
     <div class="bg-transparent flex font-semibold gap-3 grow min-w-0 -mx-px h-[54px] items-center px-3 {% if site_dropdown %}cursor-pointer rounded-default transition-all hover:bg-base-100 dark:hover:bg-white/[.06]{% endif %}"
          {% if site_dropdown %}
              x-on:click="openDropdown = !openDropdown"
@@ -14,7 +14,7 @@
         {% endif %}
 
         {% if site_dropdown %}
-            <span class="material-symbols-outlined ml-auto select-none">
+            <span class="material-symbols-outlined ml-auto select-none text-font-default-light dark:text-font-default-dark">
                 unfold_more
             </span>
         {% endif %}

unfold/templates/unfold/helpers/search.html

@@ -1,30 +1,48 @@
 {% load i18n %}
 
 {% if sidebar_show_search %}
-    <div class="mb-2.5 mx-3 relative" x-data="searchDropdown()" x-on:keydown.window="applyShortcut($event)" x-on:click.outside="openSearchResults = false">
-        <div class="bg-white border border-base-200 flex flex-row items-center px-3 rounded-default relative shadow-xs w-full focus-within:outline-2 focus-within:-outline-offset-2 focus-within:outline-primary-600 dark:bg-base-900 dark:border-base-700">
-            <span class="material-symbols-outlined md-18 text-base-400">manage_search</span>
+    {% if sidebar_command_search %}
+        <div class="mb-2.5 mx-3 relative" x-on:click="$dispatch('opencommand')">
+            <div class="bg-white border border-base-200 cursor-pointer flex flex-row items-center px-3 rounded-default relative shadow-xs w-full focus-within:outline-2 focus-within:-outline-offset-2 focus-within:outline-primary-600 dark:bg-base-900 dark:border-base-700">
+                <span class="material-symbols-outlined md-18 text-base-400">manage_search</span>
 
-            <input type="search"
-                   id="nav-filter"
-                   name="s"
-                   x-ref="searchInput"
-                   x-on:focus="openSearchResults = true; currentIndex = 0"
-                   x-on:keydown.arrow-down.prevent="nextItem()"
-                   x-on:keydown.arrow-up.prevent="prevItem()"
-                   x-on:keydown.escape.prevent="openSearchResults = false; if ($refs.searchInput.value === '') { $refs.searchInput.blur() } else { $refs.searchInput.value = '' }"
-                   x-on:keydown.enter.prevent="selectItem()"
-                   x-on:search="currentIndex = 0"
-                   hx-get="{% url "admin:search" %}"
-                   hx-trigger="keyup changed delay:500ms"
-                   hx-target="#search-results"
-                   class="grow font-medium min-w-0 overflow-hidden p-2 placeholder-font-subtle-light truncate focus:outline-hidden dark:bg-base-900 dark:placeholder-font-subtle-dark dark:text-font-default-dark"
-                   placeholder="{% translate 'Search apps and models...' %}"
-                   aria-label="{% translate 'Filter navigation items' %}">
+                <div class="grow font-medium min-w-0 overflow-hidden p-2 text-font-subtle-light truncate focus:outline-hidden dark:bg-base-900 dark:text-font-subtle-dark">
+                    {% trans 'Search apps and models...' %}
+                </div>
 
-            {% include "unfold/helpers/shortcut.html" with shortcut="t" %}
+                {% if 'Macintosh' in request.META.HTTP_USER_AGENT %}
+                    {% include "unfold/helpers/shortcut.html" with shortcut="⌘K" %}
+                {% else %}
+                    {% include "unfold/helpers/shortcut.html" with shortcut="Ctrl + K" %}
+                {% endif %}
+            </div>
         </div>
+    {% else %}
+        <div class="mb-2.5 mx-3 relative" x-data="searchDropdown()" x-on:keydown.window="applyShortcut($event)" x-on:click.outside="openSearchResults = false">
+            <div class="bg-white border border-base-200 flex flex-row items-center px-3 rounded-default relative shadow-xs w-full focus-within:outline-2 focus-within:-outline-offset-2 focus-within:outline-primary-600 dark:bg-base-900 dark:border-base-700">
+                <span class="material-symbols-outlined md-18 text-base-400">manage_search</span>
 
-        <div id="search-results" x-show="openSearchResults"></div>
-    </div>
+                <input type="search"
+                       id="nav-filter"
+                       name="s"
+                       x-ref="searchInput"
+                       x-on:focus="openSearchResults = true; currentIndex = 0"
+                       x-on:keydown.arrow-down.prevent="nextItem()"
+                       x-on:keydown.arrow-up.prevent="prevItem()"
+                       x-on:keydown.escape.prevent="openSearchResults = false; if ($refs.searchInput.value === '') { $refs.searchInput.blur() } else { $refs.searchInput.value = '' }"
+                       x-on:keydown.enter.prevent="selectItem()"
+                       x-on:search="currentIndex = 0"
+                       hx-get="{% url "admin:search" %}"
+                       hx-trigger="keyup changed delay:500ms"
+                       hx-target="#search-results"
+                       class="grow font-medium min-w-0 overflow-hidden p-2 placeholder-font-subtle-light truncate focus:outline-hidden dark:bg-base-900 dark:placeholder-font-subtle-dark dark:text-font-default-dark"
+                       placeholder="{% trans 'Search apps and models...' %}"
+                       aria-label="{% trans 'Filter navigation items' %}">
+
+                {% include "unfold/helpers/shortcut.html" with shortcut="t" %}
+            </div>
+
+            <div id="search-results" x-show="openSearchResults"></div>
+        </div>
+    {% endif %}
 {% endif %}

unfold/templates/unfold/helpers/search_results.html

@@ -2,11 +2,11 @@
     <ul class="absolute bg-white border border-base-200 flex flex-col leading-none left-0 mt-12 py-1 right-0 rounded-default top-0 shadow-xs text-sm z-10 dark:bg-base-800 dark:border-base-700">
         {% for item in results %}
             <li class="mx-1">
-                <a href="{{ item.model.admin_url }}"
+                <a href="{{ item.link }}"
                    class="block items-center px-3 py-2 rounded-default truncate"
                    x-on:mouseenter="currentIndex = {{ forloop.counter }}"
                    x-bind:class="{'bg-base-100 text-base-700 dark:bg-base-700 dark:text-base-200': currentIndex === {{ forloop.counter }}}">
-                    {{ item.app.name }} <span class="text-font-subtle-light mx-1 dark:text-font-subtle-dark">/</span> {{ item.model.name }}
+                    {{ item.title }} <span class="text-font-subtle-light mx-1 dark:text-font-subtle-dark">/</span> {{ item.description }}
                 </a>
             </li>
         {% endfor %}

unfold/templates/unfold/helpers/shortcut.html

@@ -1,3 +1,3 @@
-<kbd class="bg-base-50 border border-base-200 font-mono text-xs text-font-subtle-light rounded-xs px-1 dark:bg-white/[.04] dark:border-base-700 dark:text-font-subtle-dark">
+<kbd class="bg-base-50 border border-base-200 font-sans text-xs text-font-subtle-light rounded-xs px-1 whitespace-nowrap dark:bg-white/[.04] dark:border-base-700 dark:text-font-subtle-dark">
     {{ shortcut }}
 </kbd>

unfold/templates/unfold/helpers/site_dropdown.html

@@ -3,7 +3,7 @@
 {% if site_dropdown %}
     <div class="absolute bg-white border border-base-200 flex flex-col left-3 py-1 rounded-default shadow-lg top-[73px] w-[264px] z-50 dark:bg-base-800 dark:border-base-700" x-cloak x-show="openDropdown" x-transition x-on:click.outside="openDropdown = false">
         {% for item in site_dropdown %}
-            <a href="{{ item.link }}" class="flex flex-row items-center gap-3 max-h-[30px] mx-1 px-2 py-2 rounded-default hover:bg-base-100 hover:text-base-700 dark:hover:bg-base-700 dark:hover:text-base-200">
+            <a href="{{ item.link }}" class="flex flex-row items-center gap-3 max-h-[30px] mx-1 px-2 py-2 rounded-default text-font-default-light dark:text-font-default-dark hover:bg-base-100 hover:text-font-important-light dark:hover:bg-base-700 dark:hover:text-font-important-dark">
                 {% if item.icon %}
                     <span class="material-symbols-outlined">
                         {{ item.icon }}

unfold/templates/unfold/helpers/tab_items.html

@@ -1,47 +1,29 @@
 {% load i18n %}
 
 {% if inlines_list or tabs_list %}
-    <ul class="border border-base-200 rounded-default flex flex-col max-md:w-full md:flex-row md:border-b-0 md:border-t-0 md:border-l-0 md:border-r-0 dark:border-base-800">
+    <nav class="bg-base-100 flex flex-col font-medium gap-1 p-1 rounded-default w-full dark:border-base-700 md:flex-row md:w-auto dark:bg-white/[.04] *:flex *:flex-row *:font-medium *:items-center *:px-2.5 *:py-[5px] *:rounded-default *:transition-colors *:hover:bg-base-700/[.04] *:dark:hover:bg-white/[.04] [&>.active]:bg-white [&>.active]:shadow-xs [&>.active]:text-font-important-light [&>.active]:hover:bg-white [&>.active]:dark:bg-base-900 [&>.active]:dark:hover:bg-base-900 [&>.active]:dark:text-font-important-dark">
         {% for item in tabs_list %}
             {% if item.has_permission %}
-                <li class="border-b border-base-200 last:border-b-0 md:border-b-0 md:mr-8 dark:border-base-800">
-                    <a href="{% if item.link_callback %}{{ item.link_callback }}{% else %}{{ item.link }}{% endif %}{% if item.inline %}#{{ item.inline|slugify }}{% endif %}"
-                       class="block px-3 py-2 md:py-4 md:px-0 dark:border-base-800 {% if item.active and not item.inline %} border-b font-semibold -mb-px text-primary-600 hover:text-primary-600 dark:text-primary-500 dark:hover:text-primary-500 md:border-primary-500 dark:md:border-primary-600!{% else %}font-medium hover:text-primary-600 dark:hover:text-primary-500{% endif %}"
-                       {% if item.inline %}
-                           x-on:click="activeTab = '{{ item.inline|slugify }}'"
-                           x-bind:class="{'border-b border-base-200 dark:border-base-800 md:border-primary-500 dark:md:border-primary-600! font-semibold -mb-px text-primary-600 dark:text-primary-500': activeTab == '{{ item.inline|slugify }}'}"
-                       {% endif %}
-                    >
-                        {{ item.title }}
-                    </a>
-                </li>
+                <a href="{% if item.link_callback %}{{ item.link_callback }}{% else %}{{ item.link }}{% endif %}{% if item.inline %}#{{ item.inline|slugify }}{% endif %}" class="{% if item.active and not item.inline %}active{% endif %}" {% if item.inline %}x-on:click="activeTab = '{{ item.inline|slugify }}'" x-bind:class="{'active': activeTab == '{{ item.inline|slugify }}'}"{% endif %}>
+                    {{ item.title }}
+                </a>
             {% endif %}
         {% endfor %}
 
         {% if inlines_list %}
-            <li class="border-b last:border-b-0 md:border-b-0 md:mr-8 dark:border-base-800">
-                <a class="block cursor-pointer font-medium px-3 py-2 md:py-4 md:px-0"
-                   href="#general"
-                   x-on:click="activeTab = 'general'"
-                   x-bind:class="{'border-b border-base-200 dark:border-base-800 md:border-primary-500 dark:md:border-primary-600! font-semibold -mb-px text-primary-600 dark:text-primary-500': activeTab == 'general', 'hover:text-primary-600 dark:hover:text-primary-500 dark:border-base-800': activeTab != 'general'}">
-                    {% trans "General" %}
-                </a>
-            </li>
+            <a href="#general" x-on:click="activeTab = 'general'" x-bind:class="{'active': activeTab == 'general'}">
+                {% trans "General" %}
+            </a>
 
             {% for inline in inlines_list %}
-                <li class="border-b last:border-b-0 md:border-b-0 md:mr-8 dark:border-base-800">
-                    <a class="block cursor-pointer font-medium px-3 py-2 md:py-4 md:px-0"
-                       href="#{{ inline.formset.prefix|slugify }}"
-                       x-on:click="activeTab = '{{ inline.formset.prefix|slugify }}'"
-                       x-bind:class="{'border-b border-base-200 dark:border-base-800 md:border-primary-500 dark:md:border-primary-600! font-semibold -mb-px text-primary-600 dark:text-primary-500': activeTab == '{{ inline.formset.prefix|slugify }}', 'hover:text-primary-600 dark:hover:text-primary-500 dark:border-base-800': activeTab != '{{ inline.formset.prefix|slugify }}'}">
-                        {% if inline.formset.max_num == 1 %}
-                            {{ inline.opts.verbose_name|capfirst }}
-                        {% else %}
-                            {{ inline.opts.verbose_name_plural|capfirst }}
-                        {% endif %}
-                    </a>
-                </li>
+                <a href="#{{ inline.formset.prefix|slugify }}" x-on:click="activeTab = '{{ inline.formset.prefix|slugify }}'" x-bind:class="{'active': activeTab == '{{ inline.formset.prefix|slugify }}'}">
+                    {% if inline.formset.max_num == 1 %}
+                        {{ inline.opts.verbose_name|capfirst }}
+                    {% else %}
+                        {{ inline.opts.verbose_name_plural|capfirst }}
+                    {% endif %}
+                </a>
             {% endfor %}
         {% endif %}
-    </ul>
+    </nav>
 {% endif %}

unfold/templates/unfold/helpers/tab_list.html

@@ -2,7 +2,7 @@
 
 {% if not is_popup %}
     {% if tabs_list or inlines_list or actions_list or actions_detail or actions_items or nav_global %}
-        <div class="border-base-200 flex items-start flex-col mb-4 min-h-13 md:border-b dark:md:border-base-800 md:border-l-0 md:flex-row md:items-center">
+        <div class="flex items-start flex-col mb-4 md:flex-row md:items-center">
             {% include "unfold/helpers/tab_items.html" %}
 
             {% include "unfold/helpers/tab_actions.html" %}

unfold/templates/unfold/helpers/welcomemsg.html

@@ -1,4 +1,4 @@
-{% load unfold i18n %}
+{% load unfold i18n admin_urls unfold %}
 
 <div class="flex flex-row grow font-semibold items-center min-w-0 mr-3">
     {% if is_nav_sidebar_enabled %}
@@ -17,25 +17,13 @@
 
     {% include "unfold/helpers/header_back_button.html" %}
 
-    <h1 class="overflow-hidden text-ellipsis text-sm whitespace-nowrap xl:text-base text-font-important-light dark:text-font-important-dark">
-        {% if content_title %}
-            <span class="tracking-tight">
-                {{ pretitle }}
+    <h1 class="overflow-hidden leading-5 text-ellipsis text-font-important-light whitespace-nowrap xl:text-base dark:text-font-important-dark">
+        {% header_title %}
 
-                {{ content_title }}
+        {% if cl and cl.full_result_count != cl.result_count and cl.paginator|class_name != "InfinitePaginator" %}
+            <span class="font-medium ml-2 text-font-subtle-light text-sm dark:text-font-subtle-dark">
+                {% blocktranslate count counter=cl.result_count %}{{ counter }} result{% plural %}{{ counter }} results{% endblocktranslate %} (<a href="?{% if cl.is_popup %}_popup=1{% endif %}">{% if cl.show_full_result_count %}{% blocktranslate with full_result_count=cl.full_result_count %}{{ full_result_count }} total{% endblocktranslate %}{% else %}{% translate "Show all" %}{% endif %}</a>)
             </span>
-
-            {% if cl and cl.full_result_count != cl.result_count and cl.paginator|class_name != "InfinitePaginator" %}
-                <span class="font-medium ml-2 text-font-subtle-light text-sm dark:text-font-subtle-dark">
-                    {% blocktranslate count counter=cl.result_count %}{{ counter }} result{% plural %}{{ counter }} results{% endblocktranslate %} (<a href="?{% if cl.is_popup %}_popup=1{% endif %}">{% if cl.show_full_result_count %}{% blocktranslate with full_result_count=cl.full_result_count %}{{ full_result_count }} total{% endblocktranslate %}{% else %}{% translate "Show all" %}{% endif %}</a>)
-                </span>
-            {% endif %}
-
-            {% if content_subtitle %}
-                {{ content_subtitle }}
-            {% endif %}
-        {% else %}
-            {% translate 'Welcome,' %} <strong>{% firstof user.get_short_name user.get_username %}</strong>.
         {% endif %}
     </h1>
 </div>

unfold/templates/unfold/layouts/base_simple.html

@@ -15,12 +15,6 @@
                 {% include "unfold/helpers/header.html" %}
             {% endblock %}
 
-            {% if not is_popup %}
-                {% spaceless %}
-                    {% block breadcrumbs %}{% endblock %}
-                {% endspaceless %}
-            {% endif %}
-
             <div class="px-4">
                 <div id="content" class="container mx-auto {% block coltype %}colM{% endblock %}">
                     {% block content %}

unfold/templates/unfold/layouts/skeleton.html

@@ -11,6 +11,7 @@
 {% capture as nav_global_side silent %}{% block nav-global-side %}{% endblock %}{% endcapture %}
 {% capture as actions_items silent %}{% block actions-items %}{% endblock %}{% endcapture %}
 {% capture as extra_userlinks silent %}{% block extra_userlinks %}{% endblock %}{% endcapture %}
+{% capture as show_back_button silent %}{% block show_back_button %}{{ show_back_button }}{% endblock %}{% endcapture %}
 
 <!DOCTYPE html>
 <html lang="{{ LANGUAGE_CODE|default:"en-us" }}" dir="{{ LANGUAGE_BIDI|yesno:"rtl,ltr,auto" }}" {% if theme %}class="{{ theme }}"{% endif %} x-data="{ adminTheme: {% if theme %}'{{ theme }}'{% else %}$persist('auto').as('adminTheme'){% endif %} }" x-bind:class="{'dark': adminTheme === 'dark' || (adminTheme === 'auto' && window.matchMedia('(prefers-color-scheme: dark)').matches)}" x-cloak>
@@ -78,7 +79,9 @@
         {% block base %}{% endblock %}
 
         <div id="modal-overlay" class="backdrop-blur-xs bg-base-900/80 bottom-0 fixed hidden left-0 mr-1 right-0 top-0 z-50"></div>
+
+        {% include "unfold/helpers/command.html" %}
+
         <script src="{% static 'unfold/js/simplebar/simplebar.js' %}"></script>
     </body>
-
 </html>

unfold/templates/unfold/layouts/unauthenticated.html

@@ -13,8 +13,6 @@
 
 {% block content_title %}{% endblock %}
 
-{% block breadcrumbs %}{% endblock %}
-
 {% block title %}
     {{ title }} | {{ site_title }}
 {% endblock %}