django-unfold 0.37.0__py3-none-any.whl → 0.39.0__py3-none-any.whl

unfold/templates/admin/delete_confirmation.html

@@ -33,7 +33,7 @@
 {% block content %}
     {% if perms_lacking %}
         <div class="border border-gray-200 rounded-md shadow-sm dark:border-gray-800">
-            <p class="font-semibold p-4 text-gray-900 dark:text-gray-100">
+            <p class="font-semibold p-4 text-font-important-light dark:text-font-important-dark">
                 {% blocktranslate with escaped_object=object %}Deleting the {{ object_name }} '{{ escaped_object }}' would result in deleting related objects, but your account doesn't have permission to delete the following types of objects:{% endblocktranslate %}
             </p>
 
@@ -49,7 +49,7 @@
         </div>
     {% elif protected %}
         <div class="border border-gray-200 rounded-md shadow-sm dark:border-gray-800">
-            <p class="font-semibold p-4 text-gray-900 dark:text-gray-100">
+            <p class="font-semibold p-4 text-font-important-light dark:text-font-important-dark">
                 {% blocktranslate with escaped_object=object %}Deleting the {{ object_name }} '{{ escaped_object }}' would require deleting the following protected related objects:{% endblocktranslate %}
             </p>
 
@@ -65,14 +65,14 @@
         </div>
     {% else %}
         <div class="border border-gray-200 rounded-md shadow-sm dark:border-gray-800">
-            <p class="font-semibold p-4 text-gray-900 dark:text-gray-100">
+            <p class="font-semibold p-4 text-font-important-light dark:text-font-important-dark">
                 {% blocktranslate with escaped_object=object %}Are you sure you want to delete the {{ object_name }} "{{ escaped_object }}"? All of the following related items will be deleted:{% endblocktranslate %}
             </p>
 
             {% include "admin/includes/object_delete_summary.html" %}
 
             <div class="border-gray-200 border-t p-4 dark:border-gray-800">
-                <h2 class="font-semibold mb-2 text-gray-900 dark:text-gray-100">
+                <h2 class="font-semibold mb-2 text-font-important-light dark:text-font-important-dark">
                     {% translate "Objects" %}
                 </h2>
 
@@ -96,7 +96,7 @@
                     {% endif %}
 
 
-                    <a href="#" class="border cancel-link font-medium hidden mb-3 px-3 py-2 rounded-md w-full hover:bg-gray-50 lg:block lg:mb-0 lg:mr-3 lg:w-auto dark:border-gray-700 dark:text-gray-300 dark:hover:text-gray-200 dark:hover:bg-gray-900">
+                    <a href="#" class="border cancel-link font-medium hidden mb-3 px-3 py-2 rounded-md w-full hover:bg-gray-50 lg:block lg:mb-0 lg:mr-3 lg:w-auto dark:border-gray-700 dark:text-font-default-dark dark:hover:text-gray-200 dark:hover:bg-gray-900">
                         {% translate "No, take me back" %}
                     </a>
 

unfold/templates/admin/delete_selected_confirmation.html

@@ -33,7 +33,7 @@
 
 {% block content %}
     {% if perms_lacking %}
-        <p class="font-semibold p-4 text-gray-900 dark:text-gray-100">
+        <p class="font-semibold p-4 text-font-important-light dark:text-font-important-dark">
             {% blocktranslate %}Deleting the selected {{ objects_name }} would result in deleting related objects, but your account doesn't have permission to delete the following types of objects:{% endblocktranslate %}
         </p>
 
@@ -46,7 +46,7 @@
         </div>
     {% elif protected %}
         <div class="border border-gray-200 rounded-md shadow-sm dark:border-gray-800">
-            <p class="font-semibold p-4 text-gray-900 dark:text-gray-100">
+            <p class="font-semibold p-4 text-font-important-light dark:text-font-important-dark">
                 {% blocktranslate %}Deleting the selected {{ objects_name }} would require deleting the following protected related objects:{% endblocktranslate %}
             </p>
 
@@ -60,14 +60,14 @@
         </div>
     {% else %}
         <div class="border border-gray-200 rounded-md shadow-sm dark:border-gray-800">
