django-unfold 0.22.0__py3-none-any.whl → 0.24.0__py3-none-any.whl

unfold/templates/admin/change_list_results.html

@@ -8,10 +8,10 @@
 
 {% if results %}
     <table id="result_list" class="block border-gray-200 border-spacing-none border-separate text-gray-700 w-full dark:text-gray-400 lg:border lg:rounded-md lg:shadow-sm lg:table lg:dark:border-gray-800">
-        <thead class="hidden lg:table-header-group">
+        <thead>
             <tr>
                 {% for header in result_headers %}
-                    <th class="align-middle font-medium px-3 py-2 text-left text-gray-400 text-sm {{ header.class_attrib }} {% if "action-toggle" in header.text and forloop.counter == 1 %}w-10{% endif %}" scope="col">
+                    <th class="align-middle font-medium py-2 text-left text-gray-400 text-sm {{ header.class_attrib }} {% if "action-toggle" in header.text and forloop.counter == 1 %}lg:px-3 lg:w-10{% else %}hidden px-3 lg:table-cell{% endif %}" scope="col">
                         <div class="flex items-center">
                             <div class="text">
                                 {% if header.sortable %}
@@ -19,7 +19,19 @@
                                         {{ header.text|capfirst }}
                                     </a>
                                 {% else %}
-                                    <span>{{ header.text|capfirst }}</span>
+                                    {% if "action-toggle" in header.text and forloop.counter == 1 %}
+                                        <label class="flex flex-row items-center gap-2">
+                                            {{ header.text|capfirst }}
+
+                                            <span class="block font-normal text-gray-500 dark:text-gray-400 lg:hidden">
+                                                {% trans "Select all rows"%}
+                                            </span>
+                                        </label>
+                                    {% else %}
+                                        <span>
+                                            {{ header.text|capfirst }}
+                                        </span>
+                                    {% endif %}
                                 {% endif %}
                             </div>
 

unfold/templates/admin/edit_inline/tabular.html

@@ -109,11 +109,11 @@
                                                 {% with is_last_col=forloop.last %}
                                                     {% for field in line %}
                                                         {% if field.is_readonly or not field.field.is_hidden %}
-                                                            <td{% if field.field.name %} class="field-{{ field.field.name }}{% if field.field.errors|length > 0 %} errors{% endif %}{% if inline_admin_form.original %} p-3 lg:py-3{% else %} py-3{% endif %}{% if field.is_checkbox %} align-middle{% else %} align-top{% endif %} {% if is_last_row and not inline_admin_formset.has_add_permission %}{% if is_last_col %}border-0 {% else %}border-b lg:border-0{% endif %}{% else %}border-b{% endif %} border-gray-200 flex items-center before:capitalize before:content-[attr(data-label)] before:mr-auto before:text-gray-500 before:w-72 lg:before:hidden font-normal px-3 text-left text-sm lg:table-cell dark:border-gray-800"{% endif %} data-label="{{ field.field.label }}">
+                                                            <td{% if field.field.name %} class="field-{{ field.field.name }}{% if field.field.errors|length > 0 %} errors{% endif %}{% if inline_admin_form.original %} p-3 lg:py-3{% else %} py-3{% endif %}{% if field.is_checkbox %} align-middle{% else %} align-top{% endif %} {% if is_last_row and not inline_admin_formset.has_add_permission %}{% if is_last_col %}border-0 {% else %}border-b lg:border-0{% endif %}{% else %}border-b{% endif %} border-gray-200 flex items-center before:capitalize before:content-[attr(data-label)] before:mr-auto before:text-gray-500 before:w-72 lg:before:hidden font-normal px-3 text-left text-sm lg:table-cell dark:border-gray-800 {% if field.field.is_hidden %} !hidden{% endif %}"{% endif %} data-label="{{ field.field.label }}">
                                                                 {% if field.is_readonly %}
-                                                                    <p class="bg-gray-50 border font-medium max-w-lg px-3 py-2 rounded-md shadow-sm text-gray-500 text-sm truncate whitespace-nowrap dark:border-gray-700 dark:text-gray-400 dark:bg-gray-800">
+                                                                    <div class="bg-gray-50 border font-medium max-w-lg px-3 py-2 rounded-md shadow-sm text-gray-500 text-sm truncate whitespace-nowrap dark:border-gray-700 dark:text-gray-400 dark:bg-gray-800">
                                                                         {{ field.contents }}
-                                                                    </p>
+                                                                    </div>
                                                                 {% else %}
                                                                     {{ field.field }}
 

unfold/templates/admin/filter.html

@@ -1,12 +1,12 @@
 {% load i18n unfold %}
 
 <div class="mb-6">
