django-unfold 0.33.0__py3-none-any.whl → 0.34.0__py3-none-any.whl

unfold/templates/unfold/components/progress.html

@@ -7,7 +7,7 @@
         {% endif %}
 
         {% if description %}
-            <strong class="font-semibold ml-auto text-gray-700 dark:text-gray-200">
+            <strong class="font-semibold ml-auto">
                 {{ description }}
             </strong>
         {% endif %}

unfold/templates/unfold/components/table.html

@@ -1,12 +1,12 @@
 {% load unfold %}
 
 <div class="{% if card_included == 1 %}-m-6{% else %}lg:border lg:rounded-md lg:shadow-sm{% endif %} overflow-x-auto lg:dark:border-gray-800">
-    <table class="block border-gray-200 border-spacing-none border-separate text-gray-700 w-full dark:text-gray-300 lg:table">
+    <table class="block border-gray-200 border-spacing-none border-separate w-full lg:table">
         {% if table.headers %}
-            <thead>
+            <thead class="text-gray-900 dark:text-gray-100">
                 <tr class="bg-gray-50 dark:bg-white/[.02]">
                     {% for  header in table.headers %}
-                        <th class="align-middle font-medium py-2 text-left text-gray-400 text-sm whitespace-nowrap sortable column-description hidden px-3 lg:table-cell {% if card_included == 1 %}first:pl-6 last:pr-6{% endif %}">
+                        <th class="align-middle font-semibold py-2 text-left text-sm whitespace-nowrap sortable column-description hidden px-3 lg:table-cell {% if card_included == 1 %}first:pl-6 last:pr-6{% endif %}">
                             {{ header }}
                         </th>
                     {% endfor %}
@@ -19,7 +19,7 @@
                 {% for row in table.rows %}
                     <tr class="{% if striped == 1 %}{% cycle '' 'bg-gray-50 dark:bg-white/[.02]' %}{% endif %} block {% if not card_included == 1 %}border mb-3 rounded-md shadow-sm{% else %}border-t{% endif %} lg:table-row lg:border-none lg:mb-0 lg:shadow-none dark:border-gray-800">
                         {% for cell in row %}
-                            <td class="px-3 py-2 align-middle flex border-t border-gray-200 font-normal gap-4 min-w-0 overflow-hidden text-left text-gray-500 text-sm before:flex before:capitalize before:content-[attr(data-label)] before:items-center before:mr-auto before:text-gray-500 first:border-t-0 dark:before:text-gray-300 dark:text-gray-300 lg:before:hidden lg:first:border-t lg:py-3 lg:table-cell dark:border-gray-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 %}>
+                            <td class="px-3 py-2 align-middle flex border-t border-gray-200 font-normal gap-4 min-w-0 overflow-hidden text-left before:flex before:capitalize before:content-[attr(data-label)] before:items-center before:mr-auto first:border-t-0 lg:before:hidden lg:first:border-t lg:py-3 lg:table-cell dark:border-gray-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 %}

unfold/templates/unfold/components/title.html

@@ -1,3 +1,3 @@
-<div class="font-medium text-2xl text-gray-700 dark:text-gray-200{% if class %} {{ class }}{% endif %}">
+<div class="font-medium text-2xl text-gray-900 dark:text-gray-100{% if class %} {{ class }}{% endif %}">
     {{ children }}
 </div>

unfold/templates/unfold/helpers/account_links.html

@@ -1,11 +1,11 @@
 {% load i18n %}
 
 <div class="relative" x-data="{ openUserLinks: false }">
-    <a class="block cursor-pointer hover:text-gray-700 dark:text-gray-300 dark:hover:text-gray-200" @click="openUserLinks = !openUserLinks">
+    <a class="block cursor-pointer hover:text-gray-700 dark:hover:text-gray-200" @click="openUserLinks = !openUserLinks">
         <span class="material-symbols-outlined">person</span>
     </a>
 
-    <nav class="absolute bg-white border flex flex-col leading-none overflow-hidden py-1 -right-2 rounded shadow-lg text-sm text-gray-500 top-7 w-52 z-50 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-300" x-cloak x-show="openUserLinks" @click.outside="openUserLinks = false">
+    <nav class="absolute bg-white border flex flex-col leading-none overflow-hidden py-1 -right-2 rounded shadow-lg top-7 w-52 z-50 dark:bg-gray-800 dark:border-gray-700" x-cloak x-show="openUserLinks" @click.outside="openUserLinks = false">
         <div class="border-b border-gray-100 flex flex-row flex-shrink-0 items-start justify-start mb-1 pb-1 dark:border-gray-700">
             <span class="block mx-1 px-3 py-2 truncate">
                 {% firstof user.get_short_name user.get_username %}

unfold/templates/unfold/helpers/actions_row.html

@@ -2,18 +2,20 @@
 
 {% if actions %}
     <td data-label="{% trans "More actions" %}" class="field-actions_holder align-middle flex border-t border-gray-200 font-normal px-3 py-2 text-left text-sm before:block before:capitalize before:content-[attr(data-label)] before:mr-auto before:text-gray-500 dark:before:text-gray-300 lg:before:hidden lg:py-3 lg:table-cell dark:border-gray-800 lg:w-px">
-        <div class="group leading-none relative" x-data="{ openActionsId: false }">
-            <span x-ref="rowDropdown{{ instance_pk }}" class="cursor-pointer flex h-7 material-symbols-outlined md-18 -my-1 !leading-7 rounded text-center text-gray-400 w-7 group-hover:bg-gray-100 group-hover:text-gray-700 dark:text-gray-300 group-hover:dark:bg-gray-800 group-hover:dark:text-white" @click="openActionsId{{ instance.pk }} = !openActionsId{{ instance.pk }}">
-                more_horiz
-            </span>
+      {% with action_id=instance_pk|cut:"-" %}
+          <div class="group leading-none relative" x-data="{ openActionsId{{ action_id }}: false }">
+              <span x-ref="rowDropdown{{ action_id }}" class="cursor-pointer flex h-7 material-symbols-outlined md-18 -my-1 !leading-7 rounded text-center text-gray-400 w-7 group-hover:bg-gray-100 group-hover:text-gray-700 dark:text-gray-300 group-hover:dark:bg-gray-800 group-hover:dark:text-white" @click="openActionsId{{ action_id }} = !openActionsId{{ action_id }}">
+                  more_horiz
+              </span>
 