-            <p class="font-semibold p-4 text-gray-900 dark:text-gray-100">
+            <p class="font-semibold p-4 text-font-important-light dark:text-font-important-dark">
                 {% blocktranslate %}Are you sure you want to delete the selected {{ objects_name }}? All of the following objects and their related items will be deleted:{% endblocktranslate %}
             </p>
 
             {% include "admin/includes/object_delete_summary.html" %}
 
             <div class="border-t border-gray-200 p-4 dark:border-gray-800">
-                <h2 class="font-semibold mb-2 text-gray-900 dark:text-gray-100">
+                <h2 class="font-semibold mb-2 text-font-important-light dark:text-font-important-dark">
                     {% translate "Objects" %}
                 </h2>
 
@@ -89,7 +89,7 @@
                     <input type="hidden" name="action" value="delete_selected">
                     <input type="hidden" name="post" value="yes">
 
-                    <a href="#" class="border cancel-link font-medium hidden mb-3 px-3 py-2 rounded-md transition-all w-full hover:bg-gray-50 lg:block lg:mb-0 lg:mr-3 lg:w-auto dark:border-gray-700 dark:text-gray-300 dark:hover:text-gray-200 dark:hover:bg-gray-900">
+                    <a href="#" class="border cancel-link font-medium hidden mb-3 px-3 py-2 rounded-md transition-all w-full hover:bg-gray-50 lg:block lg:mb-0 lg:mr-3 lg:w-auto dark:border-gray-700 dark:text-font-default-dark dark:hover:text-gray-200 dark:hover:bg-gray-900">
                         {% translate "No, take me back" %}
                     </a>
 

unfold/templates/admin/edit_inline/stacked.html

@@ -2,7 +2,7 @@
 
 <div class="js-inline-admin-formset inline-group" id="{{ inline_admin_formset.formset.prefix }}-group" data-inline-type="stacked" data-inline-formset="{{ inline_admin_formset.inline_formset_data }}" {% if inline_admin_formset.opts.tab %}x-show="activeTab == '{{ inline_admin_formset.opts.verbose_name|slugify }}'"{% else %}x-show="activeTab == 'general'"{% endif %}>
     <fieldset class="module {{ inline_admin_formset.classes }}">
-        <h2 class="bg-gray-100 border border-transparent font-semibold mb-6 px-4 py-3 rounded-md text-gray-900 text-sm lg:-mx-4 dark:bg-white/[.02] dark:border dark:border-gray-800 dark:text-gray-200 {% if inline_admin_formset.opts.tab %}hidden{% endif %}">
+        <h2 class="bg-gray-100 border border-transparent font-semibold mb-6 px-4 py-3 rounded-md text-font-important-light text-sm lg:-mx-4 dark:bg-white/[.02] dark:border dark:border-gray-800 dark:text-font-important-dark {% if inline_admin_formset.opts.tab %}hidden{% endif %}">
             {% if inline_admin_formset.formset.max_num == 1 %}
                 {{ inline_admin_formset.opts.verbose_name|capfirst }}
             {% else %}
@@ -29,7 +29,7 @@
                                     {{ inline_admin_formset.opts.verbose_name|capfirst }}:
                                 </span>
 
-                                <span class="inline_label font-semibold text-gray-900 dark:text-gray-200">
+                                <span class="inline_label font-semibold text-font-important-light dark:text-font-important-dark">
                                     {% if inline_admin_form.original and inline_admin_form.model_admin.show_change_link and inline_admin_form.model_admin.has_registered_model %}
                                         <a href="{% url inline_admin_form.model_admin.opts|admin_urlname:'change' inline_admin_form.original.pk|admin_urlquote %}" class="{% if inline_admin_formset.has_change_permission %}inlinechangelink{% else %}inlineviewlink{% endif %} font-medium text-primary-600 dark:text-primary-500">
                                             {{ inline_admin_form.original }}

unfold/templates/admin/edit_inline/tabular.html

@@ -5,7 +5,7 @@
         {{ inline_admin_formset.formset.management_form }}
 
         <fieldset class="module {{ inline_admin_formset.classes }} min-w-0">