-    <h3 class="font-medium mb-4 text-gray-700 text-sm dark:text-gray-200">
+    <h3 class="font-medium mb-2 text-gray-700 text-sm dark:text-gray-200">
         {% blocktranslate with filter_title=title %} By {{ filter_title }} {% endblocktranslate %}
     </h3>
 
     {% for choice in choices %}
-        {% if choice.selected %}
+        {% if choice.selected and spec.lookup_val.0 %}
             <input type="hidden" name="{{ spec.lookup_kwarg }}" value="{{ spec.lookup_val.0 }}" />
         {% endif %}
     {% endfor %}

unfold/templates/admin/search_form.html

@@ -1,19 +1,17 @@
 {% load i18n static %}
 
 {% if cl.search_fields %}
-    <div id="toolbar" class="lg:w-72">
-        <div>
-            <div class="bg-white border flex rounded-md overflow-hidden shadow-sm focus-within:ring focus-within:ring-primary-300 focus-within:border-primary-600 dark:bg-gray-900 dark:border-gray-700 dark:focus-within:border-primary-600 dark:focus-within:ring-primary-700 dark:focus-within:ring-opacity-50">
-                <input class="font-medium h-9 px-3 text-gray-500 text-sm w-40 lg:w-60 focus:outline-none dark:bg-gray-900 dark:text-gray-400" type="text" name="{{ search_var }}" value="{{ cl.query }}" id="searchbar" placeholder="{% trans 'Type to search' %}" />
+    <div id="toolbar">
+        <div class="bg-white border flex rounded-md overflow-hidden shadow-sm lg:w-64 focus-within:ring focus-within:ring-primary-300 focus-within:border-primary-600 dark:bg-gray-900 dark:border-gray-700 dark:focus-within:border-primary-600 dark:focus-within:ring-primary-700 dark:focus-within:ring-opacity-50">
+            <input class="font-medium grow min-w-0 h-9 px-3 text-gray-500 text-sm focus:outline-none dark:bg-gray-900 dark:text-gray-400" type="text" name="{{ search_var }}" value="{{ cl.query }}" id="searchbar" placeholder="{% trans 'Type to search' %}" />
 
-                <button type="submit" class="flex items-center ml-auto px-2 focus:outline-none" id="searchbar-submit">
-                    <span class="material-symbols-outlined md-18 text-gray-400 dark:text-gray-500">search</span>
-                </button>
-            </div>
-
-            {% for pair in cl.params.items %}
-                {% if pair.0 != search_var %}<input type="hidden" name="{{ pair.0 }}" value="{{ pair.1 }}">{% endif %}
-            {% endfor %}
+            <button type="submit" class="flex items-center px-2 focus:outline-none" id="searchbar-submit">
+                <span class="material-symbols-outlined md-18 text-gray-400 dark:text-gray-500">search</span>
+            </button>
         </div>
+
+        {% for pair in cl.params.items %}
+            {% if pair.0 != search_var %}<input type="hidden" name="{{ pair.0 }}" value="{{ pair.1 }}">{% endif %}
+        {% endfor %}
     </div>
 {% endif %}

unfold/templates/unfold/helpers/display_header.html

@@ -1,17 +1,20 @@
 <div class="flex gap-4 items-center">
-  {% if value.2 %}
-    <div class="border flex font-medium h-8 justify-center items-center rounded-full text-xs uppercase w-8 dark:border-gray-700">
-      {{ value.2 }}
-    </div>
-  {% endif %}
+    {% if value.3 and value.3.path %}
+        <div class="bg-center bg-cover bg-white border flex font-medium h-8 w-8 dark:bg-gray-900 dark:border-gray-700 {% if value.3.squared %}rounded-sm{% else %}rounded-full{% endif %}" style="background-image: url('{{ value.3.path }}')">
+        </div>
+    {% elif value.2 %}
+        <div 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">
+            {{ value.2 }}
+        </div>
+    {% endif %}
 
-  <div class="flex flex-col text-right lg:text-left">
-    <h3>{{ value.0 }}</h3>
+    <div class="flex flex-col text-right lg:text-left">
+        <h3>{{ value.0 }}</h3>
 
-    {% if value.1 %}
-      <p class="text-gray-500">
-        {{ value.1 }}
-      </p>
-    {% endif %}
-  </div>
+        {% if value.1 %}
+            <p class="text-gray-500">
+                {{ value.1 }}
+            </p>
+        {% endif %}
+    </div>
 </div>

unfold/templates/unfold/helpers/tab_list.html

@@ -1,6 +1,6 @@
 {% if not is_popup %}
     {% if tab_list or actions_list or actions_items or nav_global %}
-        <div class="flex items-start flex-col mb-2 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-400">
+        <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-400">
             {% if tab_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 tab_list %}

unfold/templates/unfold/layouts/base_simple.html

@@ -10,7 +10,7 @@
             {% endblock %}
         {% endif %}
 