-            <nav x-anchor.offset.4="$refs.rowDropdown{{ instance_pk }}" class="bg-white border flex flex-col leading-none py-1 rounded-md shadow-lg text-gray-500 text-sm top-7 z-50 w-48 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-300" x-cloak x-show="openActionsId" @click.outside="openActionsId{{ instance.pk }} = false">
-                {% for action in actions %}
-                    <a href="{% url action.raw_path instance_pk %}" class="mx-1 px-3 py-2 rounded-md truncate whitespace-nowrap hover:bg-gray-100 dark:hover:bg-gray-700 dark:hover:text-gray-200"{% for attr_name, attr_value in action.attrs.items %} {{ attr_name }}="{{ attr_value }}"{% endfor %}>
-                        {{ action.title }}
-                    </a>
-                {% endfor %}
-            </nav>
-        </div>
+              <nav x-anchor.offset.4="$refs.rowDropdown{{ action_id }}" class="bg-white border flex flex-col leading-none py-1 rounded-md shadow-lg text-sm top-7 z-50 w-48 dark:bg-gray-800 dark:border-gray-700" x-cloak x-show="openActionsId{{ action_id }}" @click.outside="openActionsId{{ action_id }} = false">
+                  {% for action in actions %}
+                      <a href="{% url action.raw_path instance_pk %}" class="mx-1 px-3 py-2 rounded-md truncate hover:bg-gray-100 dark:hover:bg-gray-700 dark:hover:text-gray-200"{% for attr_name, attr_value in action.attrs.items %} {{ attr_name }}="{{ attr_value }}"{% endfor %}>
+                          {{ action.title }}
+                      </a>
+                  {% endfor %}
+              </nav>
+          </div>
+      {% endwith %}
     </td>
 {% endif %}

unfold/templates/unfold/helpers/add_link.html

@@ -9,11 +9,11 @@
 {% endif %}
 
 {% if add_url %}
-    <li class="flex flex-row items-center">
+    <div class="flex flex-row items-center">
         <span class="block bg-gray-200 h-5 mx-4 w-px dark:bg-gray-700"></span>
 
         <a href="{% add_preserved_filters add_url is_popup to_field %}" class="addlink bg-primary-600 flex items-center h-9 justify-center -my-1 rounded-full w-9" title="{{ title }}">
             <span class="material-symbols-outlined text-white">add</span>
         </a>
-    </li>
+    </div>
 {% endif %}

unfold/templates/unfold/helpers/app_list.html

@@ -12,7 +12,7 @@
                     {% endif %}
 
                     {% if group.title %}
-                        <h3 class="font-medium flex flex-row items-center mb-1 mx-3 py-1.5 px-3 select-none text-gray-900 text-sm dark:text-gray-200 {% if group.collapsible %}cursor-pointer{% endif %}" {% if group.collapsible %}x-on:click="navigationOpen = !navigationOpen"{% endif %}>
+                        <h2 class="font-semibold flex flex-row items-center mb-1 mx-3 py-1.5 px-3 select-none text-gray-900 text-sm dark:text-gray-100 {% if group.collapsible %}cursor-pointer{% endif %}" {% if group.collapsible %}x-on:click="navigationOpen = !navigationOpen"{% endif %}>
                             {{ group.title }}
 
                             {% if group.collapsible %}
@@ -20,14 +20,14 @@
                                     chevron_right
                                 </span>
                             {% endif %}
-                        </h3>
+                        </h2>
                     {% endif %}
 
                     <ol class="px-6" {% if group.collapsible %}x-show="navigationOpen"{% endif %}>
                         {% for item in group.items %}
                             {% if item.has_permission %}
                                 <li>
-                                    <a href="{% if item.link_callback %}{{ item.link_callback }}{% else %}{{ item.link }}{% endif %}" class="border border-transparent flex h-11 items-center -mx-3 px-3 py-2 rounded-md {% if item.active %}bg-gray-100 font-semibold text-primary-600 dark:border dark:border-gray-800 dark:bg-white/[.02] dark:text-primary-500{% else %}text-gray-500 hover:text-gray-700 dark:text-gray-300 hover:dark:text-gray-200{% endif %}">
+                                    <a href="{% if item.link_callback %}{{ item.link_callback }}{% else %}{{ item.link }}{% endif %}" class="flex h-11 items-center -mx-3 px-3 py-2 rounded-md {% if item.active %}bg-gray-100 font-semibold text-primary-600 dark:bg-white/[.06] dark:text-primary-500{% else %} hover:text-gray-700 hover:dark:text-gray-200{% endif %}">
                                         {% if item.icon %}
                                             <span class="material-symbols-outlined md-18 mr-3 w-4.5">
                                                 {{ item.icon }}
@@ -59,7 +59,7 @@
 
     {% if sidebar_show_all_applications %}
         <div class="mt-auto" x-data="{ openAllApplications: false }">
-            <a class="cursor-pointer flex items-center px-6 py-3 text-gray-500 text-sm transition-all hover:text-gray-700 dark:text-gray-300 hover:dark:text-gray-200" x-on:click="openAllApplications = !openAllApplications">
+            <a class="cursor-pointer flex items-center px-6 py-3 text-sm hover:text-gray-700 dark:text-gray-300 hover:dark:text-gray-200" x-on:click="openAllApplications = !openAllApplications">
                 <span class="material-symbols-outlined md-18 mr-3">
                     apps
                 </span>