-            <h2 class="bg-gray-100 border border-transparent font-semibold mb-6 px-4 py-3 rounded-md text-gray-900 text-sm lg:-mx-4 dark:bg-white/[.02] dark:border dark:border-gray-800 dark:text-gray-200 {% if inline_admin_formset.opts.tab %}hidden{% endif %}">
+            <h2 class="bg-gray-100 border border-transparent font-semibold mb-6 px-4 py-3 rounded-md text-font-important-light text-sm lg:-mx-4 dark:bg-white/[.02] dark:border dark:border-gray-800 dark:text-font-important-dark {% if inline_admin_formset.opts.tab %}hidden{% endif %}">
                 {% if inline_admin_formset.formset.max_num == 1 %}
                     {{ inline_admin_formset.opts.verbose_name|capfirst }}
                 {% else %}
@@ -27,7 +27,7 @@
                                 <tr>
                                     {% for field in inline_admin_formset.fields %}
                                         {% if not field.widget.is_hidden %}
-                                            <th class="column-{{ field.name }}{% if field.required %} required{% endif %} align-middle border-b border-gray-200 font-medium px-3 py-2 text-left text-gray-900 text-sm whitespace-nowrap dark:text-gray-200 dark:border-gray-800">
+                                            <th class="column-{{ field.name }}{% if field.required %} required{% endif %} align-middle border-b border-gray-200 font-semibold px-3 py-2 text-left text-font-important-light text-sm whitespace-nowrap dark:text-font-important-dark dark:border-gray-800">
                                                 <span class="flex flex-row items-center">
                                                     {{ field.label|capfirst }}
 
@@ -40,7 +40,7 @@
                                     {% endfor %}
 
                                     {% if inline_admin_formset.formset.can_delete and inline_admin_formset.has_delete_permission %}
-                                        <th class="align-middle border-b border-gray-200 font-medium px-3 py-2 text-left text-gray-900 text-sm whitespace-nowrap lg:w-px dark:border-gray-800 dark:text-gray-200">
+                                        <th class="align-middle border-b border-gray-200 font-semibold px-3 py-2 text-left text-font-important-light text-sm whitespace-nowrap lg:w-px dark:border-gray-800 dark:text-font-important-dark">
                                             {% translate "Delete?" %}
                                         </th>
                                     {% endif %}

unfold/templates/admin/filter.html

@@ -1,7 +1,7 @@
 {% load i18n unfold %}
 
 <div class="mb-6">
-    <h3 class="font-semibold mb-2 text-gray-900 dark:text-gray-100">
+    <h3 class="font-semibold mb-2 text-font-important-light dark:text-font-important-dark">
         {% blocktranslate with filter_title=title %} By {{ filter_title }} {% endblocktranslate %}
     </h3>
 

unfold/templates/admin/includes/fieldset.html

@@ -2,7 +2,7 @@
 
 <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-gray-100 border border-transparent font-semibold mb-6 px-4 py-3 rounded-md text-gray-700 text-sm lg:-mx-4 dark:bg-white/[.02] dark:border dark:border-gray-800 dark:text-gray-200">
+        <h2 class="bg-gray-100 border border-transparent font-semibold mb-6 px-4 py-3 rounded-md text-font-important-light text-sm lg:-mx-4 dark:bg-white/[.02] dark:border dark:border-gray-800 dark:text-font-important-dark">
             {{ fieldset.name }}
         </h2>
     {% endif %}

unfold/templates/admin/includes/object_delete_summary.html

@@ -1,7 +1,7 @@
 {% load i18n %}
 
 <div class="border-gray-200 border-t p-4 dark:border-gray-800">
-    <h2 class="font-semibold mb-2 text-gray-900 dark:text-gray-100">
+    <h2 class="font-semibold mb-2 text-font-important-light dark:text-font-important-dark">
         {% translate "Summary" %}
     </h2>
 

unfold/templates/admin/login.html

@@ -28,7 +28,7 @@
         <div class="flex flex-grow items-center justify-center mx-auto px-4 relative">
             <div class="w-full sm:w-96">
                 <h1 class="font-semibold mb-10">
-                    <span class="block text-gray-700 dark:text-gray-200">{% trans 'Welcome back to' %}</span>
+                    <span class="block text-font-important-light dark:text-font-important-dark">{% trans 'Welcome back to' %}</span>
                     <span class="block text-primary-600 text-xl dark:text-primary-500">{{ site_title }}</span>
                 </h1>
 