-        <div id="main" class="shadow flex-grow">
+        <div id="main" class="shadow flex-grow min-w-0">
             {% block content_before %}
                 {% include "unfold/helpers/header.html" %}
             {% endblock %}

unfold/templates/unfold/widgets/date.html

@@ -1,3 +1,3 @@
-<div class="flex flex-col max-w-2xl relative">
+<div class="flex flex-col max-w-2xl min-w-48 relative w-full">
     {% include "django/forms/widgets/input.html" %}
 </div>

unfold/templates/{admin → unfold}/widgets/related_widget_wrapper.html

@@ -9,7 +9,7 @@
                 {% if not is_hidden %}
                     {% if can_add_related or can_change_related or can_delete_related or can_view_related%}
                         {% if can_change_related %}
-                            <a class="related-widget-wrapper-link change-related border cursor-pointer flex items-center h-9.5 justify-center ml-2 rounded shadow-sm shrink-0 text-gray-400 text-sm transition-colors w-9.5 hover:text-gray-700 dark:border-gray-700 dark:text-gray-500 dark:hover:text-gray-200"
+                            <a class="related-widget-wrapper-link change-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="change_id_{{ name }}"
                                data-popup="yes"
                                data-href-template="{{ change_related_template_url }}?{{ url_params }}"
@@ -19,7 +19,7 @@
                         {% endif %}
 
                         {% if can_add_related %}
-                            <a class="related-widget-wrapper-link add-related border cursor-pointer flex items-center h-9.5 justify-center ml-2 rounded shadow-sm shrink-0 text-gray-400 text-sm transition-colors w-9.5 hover:text-gray-700 dark:border-gray-700 dark:text-gray-500 dark:hover:text-gray-200"
+                            <a class="related-widget-wrapper-link add-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"
                                data-popup="yes"
                                id="add_id_{{ name }}"
                                 href="{{ add_related_url }}?{{ url_params }}"
@@ -29,7 +29,7 @@
                         {% endif %}
 
                         {% if can_view_related %}
-                            <a class="related-widget-wrapper-link view-related border cursor-pointer flex items-center h-9.5 justify-center ml-2 rounded shadow-sm shrink-0 text-gray-400 text-sm transition-colors w-9.5 hover:text-gray-700 dark:border-gray-700 dark:text-gray-500 dark:hover:text-gray-200"
+                            <a class="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="view_id_{{ name }}"
                                data-href-template="{{ change_related_template_url }}?{{ view_related_url_params }}"
                                title="{% blocktranslate %}View selected {{ model }}{% endblocktranslate %}">
@@ -38,7 +38,7 @@
                         {% endif %}
 
                         {% if can_delete_related %}
-                        <a class="related-widget-wrapper-link delete-related border cursor-pointer flex items-center h-9.5 justify-center ml-2 rounded shadow-sm shrink-0 text-red-600 text-sm transition-colors w-9.5 dark:border-gray-700 dark:text-red-500"
+                        <a class="related-widget-wrapper-link delete-related bg-white border cursor-pointer flex items-center h-9.5 justify-center ml-2 rounded shadow-sm shrink-0 text-red-600 text-sm w-9.5 dark:bg-gray-900 dark:border-gray-700 dark:text-red-500"
                                id="delete_id_{{ name }}"
                                 data-href-template="{{ delete_related_template_url }}?{{ url_params }}"
                                 data-popup="yes"

unfold/templates/unfold/widgets/time.html

@@ -1,3 +1,3 @@
-<div class="flex flex-col max-w-2xl relative">
+<div class="flex flex-col max-w-2xl min-w-48 relative w-full">
     {% include "django/forms/widgets/input.html" %}
 </div>

unfold/templatetags/unfold_list.py