@@ -75,14 +75,14 @@
                 <div class="bg-white flex flex-col h-full overflow-x-hidden overflow-y-auto py-5 px-8 relative text-sm w-80 z-20 dark:bg-gray-900 dark:border-r dark:border-gray-800" x-on:click.outside="openAllApplications = false" x-on:keydown.escape.window="openAllApplications = false">
                     {% for app in app_list %}
                         <div class="mb-6 last:mb-0">
-                            <h3 class="mb-4 font-medium overflow-hidden text-ellipsis text-gray-700 whitespace-nowrap dark:text-gray-200">
+                            <h2 class="mb-4 font-semibold text-gray-900 truncate dark:text-gray-100">
                                 {{ app.name }}
-                            </h3>
+                            </h2>
 
                             <ul>
                                 {% for model in app.models %}
                                     <li class="block mb-4 last:mb-0">
-                                        <a href="{{ model.admin_url }}" class="block overflow-hidden text-ellipsis text-gray-500 transition-all whitespace-nowrap hover:text-gray-700 dark:text-gray-300 dark:hover:text-gray-200">
+                                        <a href="{{ model.admin_url }}" class="block truncate hover:text-gray-700 dark:hover:text-gray-200">
                                             {{ model.name }}
                                         </a>
                                     </li>

unfold/templates/unfold/helpers/app_list_default.html

@@ -4,8 +4,8 @@
     {% for app in app_list %}
         <div class="app-{{ app.app_label }} module{% if app.app_url in request.path %} current-app{% endif %}">
             <div class="bg-gray-50 mb-6 rounded-md p-3 dark:bg-gray-800">
-                <table class="border border-gray-400/10 border-spacing-none border-separate rounded-md overflow-hidden shadow-sm text-gray-700 text-sm w-full dark:border-gray-800">
-                    <caption class="font-semibold mb-3 text-gray-700 text-left dark:text-gray-200">
+                <table class="border border-gray-400/10 border-spacing-none border-separate rounded-md overflow-hidden shadow-sm w-full dark:border-gray-800">
+                    <caption class="font-semibold mb-3 text-gray-900 text-left dark:text-gray-100">
                         <a href="{{ app.app_url }}" class="section" title="{% blocktranslate with name=app.name %}Models in the {{ name }} application{% endblocktranslate %}">
                             {{ app.name }}
                         </a>
@@ -14,13 +14,13 @@
                     {% for model in app.models %}
                         <tr class="bg-white dark:bg-gray-900 model-{{ model.object_name|lower }}{% if model.admin_url in request.path %} current-model{% endif %}">
                             {% if model.admin_url %}
-                                <th scope="row" class="font-normal p-3 text-left dark:text-gray-200 {% if not forloop.last %}border-b border-gray-100 dark:border-gray-800{% endif %}">
+                                <th scope="row" class="font-normal p-3 text-left {% if not forloop.last %}border-b border-gray-100 dark:border-gray-800{% endif %}">
                                     <a href="{{ model.admin_url }}"{% if model.admin_url in request.path %} aria-current="page"{% endif %}>
                                         {{ model.name }}
                                     </a>
                                 </th>
                             {% else %}
-                                <th scope="row" class="font-normal p-3 text-left dark:text-gray-300 {% if not forloop.last %}border-b border-gray-100 dark:border-gray-800{% endif %}">
+                                <th scope="row" class="font-normal p-3 text-left {% if not forloop.last %}border-b border-gray-100 dark:border-gray-800{% endif %}">
                                     {{ model.name }}
                                 </th>
                             {% endif %}
@@ -28,18 +28,18 @@
                             <td class="{% if not forloop.last %}border-b border-gray-100 dark:border-gray-800{% endif %} p-3 text-right">
                                 <div class="flex flex-row items-center ml-auto gap-4 justify-end">
                                     {% if model.add_url %}
-                                        <a href="{{ model.add_url }}" class="addlink block leading-none text-gray-400 transition-colors hover:text-gray-700 dark:text-gray-300 dark:hover:text-gray-200" title="{% translate 'Add' %}">
+                                        <a href="{{ model.add_url }}" class="addlink block leading-none text-gray-400 transition-colors dark:text-gray-500 " title="{% translate 'Add' %}">
                                             <span class="material-symbols-outlined">add</span>
                                         </a>
                                     {% endif %}
 
                                     {% if model.admin_url and show_changelinks %}
                                         {% if model.view_only %}
-                                            <a href="{{ model.admin_url }}" class="viewlink block leading-none text-gray-400 transition-colors hover:text-gray-700 dark:text-gray-300 dark:hover:text-gray-200" title="{% translate 'View' %} ">
+                                            <a href="{{ model.admin_url }}" class="viewlink block leading-none text-gray-400 transition-colors dark:text-gray-500" title="{% translate 'View' %} ">
                                                 <span class="material-symbols-outlined">visibility</span>
                                             </a>
                                         {% else %}
-                                            <a href="{{ model.admin_url }}" class="changelink block leading-none text-gray-400 transition-colors hover:text-gray-700 dark:text-gray-300 dark:hover:text-gray-200" title="{% translate 'Change' %}">
+                                            <a href="{{ model.admin_url }}" class="changelink block leading-none text-gray-400 transition-colors dark:text-gray-300" title="{% translate 'Change' %}">
                                                 <span class="material-symbols-outlined">edit_square</span>
                                             </a>
                                         {% endif %}

unfold/templates/unfold/helpers/breadcrumb_item.html

@@ -1,5 +1,5 @@
 
-<li class="text-gray-500 text-xs dark:text-gray-300">
+<li class="text-xs">
     {% if link %}
         <a href="{{ link }}">{{ name }}</a> <span class="mx-2 text-gray-200 dark:text-gray-600">/</span>
     {% else %}

unfold/templates/unfold/helpers/display_header.html