@@ -66,7 +66,7 @@
 
                     {% if password_reset_url %}
                         <div class="password-reset-link">
-                            <a href="{{ password_reset_url }}" class="border font-medium hidden mt-4 px-3 py-2 rounded-md text-center text-sm text-gray-500 transition-all w-full hover:bg-gray-50 lg:block lg:w-auto dark:border-gray-700 dark:text-gray-300 dark:hover:text-gray-200 dark:hover:bg-gray-900">
+                            <a href="{{ password_reset_url }}" class="border font-medium hidden mt-4 px-3 py-2 rounded-md text-center text-sm text-gray-500 transition-all w-full hover:bg-gray-50 lg:block lg:w-auto dark:border-gray-700 dark:text-font-default-dark dark:hover:text-gray-200 dark:hover:bg-gray-900">
                                 {% translate 'Forgotten your password or username?' %}
                             </a>
                         </div>

unfold/templates/admin/search_form.html

@@ -3,7 +3,7 @@
 {% if cl.search_fields %}
     <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-300 placeholder-shown:truncate" type="text" name="{{ search_var }}" value="{{ cl.query }}" id="searchbar" placeholder="{% if cl.search_help_text %}{{ cl.search_help_text }}{% else %}{% trans "Type to search" %}{% endif %}" />
+            <input class="font-medium grow min-w-0 h-9 px-3 text-font-default-light text-sm focus:outline-none dark:bg-gray-900 dark:text-font-default-dark placeholder-shown:truncate" type="text" name="{{ search_var }}" value="{{ cl.query }}" id="searchbar" placeholder="{% if cl.search_help_text %}{{ cl.search_help_text }}{% else %}{% trans "Type to search" %}{% endif %}" />
 
             <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>

unfold/templates/auth/widgets/read_only_password_hash.html

@@ -1,8 +1,8 @@
 <div class="table table-fixed w-full">
-    <div class="readonly bg-gray-50 border font-medium max-w-2xl px-3 py-2 rounded-md shadow-sm text-gray-500 text-sm dark:bg-gray-900 dark:border-gray-700 dark:bg-gray-800 dark:text-gray-300{% if summary|length > 1 %} text-ellipsis overflow-hidden whitespace-nowrap w-full{% endif %}" {% include 'django/forms/widgets/attrs.html' %}>
+    <div class="readonly bg-gray-50 border font-medium max-w-2xl px-3 py-2 rounded-md shadow-sm dark:bg-white/[.02] dark:border-gray-700 {% if summary|length > 1 %} text-ellipsis overflow-hidden whitespace-nowrap w-full{% endif %}" {% include 'django/forms/widgets/attrs.html' %}>
         {% if summary|length > 1 %}
             {% for entry in summary %}
-                <strong class="font-semibold text-gray-900 dark:text-gray-200">{{ entry.label }}</strong>{% if entry.value %}: {{ entry.value }}{% endif %}
+                <strong class="font-semibold text-font-important-light dark:text-font-important-dark">{{ entry.label }}</strong>{% if entry.value %}: {{ entry.value }}{% endif %}
             {% endfor %}
         {% else %}
             {% for entry in summary %}

unfold/templates/registration/logged_out.html

@@ -12,7 +12,7 @@
                     </span>
                 </h1>
 
-                <p class="mb-10 text-gray-500 dark:text-gray-300">
+                <p class="mb-10">
                     {% translate "Thanks for spending some quality time with the web site today." %}
                 </p>
 

unfold/templates/unfold/change_list_filter.html

@@ -5,12 +5,28 @@
 
     <div class="bg-white flex mx-4 my-4 overflow-hidden rounded shadow-sm w-96 dark:bg-gray-800" x-on:click.outside="filterOpen = false">
         <div class="flex-grow h-full overflow-auto relative">