@@ -37,9 +37,9 @@ from ..widgets import UnfoldBooleanWidget
 register = Library()
 
 LINK_CLASSES = [
-    "text-gray-700",
+    "text-gray-600",
     "truncate",
-    "dark:text-gray-200",
+    "dark:text-gray-300",
 ]
 
 ROW_CLASSES = [
@@ -54,6 +54,7 @@ ROW_CLASSES = [
     "px-3",
     "py-2",
     "text-left",
+    "text-gray-500",
     "text-sm",
     "before:flex",
     "before:capitalize",
@@ -63,6 +64,7 @@ ROW_CLASSES = [
     "before:text-gray-500",
     "first:border-t-0",
     "dark:before:text-gray-400",
+    "dark:text-gray-400",
     "lg:before:hidden",
     "lg:first:border-t",
     "lg:py-3",
@@ -149,7 +151,7 @@ def result_headers(cl):
         if is_sorted:
             order_type = ordering_field_columns.get(i).lower()
             sort_priority = list(ordering_field_columns).index(i) + 1
-            th_classes.append("sorted %sending" % order_type)
+            th_classes.append(f"sorted {order_type}ending")
             new_order_type = {"asc": "desc", "desc": "asc"}[order_type]
 
         # build new ordering param
@@ -186,7 +188,7 @@ def result_headers(cl):
             "url_primary": cl.get_query_string({ORDER_VAR: ".".join(o_list_primary)}),
             "url_remove": cl.get_query_string({ORDER_VAR: ".".join(o_list_remove)}),
             "url_toggle": cl.get_query_string({ORDER_VAR: ".".join(o_list_toggle)}),
-            "class_attrib": format_html(' class="{}"', " ".join(th_classes))
+            "class_attrib": format_html("{}", " ".join(th_classes))
             if th_classes
             else "",
         }
@@ -211,7 +213,7 @@ def items_for_result(cl: ChangeList, result: HttpRequest, form) -> SafeText:
     for field_index, field_name in enumerate(cl.list_display):
         empty_value_display = cl.model_admin.get_empty_value_display()
         row_classes = [
-            "field-%s" % _coerce_field_name(field_name, field_index),
+            f"field-{_coerce_field_name(field_name, field_index)}",
             *ROW_CLASSES,
         ]
 
@@ -252,7 +254,7 @@ def items_for_result(cl: ChangeList, result: HttpRequest, form) -> SafeText:
                     f, (models.DateField, models.TimeField, models.ForeignKey)
                 ):
                     row_classes.append("nowrap")
-        row_class = mark_safe(' class="%s"' % " ".join(row_classes))
+        row_class = mark_safe(f' class="{" ".join(row_classes)}"')
         # If list_display_links not defined, add the link tag to the first field
 
         if link_in_col(first, field_name, cl):

unfold/widgets.py

@@ -13,6 +13,7 @@ from django.contrib.admin.widgets import (
     AdminTextInputWidget,
     AdminTimeWidget,
     AdminUUIDInputWidget,
+    RelatedFieldWidgetWrapper,
 )
 from django.forms import (
     CheckboxInput,
@@ -291,7 +292,7 @@ class FileFieldMixin:
 
 
 class UnfoldAdminImageFieldWidget(FileFieldMixin, AdminFileWidget):
-    pass
+    template_name = "unfold/widgets/clearable_file_input.html"
 
 
 class UnfoldAdminFileFieldWidget(FileFieldMixin, AdminFileWidget):
@@ -374,6 +375,8 @@ class UnfoldAdminTextareaWidget(AdminTextareaWidget):
 
 
 class UnfoldAdminSplitDateTimeWidget(AdminSplitDateTime):
+    template_name = "unfold/widgets/split_datetime.html"
+
     def __init__(self, attrs: Optional[Dict[str, Any]] = None) -> None:
         widgets = [UnfoldAdminDateWidget, UnfoldAdminTimeWidget]
         MultiWidget.__init__(self, widgets, attrs)
@@ -433,10 +436,15 @@ class UnfoldAdminBigIntegerFieldWidget(AdminBigIntegerFieldWidget):
 
 
 class UnfoldAdminNullBooleanSelectWidget(NullBooleanSelect):
-    pass
+    def __init__(self, attrs=None):
+        if attrs is None:
+            attrs = {}
 
+        attrs["class"] = " ".join(SELECT_CLASSES)
+        super().__init__(attrs)
 
-class UnfoldAdminSelect(Select):
+
+class UnfoldAdminSelectWidget(Select):
     def __init__(self, attrs=None, choices=()):
         if attrs is None:
             attrs = {}
@@ -446,7 +454,8 @@ class UnfoldAdminSelect(Select):
 
 
 class UnfoldAdminRadioSelectWidget(AdminRadioSelect):
-    option_template_name = "admin/widgets/radio_option.html"
+    template_name = "unfold/widgets/radio.html"
+    option_template_name = "unfold/widgets/radio_option.html"
 
     def __init__(self, radio_style: Optional[int] = None, *args, **kwargs):
         super().__init__(*args, **kwargs)
@@ -473,7 +482,7 @@ try:
         def __init__(self, *args, **kwargs):
             super().__init__(
                 amount_widget=UnfoldAdminTextInputWidget,
-                currency_widget=UnfoldAdminSelect(choices=CURRENCY_CHOICES),
+                currency_widget=UnfoldAdminSelectWidget(choices=CURRENCY_CHOICES),
             )
 
 except ImportError:
@@ -506,3 +515,7 @@ class UnfoldBooleanSwitchWidget(CheckboxInput):
         return super().__init__(
             attrs={"class": " ".join(SWITCH_CLASSES), **(attrs or {})}, check_test=None
         )
+
+
+class UnfoldRelatedFieldWidgetWrapper(RelatedFieldWidgetWrapper):
+    template_name = "unfold/widgets/related_widget_wrapper.html"