@@ -1,7 +1,9 @@
+{% load i18n %}
+
 <span class="flex gap-4 items-center">
     {% if value.3 and value.3.path %}
         <span class="bg-center bg-cover bg-white flex font-medium justify-center overflow-hidden dark:bg-gray-900 dark:border-gray-700 {% if value.3.squared %}rounded-sm{% else %}rounded-full{% endif %}{% if not value.3.borderless %} border{% endif %}{% if not value.3.width or not value.3.height %} h-8 max-w-8 min-w-8{% endif %}">
-            <img loading="lazy" src="{{ value.3.path }}" class="object-cover" {% if value.3.width %}width="{{ value.3.width }}"{% endif %} {% if value.3.height %}height="{{ value.3.height }}"{% endif %}/>
+            <img loading="lazy" src="{{ value.3.path }}" class="object-cover" {% if value.3.width %}width="{{ value.3.width }}"{% endif %} {% if value.3.height %}height="{{ value.3.height }}"{% endif %} alt="{% trans "Record picture" %}" />
         </span>
     {% elif value.2 %}
         <span class="bg-white border flex font-medium h-8 justify-center items-center rounded-full text-xs uppercase w-8 dark:bg-gray-900 dark:border-gray-700">
@@ -11,7 +13,7 @@
 
     <span class="flex flex-col text-right lg:text-left">
         {% if value.0 %}
-            <h3>{{ value.0 }}</h3>
+            <strong class="block font-normal">{{ value.0 }}</strong>
         {% endif %}
 
         {% if value.1 %}

unfold/templates/unfold/helpers/field_readonly_value.html

@@ -1 +1 @@
-<div class="readonly font-medium max-w-4xl py-2 text-gray-500 text-sm dark:text-gray-300 *:rounded-md {% if not adminform.model_admin.compressed_fields and not field.is_image %}bg-gray-50 border px-3 rounded-md shadow-sm dark:border-gray-700 dark:bg-gray-800{% endif %} {% if field.is_image %}inline-block [&_img]:rounded-md !py-0{% endif %}">{% if value %}{{ value }}{% elif field.contents %}{{ field.contents }}{% else %}-{% endif %}</div>
+<div class="readonly max-w-4xl py-2 text-sm *:rounded-md {% if not adminform.model_admin.compressed_fields and not field.is_image %}bg-gray-50 border font-medium px-3 rounded-md shadow-sm dark:border-gray-700 dark:bg-gray-800{% endif %} {% if field.is_image %}inline-block [&_img]:rounded-md !py-0{% endif %}">{% if value %}{{ value }}{% elif field.contents %}{{ field.contents }}{% else %}-{% endif %}</div>

unfold/templates/unfold/helpers/fieldset_row.html

@@ -7,7 +7,7 @@
         <div class="flex group {% if adminform.model_admin.compressed_fields %} field-row{% endif %}{% if not line.fields|length == 1 and not adminform.model_admin.compressed_fields %} lg:max-w-xs flex-grow{% endif %}{% if field.errors %} errors {% endif %}{% if not forloop.parentloop.last %} {% if adminform.model_admin.compressed_fields %}mb-3{% else %}mb-6{% endif %}{% else %} pb-3{% endif %} {% if adminform.model_admin.compressed_fields %}flex-col lg:flex-row lg:gap-2 {% else %}flex-col{% endif %}">
             {% if field.is_checkbox %}
                 {% if adminform.model_admin.compressed_fields %}
-                    <div class="flex flex-row gap-4">
+                    <div class="flex flex-col gap-4 py-2 lg:flex-row">
                         <div class="font-medium flex items-start -ml-2 min-w-32 w-32 lg:min-w-48 lg:w-48">
                             {{ field.label_tag }}
                         </div>

unfold/templates/unfold/helpers/fieldsets_tabs.html

@@ -3,7 +3,7 @@
 {% with tabs=adminform|tabs %}
     {% if tabs %}
         <div x-data="{openTab: null}" x-show="activeTab == 'general'">
-            <ul class="bg-gray-100 border border-transparent flex gap-10 mb-6 px-4 py-3 rounded-md text-gray-400 text-sm lg:-mx-4 dark:bg-white/[.02] dark:border dark:border-gray-800 dark:text-gray-300">
+            <ul class="bg-gray-100 border border-transparent flex gap-10 mb-6 px-4 py-3 rounded-md text-gray-500 text-sm lg:-mx-4 dark:bg-white/[.02] dark:border dark:border-gray-800 dark:text-gray-300">
                 {% for fieldset in tabs %}
                     <li>
                         <a class="cursor-pointer font-semibold hover:text-gray-700 dark:hover:text-white"

unfold/templates/unfold/helpers/help_text.html

@@ -1,5 +1,5 @@
 {% if help_text %}
-    <div class="leading-relaxed mt-2 text-gray-500 text-xs dark:text-gray-300">
+    <div class="leading-relaxed mt-2 text-xs">
         {{ help_text }}
     </div>
 {% endif %}

unfold/templates/unfold/helpers/history.html

@@ -5,14 +5,14 @@
 {% if admin_log %}
     <div id="content-related" class="lg:w-96">
         <div id="recent-actions-module" class="module bg-gray-50 rounded-md p-3 dark:bg-gray-800">
-            <h2 class="mb-3 font-semibold text-gray-700 text-sm dark:text-gray-200">
+            <h2 class="mb-3 font-semibold text-gray-900 dark:text-gray-100">
                 {% translate 'Recent actions' %}
             </h2>
 
             <ul class="actionlist">
                 {% for entry in admin_log %}
                     <li class="{% if entry.is_addition %}addlink{% endif %}{% if entry.is_change %}changelink{% endif %}{% if entry.is_deletion %}deletelink{% endif %} border border-gray-400/10 bg-white mb-3 p-3 rounded-md shadow-sm last:mb-0 dark:bg-gray-900">