-            <h3 class="border-b flex font-semibold mb-6 px-6 py-4 text-gray-900 text-sm dark:text-gray-100 dark:border-gray-700">
-                {% trans "Filter results" %}
+            <h3 class="border-b flex font-semibold mb-6 px-6 py-4 text-font-important-light text-sm dark:text-font-important-dark dark:border-gray-700">
+                {% trans "Filter" %}
+
+                {% if cl.is_facets_optional %}
+                    <span id="changelist-filter-extra-actions" class="font-normal ml-3 text-primary-600 text-sm dark:text-primary-500">
+                        {% if cl.is_facets_optional %}
+                            {% if cl.add_facets %}
+                                <a href="{{ cl.remove_facet_link }}" class="hidelink">
+                                    {% trans "Hide counts" %}
+                                </a>
+                            {% else %}
+                                <a href="{{ cl.add_facet_link }}" class="viewlink">
+                                    {% trans "Show counts" %}
+                                </a>
+                            {% endif %}
+                        {% endif %}
+                    </span>
+                {% endif %}
 
                 {% if cl.has_active_filters %}
                     <a href="{{ cl.clear_all_filters_qs }}" class="font-normal ml-3 text-sm text-red-600 dark:text-red-500">
-                        {% translate "Clear all filters" %}
+                        {% trans "Clear all filters" %}
                     </a>
                 {% endif %}
 

unfold/templates/unfold/components/button.html

@@ -1,3 +1,3 @@
-<button {% if submit %}type="submit"{% endif%} class="bg-primary-600 border border-transparent font-medium px-3 py-2 rounded-md text-sm text-white">
+<button {% if submit %}type="submit"{% endif%} {% if name %}name="{{ name }}"{% endif %} class="bg-primary-600 border border-transparent font-medium px-3 py-2 rounded-md text-sm text-white">
     {{ children }}
 </button>

unfold/templates/unfold/components/card.html

@@ -1,6 +1,6 @@
 <div class="border flex flex-col flex-grow overflow-hidden p-6 relative rounded-md shadow-sm dark:border-gray-800{% if class %} {{ class }}{% endif %}">
     {% if title %}
-        <h2 class="border-b font-semibold mb-6 -mt-2 -mx-6 pb-4 px-6 text-sm text-gray-700 dark:text-gray-200 dark:border-gray-800">
+        <h2 class="border-b font-semibold mb-6 -mt-2 -mx-6 pb-4 px-6 text-font-important-light dark:text-font-important-dark dark:border-gray-800">
             {{ title }}
         </h2>
     {% endif %}

unfold/templates/unfold/components/navigation.html

@@ -1,7 +1,7 @@
 {% if items %}
     <nav class="bg-gray-100 flex gap-2 mb-8 p-1 rounded text-sm dark:bg-white/[.04]{% if class %} {{ class }}{% endif %}">
         {% for item in items %}
-            <a href="{{ item.link }}" class="flex flex-row font-medium items-center px-2.5 py-1 rounded {% if item.active %} bg-white shadow-sm text-gray-700 hover:bg-white dark:bg-gray-900 dark:hover:bg-gray-900 dark:text-white{% else %} text-gray-400 hover:bg-gray-700/[.04] hover:text-gray-700 dark:hover:bg-white/[.04] dark:hover:text-white{% endif %}">
+            <a href="{{ item.link }}" class="flex flex-row font-medium items-center px-2.5 py-1 rounded {% if item.active %} bg-white shadow-sm text-font-important-light hover:bg-white dark:bg-gray-900 dark:hover:bg-gray-900 dark:text-font-important-dark{% else %}text-font-subtle-light dark:text-font-subtle-dark hover:bg-gray-700/[.04]  dark:hover:bg-white/[.04]{% endif %}">
                 {% if item.icon %}
                     <span class="material-symbols-outlined{% if item.title %} mr-2{% endif %}">{{ item.icon }}</span>
                 {% endif %}

unfold/templates/unfold/components/title.html

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

unfold/templates/unfold/helpers/actions_row.html

@@ -4,7 +4,7 @@
     <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">
         {% 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 }}">
+                <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-font-default-dark group-hover:dark:bg-gray-800 group-hover:dark:text-white" @click="openActionsId{{ action_id }} = !openActionsId{{ action_id }}">
                     more_horiz
                 </span>
 

unfold/templates/unfold/helpers/app_list.html

@@ -6,13 +6,13 @@
             {% if group.items %}
                 {% has_nav_item_active group.items as has_active %}
 
