django-unfold 0.57.0__py3-none-any.whl → 0.59.0__py3-none-any.whl

unfold/styles.css

@@ -1,20 +1,38 @@
 @import 'tailwindcss';
 @plugin '@tailwindcss/typography';
-@custom-variant dark (&:where(.dark, .dark *));
+
+@custom-variant dark {
+  @media not print {
+      &:where(.dark, .dark *) {
+          @slot
+      }
+  }
+}
+
 @source inline("h-3 w-3 h-[64px] w-[65px]! left-[65px] dark:hover:bg-white/[.06] translate-x-1/4 -translate-y-1/4");
-@source inline("{-,}{top,bottom,left,right}-{0..4}");
-@source inline("rounded-{t,r,b,l}-default");
+@source inline("{-,}{top,bottom,left,right}-{0..6}");
+@source inline("rounded rounded-{t,r,b,l} rounded-{t,r,b,l}-default");
 @source inline("{md:,lg:,2xl:,}relative {md:,lg:,2xl:,}flex {md:,lg:,2xl:,}absolute {md:,lg:,2xl:,}sticky");
-@source inline("{-,}m{t,r,b,l,x,y,}-{0..4} {-,}p{t,r,b,l,x,y,}-{0..4}");
+@source inline("{-,}m{t,r,b,l,x,y,}-{0..6} {-,}p{t,r,b,l,x,y,}-{0..6}");
 @source inline("{md:,lg:,}border-{0,2} {md:,lg:,}border-{t,r,b,l}-{0,2}");
 @source inline("{hover:,dark:,}bg-primary-{50,{100..900..100},950}");
 @source inline("{hover:,dark:,}border-base-{50,{100..900..100},950} {hover:,dark:,}border-transparent");
 @source inline("{hover:,dark:,}bg-base-{50,{100..900..100},950}");
-@source inline("{md:,lg:,}w-{1/2,1/3,2/3,1/4,2/4,3/4,1/5,2/5,3/5,4/5}");
+@source inline("{md:,lg:,}w-{1/2,1/3,2/3,1/4,2/4,3/4,1/5,2/5,3/5,4/5,1/6,2/6,3/6,4/6,5/6,1/7,2/7,3/7,4/7,5/7,6/7}");
 @source inline("{md:,lg:,}gap-{0.5,{1..12}}");
 @source inline("{md:,lg:,}grid-cols-{1..12}");
 @source inline("{md:,lg:,}col-span-{1..12}");
 
+@layer base {
+  *,
+  ::after,
+  ::before,
+  ::backdrop,
+  ::file-selector-button {
+    border-color: var(--color-gray-200, currentColor);
+  }
+}
+
 @theme {
   --font-sans: 'Inter', sans-serif;
 }