-                        <div class="mb-3 text-gray-700 overflow-hidden text-ellipsis text-sm whitespace-nowrap dark:text-gray-200">
+                        <div class="mb-3 overflow-hidden text-ellipsis whitespace-nowrap">
                             {% if entry.is_deletion or not entry.get_admin_url %}
                                 {{ entry.object_repr }}
                             {% else %}
@@ -20,7 +20,7 @@
                             {% endif %}
                         </div>
 
-                        <div class="border-gray-100 border-t flex pt-3 text-gray-500 text-sm dark:border-gray-800 dark:text-gray-300">
+                        <div class="border-gray-100 border-t flex pt-3 dark:border-gray-800">
                             <div>
                                 {% if entry.content_type %}
                                     {% filter capfirst %}{{ entry.content_type.name }}{% endfilter %}

unfold/templates/unfold/helpers/label.html

@@ -1,16 +1,16 @@
 <span class="inline-block font-semibold leading-normal px-2 py-1 rounded text-xxs uppercase whitespace-nowrap
     {% if type == 'info' %}
-        bg-blue-100 text-blue-500 dark:bg-blue-500/20
+        bg-blue-100 text-blue-700 dark:bg-blue-500/20 dark:text-blue-400
     {% elif type == 'danger' %}
-        bg-red-100 text-red-500 dark:bg-red-500/20
+        bg-red-100 text-red-700 dark:bg-red-500/20 dark:text-red-400
     {% elif type == 'warning' %}
-        bg-orange-100 text-orange-500 dark:bg-orange-500/20
+        bg-orange-100 text-orange-700 dark:bg-orange-500/20 dark:text-orange-400
     {% elif type == 'success' %}
-        bg-green-100 text-green-500 dark:bg-green-500/20
+        bg-green-100 text-green-700 dark:bg-green-500/20 dark:text-green-400
     {% elif type == 'primary' %}
-        bg-primary-100 text-primary-500 dark:bg-primary-500/20
+        bg-primary-100 text-primary-700 dark:bg-primary-500/20 dark:text-primary-400
     {% else %}
-        bg-gray-100 text-gray-500 dark:bg-gray-500/20 dark:text-gray-300
+        bg-gray-100 text-gray-700 dark:bg-gray-500/20 dark:text-gray-400
     {% endif %}">
     {{ text }}
 </span>

unfold/templates/unfold/helpers/messages.html

@@ -1,7 +1,18 @@
 {% if messages %}
     <ul>
         {% for message in messages %}
-            <li class="mb-3 px-3 py-3 rounded-md text-sm last:mb-8 {% if message.tags == 'success' %}bg-green-100 text-green-600 dark:bg-green-500/20 dark:border-green-500/10{% elif message.tags == 'warning' %}bg-amber-100 text-amber-600 dark:bg-amber-600/20 dark:border-amber-600/10 {% elif message.tags == 'error' %} bg-red-100 text-red-600 dark:bg--500/20 dark:border-red-500/10{% elif message.tags == 'info' %}bg-blue-50 mb-8 text-blue-500 dark:bg-blue-500/20 dark:border-blue-500/10{% else %}bg-gray-100 text-gray-700{% endif %}">
+            <li class="mb-3 px-3 py-3 rounded-md text-sm last:mb-8
+                {% if message.tags == 'success' %}
+                    bg-green-100 text-green-700 dark:bg-green-500/20 dark:text-green-400
+                {% elif message.tags == 'warning' %}
+                    bg-orange-100 text-orange-700 dark:bg-orange-500/20 dark:text-orange-400
+                {% elif message.tags == 'error' %}
+                    bg-red-100 text-red-700 dark:bg-red-500/20 dark:text-red-400
+                {% elif message.tags == 'info' %}
+                    bg-blue-100 text-blue-700 dark:bg-blue-500/20 dark:text-blue-400
+                {% else %}
+                    bg-gray-100 text-gray-700 dark:bg-gray-500/20 dark:text-gray-400
+                {% endif %}">
                 {{ message|capfirst }}
             </li>
         {% endfor %}

unfold/templates/unfold/helpers/navigation.html

@@ -4,7 +4,7 @@
     <nav id="nav-sidebar" class="bg-gray-50 border-r border-gray-200 fixed max-h-screen  transition-width w-sidebar dark:bg-gray-900 dark:border-gray-800">
         <div class="flex flex-col min-h-screen min-w-sidebar dark:bg-gray-950/20">
             <div class="border-b border-gray-200 mb-5 py-3 dark:border-gray-800">
-                <div class="flex font-medium h-10 items-center px-6 text-gray-700 dark:text-gray-200">
+                <div class="flex font-medium h-10 items-center px-6 text-gray-900 tracking-tight dark:text-gray-100 xl:text-base">
                     {% if site_logo %}
                         {% include "unfold/helpers/site_logo.html" %}
                     {% elif branding %}

unfold/templates/unfold/helpers/search_results.html

@@ -3,8 +3,8 @@
         {% for app in results %}
             {% for model in app.models %}
                 <li>
-                    <a href="{{ model.admin_url }}" class="block group overflow-hidden px-3 py-2 text-gray-500 text-ellipsis whitespace-nowrap hover:text-gray-700 dark:text-gray-300 dark:hover:text-gray-200">
-                        {{ app.name }} <span class="align-text-top material-symbols-outlined md-18 text-gray-300 group-hover:text-gray-300 dark:text-gray-600">arrow_right_alt</span> {{ model.name }}
+                    <a href="{{ model.admin_url }}" class="block px-3 py-2 truncate hover:text-gray-700 dark:hover:text-gray-200">
+                        {{ app.name }} <span class="align-text-top material-symbols-outlined md-18">arrow_right_alt</span> {{ model.name }}
                     </a>
                 </li>
             {% endfor %}

unfold/templates/unfold/helpers/site_icon.html

@@ -1,7 +1,7 @@
 {% load i18n %}
 
 {% if site_icon %}