-                <div class="mb-3" {% if group.collapsible %}x-data="{navigationOpen: {% if has_active %}true{% else %}false{% endif %}}"{% endif %}>
+                <div class="hidden mb-3 has-[ol]:has-[li]:block" {% if group.collapsible %}x-data="{navigationOpen: {% if has_active %}true{% else %}false{% endif %}}"{% endif %}>
                     {% if group.separator %}
                         <hr class="border-t border-gray-200 mx-6 my-2 dark:border-gray-800" />
                     {% endif %}
 
                     {% if group.title %}
-                        <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 %}>
+                        <h2 class="font-semibold flex flex-row items-center mb-1 mx-3 py-1.5 px-3 select-none text-font-important-light text-sm dark:text-font-important-dark {% if group.collapsible %}cursor-pointer{% endif %}" {% if group.collapsible %}x-on:click="navigationOpen = !navigationOpen"{% endif %}>
                             {{ group.title }}
 
                             {% if group.collapsible %}
@@ -27,7 +27,7 @@
                         {% for item in group.items %}
                             {% if item.has_permission %}
                                 <li>
-                                    <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 %}">
+                                    <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{% endif %}">
                                         {% if item.icon %}
                                             <span class="material-symbols-outlined md-18 mr-3 w-4.5">
                                                 {{ item.icon }}
@@ -52,14 +52,14 @@
                             {% endif %}
                         {% endfor %}
                     </ol>
+                </div>
             {% endif %}