@@ -135,18 +153,6 @@ select:after {
 /*******************************************************
  Table
  *******************************************************/
-table select {
-  @apply appearance-none bg-no-repeat border border-base-200 block cursor-pointer font-medium px-3 py-2 pr-5 rounded-default shadow-xs text-base-500;
-
-  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="rgb(156, 163, 175)"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M7 10l5 5 5-5H7z"/></svg>');
-  background-size: 1.125rem 1.125rem;
-  background-position: right 0.5rem center;
-}
-
-
-table select:focus {
-  @apply border-primary-600;
-}
 
 table tr.selected td,
 table tr.selected th {
@@ -347,7 +353,11 @@ h3 span:nth-child(3) {
   @apply outline-none;
 }
 
-.select2.select2-container.select2-container--focus{
+.select2.select2-container--open {
+  @apply border-b-0 border-primary-600 relative outline-2 -outline-offset-2 outline-primary-600;
+}
+
+.select2.select2-container.select2-container--focus {
   @apply outline-2 outline-primary-600 -outline-offset-2;
 }
 
@@ -355,152 +365,97 @@ h3 span:nth-child(3) {
   @apply border-red-600;
 }
 
-.select2-container.select2-container--admin-autocomplete
-  .select2-selection--single {
+.select2-container.select2-container--admin-autocomplete .select2-selection--single {
   @apply h-auto;
 }
 
-.select2-container.select2-container--admin-autocomplete
-  .select2-selection--single
-  .select2-selection__rendered {
+.select2-container.select2-container--admin-autocomplete .select2-selection--single .select2-selection__rendered {
   @apply font-medium h-9 px-3 py-2 text-font-default-light text-sm dark:text-font-default-dark;
 }
 
-.select2-container.select2-container--admin-autocomplete
-  .select2-selection--multiple
-  .select2-selection__clear,
-.select2-container.select2-container--admin-autocomplete
-  .select2-selection--single
-  .select2-selection__clear {
+.select2-container.select2-container--admin-autocomplete .select2-selection--multiple .select2-selection__clear,
+.select2-container.select2-container--admin-autocomplete .select2-selection--single .select2-selection__clear {
   @apply flex items-center h-9 -mt-2 text-[0px] after:text-base-400 hover:after:text-base-700 dark:hover:after:text-base-200 dark:after:text-base-500;
 }
 
-.select2-container.select2-container--admin-autocomplete
-  .select2-selection--multiple
-  .select2-selection__clear:after,
-.select2-container.select2-container--admin-autocomplete
-  .select2-selection--single
-  .select2-selection__clear:after {
+.select2-container.select2-container--admin-autocomplete .select2-selection--multiple .select2-selection__clear:after,
+.select2-container.select2-container--admin-autocomplete .select2-selection--single .select2-selection__clear:after {
   @apply material-symbols-outlined transition-all content-['close'] text-[18px] ;
 }
 
-.select2-container.select2-container--admin-autocomplete
-  .select2-selection--single
-  .select2-selection__arrow {
+.select2-container.select2-container--admin-autocomplete .select2-selection--single .select2-selection__arrow {
   @apply flex h-9 items-center mr-2 -mt-px;
+  @apply after:left-0 after:leading-none after:m-0 after:material-symbols-outlined after:text-base-400 after:text-lg dark:after:text-base-500;
 }
 
-.select2-container.select2-container--admin-autocomplete
-  .select2-selection--single
-  .select2-selection__arrow:after {
-  @apply left-0 leading-none m-0 material-symbols-outlined text-base-400 text-lg;
+.select2-container.select2-container--admin-autocomplete .select2-selection--single .select2-selection__arrow:after {
   content: "expand_more";
 }
 
-.select2-container.select2-container--admin-autocomplete
-  .select2-selection--single
-  .select2-selection__arrow
-  b {
+.select2-container.select2-container--admin-autocomplete .select2-selection--single .select2-selection__arrow b {
   @apply hidden;
 }
 
-.select2-container.select2-container--admin-autocomplete
-  .select2-search--dropdown {
-  @apply flex px-3 py-2;
-}
-
-.select2-container.select2-container--admin-autocomplete
-  .select2-search--dropdown
-  .select2-search__field {
-  @apply bg-base-50 border border-base-200 border-solid grow font-medium mx-0 outline-hidden px-3 py-2 rounded-default shadow-xs text-font-default-light text-sm w-full dark:bg-base-800 dark:border-base-800 dark:text-font-default-dark;
+.select2-container.select2-container--admin-autocomplete .select2-search--dropdown {
+  @apply border-b border-base-200 py-1.5 px-1 relative dark:border-base-700 before:absolute before:content-['search'] before:material-symbols-outlined before:left-4 before:top-2.5 before:text-base-400 before:text-lg dark:before:text-base-500;
 }
 
-.select2-container.select2-container--admin-autocomplete.select2-container--open.select2-container--above {
-  @apply rounded-t-none;
+.select2-container.select2-container--admin-autocomplete .select2-search--dropdown .select2-search__field {
+  @apply bg-base-100 border-0 border-base-200 border-solid grow font-medium mx-0 outline-hidden px-3 py-2 pl-9 rounded-default text-font-default-light text-sm w-full dark:bg-base-800 dark:border-base-800 dark:text-font-default-dark;
 }
 
-.select2-container.select2-container--admin-autocomplete.select2-container--open.select2-container--below {
-  @apply rounded-b-none;
+.select2-container .select2-results__options {
+  @apply py-1;
 }
 
 .select2-container.select2-container--open .select2-dropdown {
-  @apply border border-transparent outline-2 -outline-offset-2 outline-primary-600 pb-2 shadow-xs dark:bg-base-900;
+  @apply bg-white border border-base-200 rounded-default shadow-xs dark:border-base-700 dark:bg-base-900;
 }
 
 .select2-container.select2-container--open .select2-dropdown--below {
-  @apply rounded-t-none rounded-b -top-0.5;
+  @apply mt-1;
 }
 
 .select2-container.select2-container--open .select2-dropdown--above {
-  @apply rounded-b-none rounded-default -bottom-0.5;
-}
-
-.select2-container.select2-container--admin-autocomplete
-  .select2-results__option {
-  @apply block px-3 py-2 text-font-default-light text-sm transition-all dark:text-font-default-dark;
+  @apply mb-1;
 }
 
-.select2-container.select2-container--admin-autocomplete
-  .select2-results__option[aria-selected="true"] {
-  @apply text-primary-600 dark:text-primary-500;
+.select2-container.select2-container--admin-autocomplete .select2-results__option {
+  @apply block mb-0.5 mx-1 px-2 py-2 rounded-default text-font-default-light transition-all hover:bg-base-100 hover:text-base-700 dark:hover:bg-base-800 dark:hover:text-base-200 dark:text-font-default-dark last:mb-0;
 }
-
-.select2-container.select2-container--admin-autocomplete
-  .select2-results__option--highlighted[aria-selected="true"] {
-  @apply text-primary-600 dark:text-primary-500;
+.select2-container.select2-container--admin-autocomplete .select2-results__option[aria-selected="true"] {
+  @apply text-primary-600 dark:text-primary-500 flex items-center text-primary-600 dark:text-primary-500 after:content-['check'] after:material-symbols-outlined after:ml-auto;
 }
 
-.select2-container.select2-container--admin-autocomplete
-  .select2-selection--multiple
-  .select2-selection__clear {
+.select2-container.select2-container--admin-autocomplete .select2-selection--multiple .select2-selection__clear {
   @apply m-0 mr-3 top-0;
 }
 
-
-.select2-container.select2-container--admin-autocomplete
-  .select2-selection--multiple
-  .select2-selection__rendered {
+.select2-container.select2-container--admin-autocomplete .select2-selection--multiple .select2-selection__rendered {
   @apply pl-1 pr-6 py-0 pt-1;
 }
 
-.select2-container.select2-container--admin-autocomplete
-  .select2-selection--single
-  .select2-selection__rendered {
+.select2-container.select2-container--admin-autocomplete .select2-selection--single .select2-selection__rendered {
   @apply pr-8;
 }
 
-.select2-container--admin-autocomplete
-  .select2-selection--multiple
-  li.select2-selection__choice {
+.select2-container--admin-autocomplete .select2-selection--multiple li.select2-selection__choice {
   @apply bg-base-100 block font-medium h-7 leading-7 m-0 mr-1 mb-1 px-2 shadow-inner text-sm text-base-600 hover:text-base-700 truncate dark:bg-base-800 dark:text-base-300 dark:hover:text-base-200;
 }
 
-.select2-container--admin-autocomplete
-  .select2-selection--multiple
-  li.select2-selection__choice
-  .select2-selection__choice__remove {
+.select2-container--admin-autocomplete .select2-selection--multiple li.select2-selection__choice .select2-selection__choice__remove {
   @apply align-top text-[0px] hover:text-base-600 dark:hover:text-base-200;
 }
 
-.select2-container--admin-autocomplete
-  .select2-selection--multiple
-  li.select2-selection__choice
-  .select2-selection__choice__remove:after {
+.select2-container--admin-autocomplete .select2-selection--multiple li.select2-selection__choice .select2-selection__choice__remove:after {
   @apply h-7 leading-7! material-symbols-outlined;
 
   content: "close";
   font-size: 14px;
 }
 
-.select2-container--admin-autocomplete
-  .select2-selection--multiple
-  li.select2-search--inline
-  .select2-search__field {
-  @apply m-0 h-7 text-base-500 text-sm;
-}
-
-.select2.select2-container--open {
-  @apply border-b-0 border-primary-600 relative outline-2 -outline-offset-2 outline-primary-600;
+.select2-container--admin-autocomplete .select2-selection--multiple li.select2-search--inline .select2-search__field {
+  @apply m-0 h-7 ml-2 text-base-500 text-sm;
 }
 
 /*******************************************************

unfold/templates/admin/auth/user/change_password.html

@@ -1,7 +1,7 @@
 {% extends "admin/base_site.html" %}
 {% load admin_urls i18n static %}
 
-{% block extrastyle %}{{ block.super }}<link rel="stylesheet" type="text/css" href="{% static "admin/css/forms.css" %}">{% endblock %}
+{% block extrastyle %}{{ block.super }}{% endblock %}
 {% block bodyclass %}{{ block.super }} {{ opts.app_label }}-{{ opts.model_name }} change-form{% endblock %}
 
 {% if not is_popup %}

unfold/templates/admin/base.html

@@ -38,7 +38,7 @@
                 </div>
             {% endblock messages %}
 
-            <div class="px-4 pb-8 grow">
+            <div class="px-4 pb-4 grow">
                 <div id="content" class="{% if not cl.model_admin.list_fullwidth %}container{% endif %} mx-auto {% block coltype %}colM{% endblock %}">
                     {% if cl %}
                         {% tab_list "changelist" cl.opts %}

unfold/templates/admin/change_form.html

@@ -93,8 +93,9 @@
                                 {% include 'admin/includes/fieldset.html' %}
                             {% endif %}
                         {% endfor %}
+
+                        {% include "unfold/helpers/fieldsets_tabs.html" %}
                     {% endwith %}
-                    {% include "unfold/helpers/fieldsets_tabs.html" %}
                 {% endblock %}
 
                 {% block after_field_sets %}{% endblock %}

unfold/templates/admin/edit_inline/stacked.html

@@ -17,7 +17,7 @@
         {{ inline_admin_formset.formset.management_form }}
         {% include "unfold/helpers/messages/error.html" with errors=inline_admin_formset.formset.non_form_errors %}
 
-        <div class="border border-base-200 mb-6 overflow-hidden rounded-default shadow-xs w-full dark:border-base-800 *:border-t *:first:border-t-0 *:border-base-200 dark:*:border-base-800"
+        <div class="border border-base-200 mb-6 overflow-hidden rounded-default shadow-xs w-full dark:border-base-800 *:border-t first-of-type:border-t-0 *:border-base-200 dark:*:border-base-800"
              {% if inline_admin_formset.opts.ordering_field %}
                  data-ordering-field="{{ inline_admin_formset.opts.ordering_field }}" x-on:end="sortRecords" x-sort.ghost
              {% endif %}>

unfold/templates/admin/includes/fieldset.html

@@ -2,9 +2,15 @@
 
 <fieldset class="module{% if fieldset.classes %} {{ fieldset.classes }}{% endif %}" {% if stacked != 1 %}x-show="activeTab == 'general'"{% endif %}>
     {% if fieldset.name and "tab" not in fieldset.classes %}
-        <h2 class="bg-base-100 font-semibold mb-6 px-4 py-3 rounded-default text-font-important-light text-sm 2xl:-mx-4 dark:bg-white/[.02] dark:text-font-important-dark">
-            {{ fieldset.name }}
-        </h2>
+        {% if stacked == 1 %}
+            <h2 class="bg-base-50 border-b border-base-200 border-t border-dashed font-semibold text-font-important-light px-3 py-2 dark:text-font-important-dark dark:bg-white/[.02] dark:border-base-800">
+                {{ fieldset.name }}
+            </h2>
+        {% else %}
+            <h2 class="bg-base-100 font-semibold mb-6 px-4 py-3 rounded-default text-font-important-light text-sm 2xl:-mx-4 dark:bg-white/[.02] dark:text-font-important-dark">
+                {{ fieldset.name }}
+            </h2>
+        {% endif %}
     {% endif %}
 
     {% if fieldset.description %}

unfold/templates/admin/login.html

@@ -63,7 +63,7 @@
                     {% url 'admin_password_reset' as password_reset_url %}
 
                     <div class="submit-row">
-                        <button type="submit" class="bg-primary-600 border border-transparent flex flex-row font-semibold group items-center justify-center py-2 rounded-default text-sm text-white w-full">
+                        <button type="submit" class="bg-primary-600 border border-transparent cursor-pointer flex flex-row font-semibold group items-center justify-center py-2 rounded-default text-sm text-white w-full">
                             {% translate 'Log in' %}
 
                             <span class="material-symbols-outlined ml-2 relative right-0 text-base transition-all group-hover:-right-1">arrow_forward</span>

unfold/templates/admin/pagination.html

@@ -15,7 +15,7 @@
 
     {% if cl.formset and cl.result_count %}
         <div class="ml-auto">
-            <button type="submit" name="_save" form="changelist-form" class="bg-primary-600 block border border-transparent font-medium px-3 py-2 rounded-default text-white w-full">
+            <button type="submit" name="_save" form="changelist-form" class="bg-primary-600 block border border-transparent cursor-pointer font-medium px-3 py-2 rounded-default text-white w-full">
                 {% translate 'Save' %}
             </button>
         </div>

unfold/templates/admin/submit_line.html

@@ -5,13 +5,13 @@
         <div class="flex flex-col-reverse gap-3 items-center mx-auto lg:flex-row-reverse container lg:h-[64px]">
             {% block submit-row %}
                 {% if show_save %}
-                    <button type="submit" form="{{ opts.model_name }}_form" name="_save" class="bg-primary-600 block border border-transparent font-medium px-3 py-2 rounded-default text-white w-full lg:w-auto">
+                    <button type="submit" form="{{ opts.model_name }}_form" name="_save" class="bg-primary-600 block border border-transparent cursor-pointer font-medium px-3 py-2 rounded-default text-white w-full lg:w-auto">
                         {% translate 'Save' %}
                     </button>
                 {% endif %}
 
                 {% for action in actions_submit_line %}
-                    <button type="submit" form="{{ opts.model_name }}_form" {% if not action.attrs.name %}name="{{ action.action_name }}"{% endif %} class="border border-base-200 flex font-medium gap-2 items-center px-3 py-2 rounded-default transition-all w-full hover:bg-base-50 lg:w-auto dark:border-base-700 dark:hover:text-base-200 dark:hover:bg-base-900" {% include "unfold/helpers/attrs.html" with attrs=action.attrs %}>
+                    <button type="submit" form="{{ opts.model_name }}_form" {% if not action.attrs.name %}name="{{ action.action_name }}"{% endif %} class="border border-base-200 cursor-pointer flex font-medium gap-2 items-center justify-center px-3 py-2 rounded-default transition-all w-full hover:bg-base-50 lg:w-auto dark:border-base-700 dark:hover:text-base-200 dark:hover:bg-base-900" {% include "unfold/helpers/attrs.html" with attrs=action.attrs %}>
                         {% if action.icon %}
                             <span class="material-symbols-outlined">
                                 {{ action.icon }}
@@ -23,7 +23,7 @@
                 {% endfor %}
 
                 {% if show_save_and_continue %}
-                    <button type="submit" form="{{ opts.model_name }}_form" name="_continue" class="border border-base-200 font-medium px-3 py-2 rounded-default transition-all w-full hover:bg-base-50 lg:block lg:w-auto dark:border-base-700  dark:hover:text-base-200 dark:hover:bg-base-900">
+                    <button type="submit" form="{{ opts.model_name }}_form" name="_continue" class="border border-base-200 cursor-pointer font-medium px-3 py-2 rounded-default transition-all w-full hover:bg-base-50 lg:block lg:w-auto dark:border-base-700  dark:hover:text-base-200 dark:hover:bg-base-900">
                         {% if can_change %}
                             {% translate 'Save and continue editing' %}
                         {% else %}
@@ -33,13 +33,13 @@
                 {% endif %}
 
                 {% if show_save_and_add_another %}
-                    <button type="submit" form="{{ opts.model_name }}_form" name="_addanother" class="border border-base-200 font-medium px-3 py-2 rounded-default transition-all w-full hover:bg-base-50 lg:block lg:w-auto dark:border-base-700  dark:hover:text-base-200 dark:hover:bg-base-900">
+                    <button type="submit" form="{{ opts.model_name }}_form" name="_addanother" class="border border-base-200 cursor-pointer font-medium px-3 py-2 rounded-default transition-all w-full hover:bg-base-50 lg:block lg:w-auto dark:border-base-700  dark:hover:text-base-200 dark:hover:bg-base-900">
                         {% translate 'Save and add another' %}
                     </button>
                 {% endif %}
 
                 {% if show_save_as_new %}
-                    <button type="submit" form="{{ opts.model_name }}_form" name="_saveasnew" class="border border-base-200 font-medium px-3 py-2 rounded-default transition-all w-full hover:bg-base-50 lg:block lg:w-auto dark:border-base-700  dark:hover:text-base-200 dark:hover:bg-base-900">
+                    <button type="submit" form="{{ opts.model_name }}_form" name="_saveasnew" class="border border-base-200 cursor-pointer font-medium px-3 py-2 rounded-default transition-all w-full hover:bg-base-50 lg:block lg:w-auto dark:border-base-700  dark:hover:text-base-200 dark:hover:bg-base-900">
                         {% translate 'Save as new' %}
                     </button>
                 {% endif %}
@@ -48,7 +48,7 @@
                     {% if show_close or adminform.model_admin.change_form_show_cancel_button %}
                         {% url opts|admin_urlname:'changelist' as changelist_url %}
 
-                        <a href="{% add_preserved_filters changelist_url %}" class="border border-base-200 font-medium px-3 py-2 rounded-default text-center transition-all w-full hover:bg-base-50 lg:block lg:w-auto dark:border-base-700  dark:hover:text-base-200 dark:hover:bg-base-900">
+                        <a href="{% add_preserved_filters changelist_url %}" class="border border-base-200 cursor-pointer font-medium px-3 py-2 rounded-default text-center transition-all w-full hover:bg-base-50 lg:block lg:w-auto dark:border-base-700  dark:hover:text-base-200 dark:hover:bg-base-900">
                             {% translate 'Close' %}
                         </a>
                     {% endif %}
@@ -56,7 +56,7 @@
                     {% if show_delete_link and original %}
                         {% url opts|admin_urlname:'delete' original.pk|admin_urlquote as delete_url %}
 
-                        <a href="{% add_preserved_filters delete_url %}" class="bg-red-600 flex items-center justify-center font-medium h-[38px] ml-auto px-3 py-2 rounded-default text-center text-white w-full lg:w-auto dark:bg-red-500/20 dark:text-red-500">
+                        <a href="{% add_preserved_filters delete_url %}" class="bg-red-600 cursor-pointer flex items-center justify-center font-medium h-[38px] ml-auto px-3 py-2 rounded-default text-center text-white w-full lg:w-auto dark:bg-red-500/20 dark:text-red-500">
                             {% translate "Delete" %} {{ opts.verbose_name }}
                         </a>
                     {% endif %}

unfold/templates/registration/password_change_done.html

@@ -1,7 +1,7 @@
 {% extends "admin/base_site.html" %}
 {% load admin_urls i18n static %}
 
-{% block extrastyle %}{{ block.super }}<link rel="stylesheet" type="text/css" href="{% static "admin/css/forms.css" %}">{% endblock %}
+{% block extrastyle %}{{ block.super }}">{% endblock %}
 
 {% if not is_popup %}
     {% block breadcrumbs %}

unfold/templates/registration/password_change_form.html

@@ -1,7 +1,7 @@
 {% extends "admin/base_site.html" %}
 {% load admin_urls i18n static %}
 
-{% block extrastyle %}{{ block.super }}<link rel="stylesheet" type="text/css" href="{% static "admin/css/forms.css" %}">{% endblock %}
+{% block extrastyle %}{{ block.super }}{% endblock %}
 
 {% if not is_popup %}
     {% block breadcrumbs %}

unfold/templates/unfold/components/button.html

@@ -1,4 +1,4 @@
 <{% if href %}a href="{{ href }}"{% else %}button{% endif%} {% if submit %}type="submit"{% endif%} {% if name %}name="{{ name }}"{% endif %}
-class="border border-base-200 font-medium flex items-center gap-2 px-3 py-2 rounded-default justify-center whitespace-nowrap {% if attrs.disabled %}cursor-not-allowed opacity-50{% endif %} {% if variant == "default" %}bg-white dark:border-base-700 dark:bg-transparent dark:text-white{% else %}bg-primary-600 border-transparent text-white{% endif %}{% if class %} {{ class }}{% endif %}" {% include "unfold/helpers/attrs.html" %}>
+class="border border-base-200 font-medium flex items-center gap-2 px-3 py-2 rounded-default justify-center whitespace-nowrap {% if attrs.disabled %}cursor-not-allowed opacity-50{% endif %} {% if variant == "default" %}bg-white text-font-important-light dark:border-base-700 dark:bg-transparent dark:text-font-important-dark{% else %}bg-primary-600 border-transparent text-white{% endif %}{% if class %} {{ class }}{% endif %}" {% include "unfold/helpers/attrs.html" %}>
 {{ children }}
 </{% if href %}a{% else %}button{% endif%}>

unfold/templates/unfold/components/card.html

@@ -1,27 +1,27 @@
-<div class="bg-white border border-base-200 flex flex-col grow overflow-hidden p-6 relative rounded-default shadow-xs dark:bg-base-900 dark:border-base-800 {% if class %} {{ class }}{% endif %}">
-    {% if title %}
-        <h2 class="bg-base-50 border-b border-base-200 font-semibold mb-6 -mt-6 -mx-6 py-4 px-6 text-font-important-light dark:text-font-important-dark dark:border-base-800 dark:bg-white/[.02]">
-            {{ title }}
-        </h2>
-    {% endif %}
-
-    <div class="grow relative {% if icon %} pl-6{% endif %}">
-        {{ children }}
-
-        {% if label %}
-            <div class="absolute right-0 top-0">
-                {% include "unfold/helpers/label.html" with text=label type="primary" %}
-            </div>
-        {% endif %}
+<{% if href %}a href="{{ href }}"{% else %}div{% endif %} class="bg-white block border border-base-200 flex flex-col grow overflow-hidden p-6 relative rounded-default shadow-xs dark:bg-base-900 dark:border-base-800 {% if href %}cursor-pointer transition-all hover:border-base-300 hover:shadow-md hover:shadow-base-200 dark:hover:border-base-700 dark:hover:shadow-base-800/50 {% endif %}{% if class %} {{ class }}{% endif %}">
+{% if title %}
+    <h2 class="border-b border-base-200 font-semibold mb-6 -mt-6 -mx-6 py-4 px-6 text-[15px] text-font-important-light dark:text-font-important-dark dark:border-base-800">
+        {{ title }}
+    </h2>
+{% endif %}
 
-        {% if icon %}
-            <span class="material-symbols-outlined absolute -left-6 text-base-300 top-1/2 -translate-x-1/3 -translate-y-1/2 text-6xl! dark:text-base-500">{{ icon }}</span>
-        {% endif %}
-    </div>
+<span class="grow relative {% if icon %} pl-6{% endif %}">
+    {{ children }}
 
-    {% if footer %}
-        <div class="border-t border-base-200 flex items-center -mb-6 -mx-6 mt-6 pb-2 pt-2 px-6 text-sm dark:border-base-800">
-            {{ footer }}
+    {% if label %}
+        <div class="absolute right-0 top-0">
+            {% include "unfold/helpers/label.html" with text=label type="primary" %}
         </div>
     {% endif %}
-</div>
+
+    {% if icon %}
+        <span class="material-symbols-outlined absolute -left-6 text-base-300 top-1/2 -translate-x-1/3 -translate-y-1/2 text-6xl! dark:text-base-500">{{ icon }}</span>
+    {% endif %}
+</span>
+
+{% if footer %}
+    <span class="border-t border-base-200 flex items-center -mb-6 -mx-6 mt-6 pb-2 pt-2 px-6 text-sm dark:border-base-800">
+        {{ footer }}
+    </span>
+{% endif %}
+</{% if href %}a{% else %}div{% endif %}>

unfold/templates/unfold/components/progress.html

@@ -1,21 +1,23 @@
 <div class="{% if class %}{{ class }}{% endif %}">
-    <div class="overflow-hidden relative px-2 py-1 text-sm">
-        {% if value %}
-            <div class="absolute bottom-0 left-0 rounded-default top-0 bg-primary-100 z-10 dark:bg-primary-500/20" style="width: {{ value }}%"></div>
-        {% endif %}
-
+    <div class="flex flex-col gap-2 relative">
         <div class="flex flex-row relative z-20">
             {% if title %}
-                <h3 class="text-font-default-light dark:text-font-default-dark text-sm">
+                <h3 class="text-font-important-light dark:text-font-important-dark text-sm">
                     {{ title }}
                 </h3>
             {% endif %}
 
             {% if description %}
-                <strong class="font-semibold text-font-important-light ml-auto dark:text-font-important-dark">
+                <strong class="bg-base-100 font-medium text-font-important-light ml-auto px-1.5 py-1 rounded-default text-xs dark:text-font-important-dark dark:bg-base-800">
                     {{ description }}
                 </strong>
             {% endif %}
         </div>
+
+        {% if value %}
+            <div class="bg-gray-100 overflow-hidden rounded-default dark:bg-base-800">
+                <div class="h-1.5 bg-primary-600 rounded-default z-10 dark:bg-primary-500" title="{{ value }}%" style="width: {{ value }}%"></div>
+            </div>
+        {% endif %}
     </div>
 </div>

unfold/templates/unfold/components/table.html

@@ -1,6 +1,6 @@
 {% load i18n unfold %}
 
-<div class="flex flex-col">
+<div class="flex flex-col {% if class %}{{ class }}{% endif %}">
     {% if title %}
         <h3 class="font-semibold mb-1 text-font-important-light text-sm dark:text-font-important-dark">
             {{ title }}
@@ -11,10 +11,10 @@
         <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-base-900 dark:text-base-100 {% if height %}sticky top-0{% endif %}">
+                    <thead class="text-font-important-light dark:text-font-important-dark {% if height %}sticky top-0{% 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 text-sm 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 %}">
+                                <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 %}">
                                     {{ header|capfirst }}
                                 </th>
                             {% endfor %}
@@ -25,9 +25,9 @@
                 {% 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 mb-3 rounded-default shadow-xs{% else %}border-b{% endif %} lg:table-row lg:border-none lg:mb-0 lg:shadow-none dark:border-base-800">
+                            <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 %}
-                                    <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:items-center before:mr-auto first:border-t-0 lg:group-[.first-row]:border-t-0 lg:before:hidden lg:first:border-t 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 %}>
+                                    <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 %}

unfold/templates/unfold/helpers/account_links.html

@@ -6,7 +6,7 @@
     </a>
 
     <nav class="absolute bg-white border border-base-200 flex flex-col leading-none py-1 -right-2 rounded-default shadow-lg top-7 w-52 z-50 dark:bg-base-800 dark:border-base-700" x-cloak x-show="openUserLinks" x-transition x-on:click.outside="openUserLinks = false">
-        <div class="border-b border-base-100 flex flex-row shrink-0 items-start justify-start mb-1 pb-1 dark:border-base-700">
+        <div class="border-b border-base-200 flex flex-row shrink-0 items-start justify-start mb-1 pb-1 dark:border-base-700">
             <span class="block mx-1 px-3 py-2 truncate">
                 {% firstof user.get_short_name user.get_username %}
             </span>
@@ -18,17 +18,25 @@
             </a>
         {% endif %}
 
-        {% if user.has_usable_password %}
-            <a href="{% url 'admin:password_change' %}" class="mx-1 px-3 py-2 rounded-default hover:bg-base-100 hover:text-base-700 dark:hover:bg-base-700 dark:hover:text-base-200">
-                {% translate 'Change password' %}
-            </a>
+        {% if account_links %}
+            {% for link in account_links %}
+                <a href="{{ link.link }}" class="mx-1 px-3 py-2 rounded-default hover:bg-base-100 hover:text-base-700 dark:hover:bg-base-700 dark:hover:text-base-200">
+                    {{ link.title }}
+                </a>
+            {% endfor %}
+        {% else %}
+            {% if user.has_usable_password %}
+                <a href="{% url 'admin:password_change' %}" class="mx-1 px-3 py-2 rounded-default hover:bg-base-100 hover:text-base-700 dark:hover:bg-base-700 dark:hover:text-base-200">
+                    {% translate 'Change password' %}
+                </a>
+            {% endif %}
         {% endif %}
 
         <div class="border-t border-base-200 mt-1 pt-1 dark:border-base-700">
             <form id="logout-form" method="post" action="{% url 'admin:logout' %}" class="mx-1">
                 {% csrf_token %}
 
-                <button type="submit" class="bg-none block px-3 py-2 text-left text-red-500 rounded-default w-full hover:bg-red-100 dark:hover:bg-red-500/20 dark:hover:text-red-500">
+                <button type="submit" class="bg-none block cursor-pointer px-3 py-2 text-left text-red-500 rounded-default w-full hover:bg-red-100 dark:hover:bg-red-500/20 dark:hover:text-red-500">
                     {% translate 'Log out' %}
                 </button>
             </form>

unfold/templates/unfold/helpers/change_list_actions.html

@@ -2,8 +2,8 @@
 
 {% if actions_on_top %}
     {% if cl.search_fields or action_form or cl.has_filters %}
-        <div class="bottom-0 left-0 right-0 hidden bg-primary-600 group-has-[input.action-select:checked]:flex fixed gap-3 lg:h-[71px] items-center p-3 z-50 lg:flex-row dark:bg-primary-500">
-            <div id="changelist-actions-wrapper" class="grow lg:px-4" {% if not is_popup %}x-bind:class="{'xl:ml-0': !sidebarDesktopOpen, 'xl:ml-72': sidebarDesktopOpen}"{% endif %}>
+        <div class="bottom-0 left-0 right-0 hidden bg-primary-600 group-has-[input.action-select:checked]:flex fixed gap-3 lg:h-[64px] items-center p-3 z-50 lg:flex-row dark:bg-primary-500">
+            <div id="changelist-actions-wrapper" class="grow" {% if not is_popup %}x-bind:class="{'xl:ml-0': !sidebarDesktopOpen, 'xl:ml-72': sidebarDesktopOpen}"{% endif %}>
                 {% if action_form %}
                     {% admin_actions %}
                 {% endif %}

unfold/templates/unfold/helpers/change_list_filter_actions.html

@@ -3,7 +3,7 @@
 {% if cl.model_admin.list_filter_submit or cl.is_facets_optional or cl.has_active_filters %}
     <div class="bg-white border-t border-base-200 p-3 py-2.5 dark:bg-base-800 dark:border-base-700{% if not cl.model_admin.list_filter_sheet %} 2xl:border-t-0! 2xl:bg-transparent! 2xl:px-0{% endif %}">
         {% if cl.model_admin.list_filter_submit %}
-            <button type="submit" class="bg-primary-600 block border border-transparent font-medium px-3 py-2 rounded-default text-white w-full">
+            <button type="submit" class="bg-primary-600 block border border-transparent cursor-pointer font-medium px-3 py-2 rounded-default text-white w-full">
                 {% trans "Apply Filters" %}
             </button>
         {% endif %}
@@ -12,7 +12,7 @@
             <span id="changelist-filter-extra-actions" class="flex flex-row gap-2 items-center mt-2">
                 {% if cl.is_facets_optional %}
                     {% if cl.add_facets %}
-                        <a href="{{ cl.remove_facet_link }}" class="hidelink border grow font-medium px-3 py-2 rounded-default text-center transition-all w-full hover:bg-base-50 lg:w-auto dark:border-base-700 dark:hover:text-base-200">
+                        <a href="{{ cl.remove_facet_link }}" class="hidelink border border-base-200 grow font-medium px-3 py-2 rounded-default text-center transition-all w-full lg:w-auto dark:border-base-700 dark:hover:text-base-200">
                             {% trans "Hide counts" %}
                         </a>
                     {% else %}