-    <a  href="{% url "admin:index" %}">
+    <a href="{% url "admin:index" %}">
         {% if site_icon.light and site_icon.dark %}
             <img src="{{ site_icon.dark }}" alt="{% trans 'Home' %}" class="h-8 hidden mr-4 dark:block"/>
 

unfold/templates/unfold/helpers/tab_action.html

@@ -1,5 +1,5 @@
 <li class="border-b flex-grow text-center md:border-b-0 md:border-r last:border-0 dark:border-gray-800">
-    <a href="{{ link }}" class="block px-4 py-2 text-gray-500 text-left whitespace-nowrap hover:text-gray-700 dark:text-gray-300 hover:dark:text-gray-200"{% if blank %} target="_blank"{% endif %} {% include "unfold/helpers/attrs.html" with attrs=action.attrs %}>
+    <a href="{{ link }}" class="block px-4 py-2 text-left whitespace-nowrap hover:text-gray-700 hover:dark:text-gray-200"{% if blank %} target="_blank"{% endif %} {% include "unfold/helpers/attrs.html" with attrs=action.attrs %}>
         {{ title }}
     </a>
 </li>

unfold/templates/unfold/helpers/tab_list.html

@@ -2,13 +2,13 @@
 
 {% if not is_popup %}
     {% if tabs_list or inlines_list or actions_list or actions_detail or actions_items or nav_global %}
-        <div class="flex items-start flex-col mb-4 text-gray-500 text-sm w-full md:border-b dark:md:border-gray-800 md:border-l-0 md:flex-row md:items-center md:justify-end dark:text-gray-300">
+        <div class="flex items-start flex-col mb-4 text-sm w-full md:border-b dark:md:border-gray-800 md:border-l-0 md:flex-row md:items-center md:justify-end">
             {% if inlines_list or tabs_list %}
                 <ul class="border rounded-md flex flex-col w-full md:flex-row md:border-b-0 md:border-t-0 md:border-l-0 md:border-r-0 dark:border-gray-800">
                     {% for item in tabs_list %}
                         {% if item.has_permission %}
                             <li class="border-b last:border-b-0 md:border-b-0 md:mr-8 dark:border-gray-800">
-                                <a href="{% if item.link_callback %}{{ item.link_callback }}{% else %}{{ item.link }}{% endif %}" class="block px-3 py-2 {% if item.active %} border-b md:border-primary-500 dark:md:border-primary-600 font-medium -mb-px text-primary-600 hover:text-primary-600 dark:text-primary-500{% else %} hover:text-gray-700 dark:hover:text-gray-200{% endif %} md:py-4 md:px-0 dark:border-gray-800">
+                                <a href="{% if item.link_callback %}{{ item.link_callback }}{% else %}{{ item.link }}{% endif %}" class="block px-3 py-2 md:py-4 md:px-0 dark:border-gray-800 {% if item.active %} 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-gray-700 dark:hover:text-gray-200{% endif %}">
                                     {{ item.title }}
                                 </a>
                             </li>
@@ -17,14 +17,18 @@
 
                     {% if inlines_list %}
                         <li class="border-b last:border-b-0 md:border-b-0 md:mr-8 dark:border-gray-800">
-                            <a class="block cursor-pointer px-3 py-2 hover:text-gray-700 dark:hover:text-gray-200  md:py-4 md:px-0 dark:border-gray-800" x-on:click="activeTab = 'general'" x-bind:class="{'border-b md:border-primary-500 dark:md:border-primary-600 font-medium -mb-px text-primary-600 hover:text-primary-600 dark:text-primary-500': activeTab == 'general'}">
+                            <a class="block cursor-pointer font-medium px-3 py-2 md:py-4 md:px-0"
+                               x-on:click="activeTab = 'general'"
+                               x-bind:class="{'border-b border-gray-200 dark:border-gray-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-gray-700 dark:hover:text-gray-200 dark:border-gray-800': activeTab != 'general'}">
                                 {% trans "General" %}
                             </a>
                         </li>
 
                         {% for inline in inlines_list %}
                             <li class="border-b last:border-b-0 md:border-b-0 md:mr-8 dark:border-gray-800">
-                                <a class="block cursor-pointer px-3 py-2 hover:text-gray-700 dark:hover:text-gray-200  md:py-4 md:px-0 dark:border-gray-800"  x-on:click="activeTab = '{{ inline.opts.verbose_name|slugify }}'" x-bind:class="{'border-b md:border-primary-500 dark:md:border-primary-600 font-medium -mb-px text-primary-600 hover:text-primary-600 dark:text-primary-500': activeTab == '{{ inline.opts.verbose_name|slugify }}'}">
+                                <a class="block cursor-pointer font-medium px-3 py-2 md:py-4 md:px-0"
+                                   x-on:click="activeTab = '{{ inline.opts.verbose_name|slugify }}'"
+                                   x-bind:class="{'border-b border-gray-200 dark:border-gray-800 md:border-primary-500 dark:md:!border-primary-600 font-semibold -mb-px text-primary-600 dark:text-primary-500': activeTab == '{{ inline.opts.verbose_name|slugify }}', 'hover:text-gray-700 dark:hover:text-gray-200 dark:border-gray-800': activeTab != '{{ inline.opts.verbose_name|slugify }}'}">
                                     {% if inline.formset.max_num == 1 %}
                                         {{ inline.opts.verbose_name|capfirst }}
                                     {% else %}
@@ -38,7 +42,7 @@
             {% endif %}
 
             {% if actions_list or actions_detail or actions_items or nav_global %}
-                <ul class="border flex flex-col mb-4 mt-2 rounded-md shadow-sm md:flex-row md:mb-2 md:mt-0 dark:border-gray-800 max-md:w-full">
+                <ul class="border flex flex-col font-medium mb-4 mt-2 rounded-md shadow-sm md:flex-row md:mb-2 md:mt-0 dark:border-gray-800 max-md:w-full">
                     {% for action in actions_list %}
                         {% include "unfold/helpers/tab_action.html" with title=action.title link=action.path %}
                     {% endfor %}