-            </div>
         {% endfor %}
     </div>
 
     {% 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-sm 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 dark:text-font-default-dark" 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">
-                            <h2 class="mb-4 font-semibold text-gray-900 truncate dark:text-gray-100">
+                            <h2 class="mb-4 font-semibold text-font-important-light truncate dark:text-font-important-dark">
                                 {{ app.name }}
                             </h2>
 
                             <ul>
                                 {% for model in app.models %}
                                     <li class="block mb-4 last:mb-0">
-                                        <a href="{{ model.admin_url }}" class="block truncate hover:text-gray-700 dark:hover:text-gray-200">
+                                        <a href="{{ model.admin_url }}" class="block truncate">
                                             {{ model.name }}
                                         </a>
                                     </li>

unfold/templates/unfold/helpers/fieldsets_tabs.html

@@ -3,12 +3,12 @@
 {% 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-500 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-font-default-light text-sm lg:-mx-4 dark:bg-white/[.02] dark:border dark:border-gray-800 dark:text-font-default-dark">
                 {% for fieldset in tabs %}
                     <li>
                         <a class="cursor-pointer font-semibold hover:text-gray-700 dark:hover:text-white"
                            x-on:click="openTab = '{{ forloop.counter0 }}-{{ fieldset.name|slugify }}'"
-                           x-bind:class="openTab == '{{ forloop.counter0 }}-{{ fieldset.name|slugify }}'{% if forloop.first %} || openTab == null{% endif %} ? 'text-gray-700 dark:text-white' : ''">
+                           x-bind:class="openTab == '{{ forloop.counter0 }}-{{ fieldset.name|slugify }}'{% if forloop.first %} || openTab == null{% endif %} ? 'text-font-important-light dark:text-font-important-dark' : ''">
                             {{ fieldset.name }}
                         </a>
                     </li>

unfold/templates/unfold/helpers/form_label.html

@@ -1,4 +1,4 @@
-<label for="{{ field.id_for_label }}" class="block text-gray-900 text-sm dark:text-gray-200{% if field.field.widget.input_type == "checkbox" %}{% else %} font-medium mb-2{% endif %}">
+<label for="{{ field.id_for_label }}" class="block text-font-important-light dark:text-font-important-dark{% if field.field.widget.input_type == "checkbox" %}{% else %} font-medium mb-2{% endif %}">
     {{ field.label }}
 
     {% if field.field.required %}

unfold/templates/unfold/helpers/messages.html

@@ -1,7 +1,7 @@
 {% if messages %}
     <ul>
         {% for message in messages %}
-            <li class="mb-3 px-3 py-3 rounded-md text-sm last:mb-8
+            <li class="{{ message.tags }} 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' %}

unfold/templates/unfold/helpers/navigation.html

@@ -4,7 +4,7 @@
     <nav id="nav-sidebar" class="bg-gray-50 border-r border-gray-200 bottom-0 fixed max-h-screen top-0 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-900 tracking-tight dark:text-gray-100 xl:text-base">
+                <div class="flex font-semibold h-10 items-center px-6 text-font-important-light tracking-tight dark:text-font-important-dark xl:text-base">
                     {% if site_logo %}
                         {% include "unfold/helpers/site_logo.html" %}
                     {% elif branding %}

unfold/templates/unfold/helpers/search.html

@@ -14,7 +14,7 @@
                    hx-trigger="keyup changed delay:500ms, search"
                    hx-target="#search-results"
                    hx-indicator=".htmx-indicator"
-                   class="flex-grow font-medium overflow-hidden pl-2 pr-3 py-2 text-gray-500 text-sm focus:outline-none dark:bg-gray-900 dark:text-gray-300"
+                   class="flex-grow font-medium overflow-hidden pl-2 pr-3 py-2 text-font-default-light text-sm focus:outline-none dark:bg-gray-900 dark:text-font-default-dark"
                    placeholder="{% translate 'Search apps and models...' %}" aria-label="{% translate 'Filter navigation items' %}" />
             <div class="absolute opacity-0 htmx-indicator mt-0.5 right-2 top-2">
                 <span class="animate-spin material-symbols-outlined md-18 text-gray-300">sync</span>

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-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 %}>
+    <a href="{{ link }}" class="block px-4 py-2 text-left whitespace-nowrap"{% if blank %} target="_blank"{% endif %} {% include "unfold/helpers/attrs.html" with attrs=action.attrs %}>
         {{ title }}
     </a>
 </li>

unfold/templates/unfold/helpers/welcomemsg.html

@@ -1,9 +1,9 @@
 {% load i18n %}
 
-<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">
+<div class="flex-grow font-semibold min-w-0 mr-3">
+    <h1 class="overflow-hidden text-ellipsis text-sm whitespace-nowrap xl:text-base text-font-important-light dark:text-font-important-dark">
         {% if content_title %}
-            <span class="font-medium text-gray-900 tracking-tight dark:text-gray-100">
+            <span class="tracking-tight">
                 {{ pretitle }}
 
                 {{ content_title }}

unfold/templates/unfold/layouts/skeleton.html

@@ -68,7 +68,7 @@
         {% endif %}
     </head>
 
-    <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 %} }" x-init="activeTab = window.location.hash?.replace('#', '') || 'general'">
+    <body class="antialiased bg-white font-sans text-font-default-light text-sm dark:bg-gray-900 dark:text-font-default-dark {% 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 %} }" x-init="activeTab = window.location.hash?.replace('#', '') || 'general'">
         {% 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

@@ -10,7 +10,7 @@
 
 <div class="border flex items-center overflow-hidden rounded-md shadow-sm text-sm max-w-2xl dark:border-gray-700">
     {% if widget.is_initial and not widget.required %}
-        <div class="bg-gray-50 border-r flex flex-none items-center self-stretch px-3 dark:bg-white/[.02] dark:border-gray-700 dark:text-gray-300">
+        <div class="bg-gray-50 border-r flex flex-none items-center self-stretch px-3 dark:bg-white/[.02] dark:border-gray-700 dark:text-font-default-dark">
             <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 }}" />
 
@@ -21,7 +21,7 @@
         </div>
     {% 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 %}">
+    <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">
 
     <div class="flex flex-none items-center leading-none self-stretch">
         <div class="hidden">

unfold/templates/unfold/widgets/clearable_file_input_small.html

@@ -14,7 +14,7 @@
             </div>
         {% 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 %}">
+        <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">
 
         <div class="flex flex-none items-center leading-none self-stretch">
             <div class="hidden">

unfold/templates/unfold/widgets/url.html

@@ -0,0 +1,7 @@
+<div class="flex flex-row gap-2 items-center">
+  {% include "django/forms/widgets/input.html" %}
+
+  {% if url_valid %}
+    {{ current_label }} <a href="{{ widget.href }}" class="text-primary-600 dark:text-primary-500">{{ widget.value }}</a>
+  {% endif %}
+</div>

unfold/templatetags/unfold_list.py