unfold/templates/unfold/helpers/theme_switch.html

@@ -1,13 +1,13 @@
 {% load i18n %}
 
 <div class="relative" x-data="{ openTheme: false }">
-    <a class="block cursor-pointer leading-none hover:text-gray-700 dark:text-gray-300 dark:hover:text-gray-200" x-on:click="openTheme = !openTheme">
+    <a class="block cursor-pointer leading-none hover:text-gray-700  dark:hover:text-gray-200" x-on:click="openTheme = !openTheme">
         <span class="material-symbols-outlined">
             <span x-text="adminTheme == 'dark' && 'dark_mode' || adminTheme == 'light' && 'light_mode' || 'computer'"></span>
         </span>
     </a>
 
-    <nav class="absolute bg-white border flex flex-col leading-none overflow-hidden py-1 -right-2 rounded shadow-lg text-sm text-gray-500 top-7 w-40 z-50 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-300" x-cloak x-show="openTheme" @click.outside="openTheme = false">
+    <nav class="absolute bg-white border flex flex-col leading-none overflow-hidden py-1 -right-2 rounded shadow-lg top-7 w-40 z-50 dark:bg-gray-800 dark:border-gray-700" x-cloak x-show="openTheme" @click.outside="openTheme = false">
         <a class="cursor-pointer flex flex-row leading-none mx-1 px-3 py-1.5 rounded hover:bg-gray-100 hover:text-gray-700 dark:hover:bg-gray-700 dark:hover:text-gray-200"
            x-on:click="adminTheme = 'dark'"
            x-bind:class="adminTheme == 'dark' && 'text-primary-600 dark:text-primary-500 dark:hover:!text-primary-500 hover:!text-primary-600'">

unfold/templates/unfold/helpers/welcomemsg.html

@@ -3,12 +3,14 @@
 <div class="flex-grow font-medium min-w-0 mr-3">
     <h1 class="overflow-hidden text-ellipsis text-sm whitespace-nowrap xl:text-base text-gray-700 dark:text-gray-200">
         {% if content_title %}
-            {{ pretitle }}
+            <span class="font-medium text-gray-900 tracking-tight dark:text-gray-100">
+                {{ pretitle }}
 
-            {{ content_title }}
+                {{ content_title }}
+            </span>
 
             {% if cl and cl.full_result_count != cl.result_count %}
-                <span class="ml-2 text-gray-500 text-sm">
+                <span class="ml-2 text-sm">
                     {% 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 %}

unfold/templates/unfold/layouts/skeleton.html

@@ -48,7 +48,7 @@
     <script src="{% static 'unfold/js/app.js' %}"></script>
 
     {% block responsive %}
-        <meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1.0, maximum-scale=1.0">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
     {% endblock %}
 
     {% block blockbots %}
@@ -68,7 +68,7 @@
     {% endif %}
 </head>
 
-<body class="antialiased bg-white font-sans text-gray-500 dark:bg-gray-900 dark:text-gray-300 {% if is_popup %}popup {% endif %}{% block bodyclass %}{% endblock %}" data-admin-utc-offset="{% now "Z" %}" x-data="{ activeTab: 'general', sidebarMobileOpen: false, sidebarDesktopOpen: {% if request.session.toggle_sidebar == False %}false{% else %}true{% endif %} }">
+<body class="antialiased bg-white font-sans text-gray-600 text-sm dark:bg-gray-900 dark:text-gray-300 {% if is_popup %}popup {% endif %}{% block bodyclass %}{% endblock %}" data-admin-utc-offset="{% now "Z" %}" x-data="{ activeTab: 'general', sidebarMobileOpen: false, sidebarDesktopOpen: {% if request.session.toggle_sidebar == False %}false{% else %}true{% endif %} }">
     {% block base %}{% endblock %}
 
     <div id="modal-overlay" class="backdrop-blur-sm bg-opacity-80 bg-gray-900 bottom-0 fixed hidden left-0 mr-1 right-0 top-0 z-50"></div>

unfold/templates/unfold/widgets/clearable_file_input.html

@@ -14,14 +14,14 @@
             <label for="{{ widget.checkbox_id }}" class="flex items-center">
                 <input type="checkbox"{% if widget.class %} class="{{ widget.class }}"{% endif %} name="{{ widget.checkbox_name }}" id="{{ widget.checkbox_id }}" />
 
-                <span class="ml-2 text-gray-500 dark:text-gray-300">
+                <span class="ml-2">
                     {{ widget.clear_checkbox_label }}
                 </span>
             </label>
         </div>
     {% endif %}
 
-    <input type="text" value="{% if widget.value %}{{ widget.value.url }}{% else %}{% trans 'Choose file to upload' %}{% endif %}" disabled class="bg-white flex-grow font-medium px-3 py-2 text-ellipsis dark:bg-gray-900 {% if widget.value %}text-gray-500 dark:text-gray-300{% else %}text-gray-300 dark:text-gray-300{% endif %}">
+    <input type="text" aria-label="{% trans 'Choose file to upload' %}" value="{% if widget.value %}{{ widget.value.url }}{% else %}{% trans 'Choose file to upload' %}{% endif %}" disabled class="bg-white flex-grow font-medium px-3 py-2 text-ellipsis dark:bg-gray-900 {% if widget.value %}text-gray-500 dark:text-gray-300{% else %}text-gray-300 dark:text-gray-300{% endif %}">
 
     <div class="flex flex-none items-center leading-none self-stretch">
         <div class="hidden">

unfold/templates/unfold/widgets/clearable_file_input_small.html

@@ -7,14 +7,14 @@
                 <label for="{{ widget.checkbox_id }}" class="flex items-center">
                     <input type="checkbox"{% if widget.class %} class="{{ widget.class }}"{% endif %} name="{{ widget.checkbox_name }}" id="{{ widget.checkbox_id }}" />
 
-                    <span class="ml-2 text-gray-500 dark:text-gray-300">
+                    <span class="ml-2">
                         {{ widget.clear_checkbox_label }}
                     </span>
                 </label>
             </div>
         {% endif %}
 
-        <input type="text" value="{% if widget.value %}{{ widget.value.url }}{% else %}{% trans 'Choose file to upload' %}{% endif %}" disabled class="bg-white flex-grow font-medium px-3 py-2 text-ellipsis dark:bg-gray-900 {% if widget.value %}text-gray-500 dark:text-gray-300{% else %}text-gray-300 dark:text-gray-300{% endif %}">
+        <input type="text" aria-label="{% trans 'Choose file to upload' %}" value="{% if widget.value %}{{ widget.value.url }}{% else %}{% trans 'Choose file to upload' %}{% endif %}" disabled class="bg-white flex-grow font-medium px-3 py-2 text-ellipsis dark:bg-gray-900 {% if widget.value %}text-gray-500 dark:text-gray-300{% else %}text-gray-300 dark:text-gray-300{% endif %}">
 
         <div class="flex flex-none items-center leading-none self-stretch">
             <input type="{{ widget.type }}" name="{{ widget.name }}" class="{{ widget.file_input_class }}" {% include "django/forms/widgets/attrs.html" %} />

unfold/templates/unfold/widgets/foreign_key_raw_id.html

@@ -2,14 +2,18 @@
     {% include 'django/forms/widgets/input.html' %}
 
     {% if related_url %}
-        <a href="{{ related_url }}" class="related-lookup related-widget-wrapper-link view-related bg-white border cursor-pointer flex items-center h-9.5 justify-center ml-2 rounded shadow-sm shrink-0 text-gray-400 text-sm w-9.5 hover:text-gray-700 dark:bg-gray-900 dark:border-gray-700 dark:text-gray-500 dark:hover:text-gray-200" id="lookup_id_{{ widget.name }}">
+        <a href="{{ related_url }}" class="related-lookup view-related bg-white border cursor-pointer flex items-center h-9.5 justify-center ml-2 rounded shadow-sm shrink-0 text-gray-400 text-sm w-9.5 hover:text-gray-700 dark:bg-gray-900 dark:border-gray-700 dark:text-gray-500 dark:hover:text-gray-200" id="lookup_id_{{ widget.name }}">
             <span class="material-symbols-outlined text-sm">search</span>
         </a>
     {% endif %}
 
-    {% if link_label and link_url %}
-        <a href="{{ link_url }}" title="{{ link_label }}" class="bg-white border cursor-pointer flex items-center h-9.5 justify-center ml-2 rounded shadow-sm shrink-0 text-gray-400 text-sm w-9.5 hover:text-gray-700 dark:bg-gray-900 dark:border-gray-700 dark:text-gray-500 dark:hover:text-gray-200">
-            <span class="material-symbols-outlined text-sm">visibility</span>
+    {% if link_url %}
+        <a href="{{ link_url }}" title="{{ link_label }}" class="flex items-center h-9.5 justify-center ml-4 rounded shrink-0 text-primary-600 text-sm dark:text-primary-500">
+            {{ link_label }}
         </a>
+    {% else %}
+        <span title="{{ link_label }}" class="bg-white flex items-center h-9.5 justify-center ml-4 rounded shrink-0 text-sm">
+            {{ link_label }}
+        </span>
     {% endif %}
 </div>

unfold/templates/unfold/widgets/radio_option.html

@@ -5,7 +5,7 @@
 {% include "django/forms/widgets/input.html" %}
 
 {% if widget.wrap_label %}
-        <span class="text-sm text-gray-900 dark:text-gray-200">
+        <span>
             {{ widget.label }}
         </span>
     </label>

unfold/templates/unfold/widgets/split_datetime.html

@@ -1,6 +1,6 @@
 <div class="datetime flex flex-col gap-2 max-w-2xl lg:flex-row lg:group-[.field-row]:flex-row lg:group-[.field-row]:items-center lg:group-[.field-tabular]:flex-row lg:group-[.field-tabular]:items-center">
     <div class="basis-1/2 flex flex-col lg:group-[.field-row]:flex-row group-[.field-row]:gap-2 lg:group-[.field-tabular]:flex-row group-[.field-tabular]:gap-2">
-        <div class="font-medium mb-2 text-gray-500 text-sm dark:text-gray-300 group-[.field-row]:mb-0 group-[.field-row]:flex group-[.field-row]:items-center group-[.field-tabular]:mb-0 group-[.field-tabular]:flex group-[.field-tabular]:items-center">
+        <div class="font-medium mb-2 group-[.field-row]:mb-0 group-[.field-row]:flex group-[.field-row]:items-center group-[.field-tabular]:mb-0 group-[.field-tabular]:flex group-[.field-tabular]:items-center">
             {{ date_label }}
         </div>
 
@@ -12,7 +12,7 @@
     </div>
 
     <div class="basis-1/2 flex flex-col lg:ml-auto md:mt-0 lg:group-[.field-row]:flex-row group-[.field-row]:gap-2 lg:group-[.field-tabular]:flex-row group-[.field-tabular]:gap-2">
-        <div class="font-medium mb-2 text-gray-500 text-sm dark:text-gray-300 group-[.field-row]:mb-0 group-[.field-row]:flex group-[.field-row]:items-center group-[.field-tabular]:mb-0 group-[.field-tabular]:flex group-[.field-tabular]:items-center">
+        <div class="font-medium mb-2 group-[.field-row]:mb-0 group-[.field-row]:flex group-[.field-row]:items-center group-[.field-tabular]:mb-0 group-[.field-tabular]:flex group-[.field-tabular]:items-center">
             {{ time_label }}
         </div>