@@ -50,17 +50,13 @@ ROW_CLASSES = [
     "px-3",
     "py-2",
     "text-left",
-    "text-sm",
     "before:flex",
     "before:capitalize",
     "before:content-[attr(data-label)]",
     "before:items-center",
     "before:font-semibold",
     "before:mr-auto",
-    "before:text-gray-900",
     "first:border-t-0",
-    "dark:text-gray-300",
-    "dark:before:text-gray-100",
     "lg:before:hidden",
     "lg:first:border-t",
     "lg:py-3",
@@ -76,18 +72,15 @@ CHECKBOX_CLASSES = [
     "px-3",
     "py-2",
     "text-left",
-    "text-sm",
     "before:block",
     "before:capitalize",
     "before:content-[attr(data-label)]",
     "before:font-semibold",
     "before:mr-auto",
-    "before:text-gray-900",
     "lg:before:hidden",
     "lg:border-t",
     "lg:border-gray-200",
     "lg:table-cell",
-    "dark:before:text-gray-100",
     "dark:lg:border-gray-800",
 ]
 

unfold/widgets.py

@@ -13,6 +13,7 @@ from django.contrib.admin.widgets import (
     AdminTextareaWidget,
     AdminTextInputWidget,
     AdminTimeWidget,
+    AdminURLFieldWidget,
     AdminUUIDInputWidget,
     ForeignKeyRawIdWidget,
     RelatedFieldWidgetWrapper,
@@ -20,6 +21,7 @@ from django.contrib.admin.widgets import (
 from django.db.models.fields.reverse_related import ForeignObjectRel
 from django.forms import (
     CheckboxInput,
+    CheckboxSelectMultiple,
     MultiWidget,
     NullBooleanSelect,
     NumberInput,
@@ -35,16 +37,17 @@ LABEL_CLASSES = [
     "block",
     "font-medium",
     "mb-2",
-    "text-gray-900",
+    "text-font-important-light",
     "text-sm",
-    "dark:text-gray-100",
+    "dark:text-font-important-dark",
 ]
 
 CHECKBOX_LABEL_CLASSES = [
+    "font-medium",
     "ml-2",
     "text-sm",
-    "text-gray-900",
-    "dark:text-gray-100",
+    "text-font-important-light",
+    "dark:text-font-important-dark",
 ]
 
 BASE_CLASSES = [
@@ -54,7 +57,7 @@ BASE_CLASSES = [
     "min-w-20",
     "rounded-md",
     "shadow-sm",
-    "text-gray-500",
+    "text-font-default-light",
     "text-sm",
     "focus:ring",
     "focus:ring-primary-300",
@@ -64,7 +67,7 @@ BASE_CLASSES = [
     "group-[.errors]:focus:ring-red-200",
     "dark:bg-gray-900",
     "dark:border-gray-700",
-    "dark:text-gray-300",
+    "dark:text-font-default-dark",
     "dark:focus:border-primary-600",
     "dark:focus:ring-primary-700",
     "dark:focus:ring-opacity-50",
@@ -253,6 +256,13 @@ class UnfoldAdminTextInputWidget(AdminTextInputWidget):
         super().__init__(attrs={"class": " ".join(INPUT_CLASSES), **(attrs or {})})
 
 
+class UnfoldAdminURLInputWidget(AdminURLFieldWidget):
+    template_name = "unfold/widgets/url.html"
+
+    def __init__(self, attrs: Optional[Dict[str, Any]] = None) -> None:
+        super().__init__(attrs={"class": " ".join(INPUT_CLASSES), **(attrs or {})})
+
+
 class UnfoldAdminColorInputWidget(AdminTextInputWidget):
     def __init__(self, attrs: Optional[Dict[str, Any]] = None) -> None:
         super().__init__(
@@ -513,6 +523,16 @@ class UnfoldAdminRadioSelectWidget(AdminRadioSelect):
         return context
 
 
+class UnfoldAdminCheckboxSelectMultiple(CheckboxSelectMultiple):
+    template_name = "unfold/widgets/radio.html"
+    option_template_name = "unfold/widgets/radio_option.html"
+
+    def __init__(self, *args, **kwargs):
+        super().__init__(*args, **kwargs)
+
+        self.attrs = {"class": " ".join(CHECKBOX_CLASSES)}
+
+
 try:
     from djmoney.forms.widgets import MoneyWidget
     from djmoney.settings import CURRENCY_CHOICES