django-unfold 0.28.1__py3-none-any.whl → 0.29.1__py3-none-any.whl

unfold/templates/admin/edit_inline/tabular.html

@@ -59,22 +59,28 @@
 
                                     {% if inline_admin_form.original or inline_admin_form.show_url %}
                                         <tr>
-                                            <td class="original {% if inline_admin_form.original or inline_admin_form.show_url %}{% if inline_admin_form.original and inline_admin_form.model_admin.show_change_link and inline_admin_form.model_admin.has_registered_model and inline_admin_formset.has_change_permission %}bg-gray-50 border-b  border-gray-200 dark:bg-white/[.02] dark:border-gray-800{% endif %}{% endif %}" colspan="10">
+                                            <td class="original {% if inline_admin_form.original or inline_admin_form.show_url %}border-b border-gray-200 dark:border-gray-800 bg-gray-50 dark:bg-white/[.02]{% endif %}" colspan="10">
                                                 {% if inline_admin_form.original or inline_admin_form.show_url %}
-                                                    <p class="align-middle flex font-normal items-center leading-none px-3 text-gray-500 text-left text-sm whitespace-nowrap">
+                                                    <p class="bg-gray-50 flex font-medium items-center px-3 py-2 text-gray-400 text-sm dark:bg-white/[.02] ">
                                                         {% if inline_admin_form.original %}
+                                                            <span class="font-semibold text-gray-900 dark:text-gray-200">
+                                                                {{ inline_admin_form.original }}
+                                                            </span>
+
                                                             {% if 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 py-1.5{% else %}inlineviewlink mt-3{% endif %} font-medium text-primary-600 underline text-xs">
-                                                                    {{ inline_admin_form.original }}
+                                                                <a href="{% url inline_admin_form.model_admin.opts|admin_urlname:'change' inline_admin_form.original.pk|admin_urlquote %}" class="{{ inline_admin_formset.has_change_permission|yesno:'inlinechangelink,inlineviewlink' }} font-medium ml-2 text-primary-600 underline dark:text-primary-500">
+                                                                    {% if inline_admin_formset.has_change_permission %}
+                                                                        {% translate "Change" %}
+                                                                    {% else %}
+                                                                        {% translate "View" %}
+                                                                    {% endif %}
                                                                 </a>
                                                             {% endif %}
-                                                        {% else %}
-                                                            {{ inline_admin_form.original }}
                                                         {% endif %}
 
                                                         {% if inline_admin_form.show_url %}
-                                                            <a href="{{ inline_admin_form.absolute_url }}" class="ml-1 mt-3">
-                                                                <span class="material-symbols-outlined h-4 md-16 text-primary-600">launch</span>
+                                                            <a href="{{ inline_admin_form.absolute_url }}" class="font-medium ml-2 text-primary-600 underline dark:text-primary-500">
+                                                                {% translate "View on site" %}
                                                             </a>
                                                         {% endif %}
                                                     </p>
@@ -110,7 +116,7 @@
                                                     {% 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 {% if field.field.is_hidden %} !hidden{% endif %}"{% endif %} data-label="{{ field.field.label }}">
+                                                                <td{% if field.field.name %} class="field-{{ field.field.name }} group field-tabular {% 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:pr-4 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 %}
                                                                         {% include "unfold/helpers/field_readonly_value.html" with tabular=1 %}
                                                                     {% else %}
@@ -132,7 +138,7 @@
                                             {% endfor %}
 
                                             {% if inline_admin_formset.formset.can_delete and inline_admin_formset.has_delete_permission %}
-                                                <td class="delete {% if inline_admin_form.original %}p-3 lg:py-3{% else %}py-3{% endif %} text-left font-normal px-3 text-sm text-red-600 border-b 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-sm lg:align-top lg:table-cell lg:underline lg:w-px dark:border-gray-800" data-label="{% trans "Remove" %}">
+                                                <td class="delete {% if inline_admin_form.original %}p-3 lg:py-3{% else %}py-3{% endif %} text-left text-red-600 border-b border-gray-200 flex items-center before:capitalize before:content-[attr(data-label)] before:mr-auto before:text-gray-500 before:pr-4 lg:before:hidden font-normal px-3 text-sm lg:align-top lg:table-cell lg:underline lg:w-px dark:border-gray-800" data-label="{% trans "Remove" %}">
                                                     {% if inline_admin_form.original %}
                                                         <div class="flex flex-row lg:mt-3">
                                                             <div class="ml-auto">

unfold/templates/admin/filter.html

@@ -14,7 +14,7 @@
     {% if spec|class_name == "BooleanFieldListFilter" %}
         <ul class="border-l-4 border-gray-200 flex pl-4 py-2 text-gray-500 text-sm dark:border-gray-700">
             {% for choice in choices %}
-                <li class="{% if choice.selected %}font-medium text-primary-500 underline dark{% else %}text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-200{% endif %} pr-4">
+                <li class="{% if choice.selected %}font-medium text-primary-600 dark:text-primary-500 underline dark{% else %}text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-200{% endif %} pr-4">
                     <a href="{{ choice.query_string|iriencode }}" title="{{ choice.display }}">
                         {{ choice.display }}
                     </a>
@@ -24,7 +24,7 @@
     {% else %}
         <ul class="border-l-4 border-gray-200 flex flex-col pl-4 py-4 text-gray-500 text-sm dark:border-gray-700">
             {% for choice in choices %}
-                <li class="mb-4 last:mb-0 {% if choice.selected %}font-medium text-primary-500 underline {% else %}text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-200{% endif %}">
+                <li class="mb-4 last:mb-0 {% if choice.selected %}font-medium text-primary-600 dark:text-primary-500 underline {% else %}text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-200{% endif %}">
                     <a href="{{ choice.query_string|iriencode }}" title="{{ choice.display }}">
                         {{ choice.display }}
                     </a>

unfold/templates/admin/login.html

@@ -29,7 +29,7 @@
             <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-primary-600 text-xl">{{ site_title }}</span>
+                    <span class="block text-primary-600 text-xl dark:text-primary-500">{{ site_title }}</span>
                 </h1>
 
                 {% include "unfold/helpers/messages/errornote.html" with errors=form.errors %}
@@ -78,7 +78,7 @@
 
             <div class="absolute flex flex-row items-center justify-between left-0 m-4 right-0 top-0">
                 {% if site_url %}
-                    <a href="{{ site_url }}" class="flex font-medium items-center text-sm text-primary-600">
+                    <a href="{{ site_url }}" class="flex font-medium items-center text-sm text-primary-600 dark:text-primary-500">
                         <span class="material-symbols-outlined mr-2">arrow_back</span> {% trans 'Return to site' %}
                     </a>
                 {% endif %}

unfold/templates/admin/nav_sidebar.html

@@ -4,7 +4,7 @@
     <div @click="sidebarDesktopOpen = !sidebarDesktopOpen"
          hx-get="{% url "admin:toggle_sidebar" %}"
          hx-swap="none"
-         class="block bg-white border cursor-pointer fixed flex h-6 hidden items-center justify-center rounded-full text-gray-500 top-5 -translate-x-1/2 w-6 z-50 xl:flex dark:bg-gray-800 dark:border-gray-700 dark:text-gray-200"
+         class="bg-white border cursor-pointer fixed h-6 hidden items-center justify-center rounded-full text-gray-500 top-5 -translate-x-1/2 w-6 z-50 xl:flex dark:bg-gray-800 dark:border-gray-700 dark:text-gray-200"
          :class="{'ml-6 rotate-180': !sidebarDesktopOpen, 'ml-72': sidebarDesktopOpen}">
         <span class="material-symbols-outlined md-16">
             first_page
@@ -12,7 +12,7 @@
     </div>
 
     <div @click="sidebarMobileOpen = !sidebarMobileOpen"
-         class="fixed bottom-0 bg-gray-700 flex cursor-pointer flex items-center left-0 mb-2 ml-2 justify-center px-2 py-1 rounded-full shadow-sm text-xs text-white uppercase z-50 xl:hidden"
+         class="fixed bottom-0 bg-gray-700 cursor-pointer flex items-center left-0 mb-2 ml-2 justify-center px-2 py-1 rounded-full shadow-sm text-xs text-white uppercase z-50 xl:hidden"
         :class="{'ml-72 -translate-x-1/2': sidebarMobileOpen}">
         {% trans "Menu" %}
     </div>

unfold/templates/unfold/components/button.html

@@ -0,0 +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">
+    {{ children }}
+</button>

unfold/templates/unfold/helpers/account_links.html

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

unfold/templates/unfold/helpers/field_readonly_value.html

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

unfold/templates/unfold/helpers/fieldset_row.html

@@ -6,27 +6,53 @@
     {% for field in line %}
         <div class="flex group {% if adminform.model_admin.compressed_fields %} field-row{% endif %}{% if not line.fields|length == 1 and not adminform.model_admin.compressed_fields %} lg:max-w-xs flex-grow{% endif %}{% if field.errors %} errors {% endif %}{% if not forloop.parentloop.last %} {% if adminform.model_admin.compressed_fields %}mb-3{% else %}mb-6{% endif %}{% else %} pb-3{% endif %} {% if adminform.model_admin.compressed_fields %}flex-col lg:flex-row lg:gap-2 {% else %}flex-col{% endif %}">
             {% if field.is_checkbox %}
-                <div class="flex flex-row">
-                    {{ field.field }}
-
-                    <div class="flex flex-col">
-                        {{ field.label_tag }}
-
-                        {% if field.field.help_text %}
-                            <div class="ml-2 -mt-1">
-                                {% include "unfold/helpers/help_text.html" with help_text=field.field.help_text %}
-                            </div>
-                        {% endif %}
-
-                        {% if field.errors %}
-                            <span class="mt-1 text-red-600 text-sm dark:text-red-500">
-                                {{ field.errors }}
-                            </span>
-                        {% endif %}
+                {% if adminform.model_admin.compressed_fields %}
+                    <div class="flex flex-row gap-4">
+                        <div class="font-medium h-5 flex items-start -ml-2 min-w-32 w-32 lg:min-w-48 lg:w-48">
+                            {{ field.label_tag }}
+                        </div>
+
+                        <div class="flex-grow">
+                            <div class="flex flex-col lg:flex-row">
+                                {{ field.field }}
+
+                                {% if field.field.help_text %}
+                                    <div class="lg:-mt-2 lg:ml-2">
+                                        {% include "unfold/helpers/help_text.html" with help_text=field.field.help_text %}
+                                    </div>
+                                {% endif %}
+                                </div>
+
+                            {% if field.errors %}
+                                <span class="mt-1 text-red-600 text-sm dark:text-red-500">
+                                    {{ field.errors }}
+                                </span>
+                            {% endif %}
+                        </div>
                     </div>
-                </div>
+                {% else %}
+                    <div class="flex flex-row">
+                        {{ field.field }}
+
+                        <div class="flex flex-col">
+                            {{ field.label_tag }}
+
+                            {% if field.field.help_text %}
+                                <div class="ml-2 -mt-1">
+                                    {% include "unfold/helpers/help_text.html" with help_text=field.field.help_text %}
+                                </div>
+                            {% endif %}
+
+                            {% if field.errors %}
+                                <span class="mt-1 text-red-600 text-sm dark:text-red-500">
+                                    {{ field.errors }}
+                                </span>
+                            {% endif %}
+                        </div>
+                    </div>
+                {% endif %}
             {% else %}
-                <div class="{% if adminform.model_admin.compressed_fields %} min-w-48 mt-2 w-48{% endif %}">
+                <div class="{% if adminform.model_admin.compressed_fields %} min-w-48 lg:mt-2 w-48{% endif %}">
                     {{ field.label_tag }}
                 </div>
 

unfold/templates/unfold/helpers/navigation.html

@@ -1,23 +1,25 @@
 {% load i18n %}
 
 <div class="relative min-w-sidebar transition-width w-sidebar z-30">
-    <nav id="nav-sidebar" class="bg-gray-50 border-r border-gray-200 flex flex-col fixed max-h-screen min-h-screen min-w-sidebar transition-width w-sidebar dark:bg-gray-950/20 dark:border-gray-800">
-        <div class="border-b border-gray-200 mb-5 py-3 dark:border-gray-800">
-            <div class="flex font-medium h-10 items-center px-6 text-gray-700 dark:text-gray-200">
-                {% if site_logo %}
-                    {% include "unfold/helpers/site_logo.html" %}
-                {% elif branding %}
-                    {% include "unfold/helpers/site_icon.html" %}
-                {% endif %}
+    <nav id="nav-sidebar" class="bg-gray-50 border-r border-gray-200 fixed max-h-screen  transition-width w-sidebar dark:bg-gray-900 dark:border-gray-800">
+        <div class="flex flex-col min-h-screen min-w-sidebar dark:bg-gray-950/20">
+            <div class="border-b border-gray-200 mb-5 py-3 dark:border-gray-800">
+                <div class="flex font-medium h-10 items-center px-6 text-gray-700 dark:text-gray-200">
+                    {% if site_logo %}
+                        {% include "unfold/helpers/site_logo.html" %}
+                    {% elif branding %}
+                        {% include "unfold/helpers/site_icon.html" %}
+                    {% endif %}
+                </div>
             </div>
-        </div>
 
-        {% include "unfold/helpers/search.html" %}
+            {% include "unfold/helpers/search.html" %}
 
-        {% if sidebar_navigation|length > 0 %}
-            {% include "unfold/helpers/app_list.html" with app_list=available_apps %}
-        {% else %}
-            {% include "admin/app_list.html" with app_list=available_apps show_changelinks=False %}
-        {% endif %}
+            {% if sidebar_navigation|length > 0 %}
+                {% include "unfold/helpers/app_list.html" with app_list=available_apps %}
+            {% else %}
+                {% include "admin/app_list.html" with app_list=available_apps show_changelinks=False %}
+            {% endif %}
+        </div>
     </nav>
 </div>

unfold/templates/unfold/helpers/tab_action.html

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

unfold/templates/unfold/helpers/tab_list.html

@@ -1,5 +1,5 @@
 {% if not is_popup %}
-    {% if tab_list or actions_list or actions_items or nav_global %}
+    {% if tab_list or actions_list or actions_detail or actions_items or nav_global %}
         <div class="flex items-start flex-col mb-4 text-gray-500 text-sm w-full md:border-b dark:md:border-gray-800 md:border-l-0 md:flex-row md:items-center md:justify-end dark:text-gray-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">
@@ -15,12 +15,16 @@
                 </ul>
             {% endif %}
 
-            {% if actions_list or actions_items or nav_global %}
+            {% if actions_list or actions_detail or actions_items or nav_global %}
                 <ul class="border flex flex-col mb-4 mt-2 rounded-md shadow-sm md:flex-row md:mb-2 md:mt-0 dark:border-gray-800 max-md:w-full">
                     {% for action in actions_list %}
                         {% include "unfold/helpers/tab_action.html" with title=action.title link=action.path %}
                     {% endfor %}
 
+                    {% for action in actions_detail %}
+                        {% include "unfold/helpers/tab_action.html" with title=action.title link=action.path %}
+                    {% endfor %}
+
                     {% if actions_items %}
                         {{ actions_items }}
                     {% endif %}

unfold/templates/unfold/helpers/theme_switch.html

@@ -7,7 +7,7 @@
         </span>
     </a>
 
-    <nav class="absolute bg-white border flex flex-col leading-none overflow-hidden py-1 -right-2 rounded shadow-lg text-sm text-gray-500 top-7 w-40 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400" x-cloak x-show="openTheme" @click.outside="openTheme = false">
+    <nav class="absolute bg-white border flex flex-col leading-none overflow-hidden py-1 -right-2 rounded shadow-lg text-sm text-gray-500 top-7 w-40 z-50 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400" x-cloak x-show="openTheme" @click.outside="openTheme = false">
         <a class="cursor-pointer flex flex-row leading-none mx-1 px-3 py-1.5 rounded hover:bg-gray-100 hover:text-gray-700 dark:hover:bg-gray-700 dark:hover:text-gray-200"
            x-on:click="adminTheme = 'dark'"
            x-bind:class="adminTheme == 'dark' && 'text-primary-600 dark:text-primary-500 dark:hover:!text-primary-500 hover:!text-primary-600'">

unfold/templates/unfold/widgets/foreign_key_raw_id.html

@@ -1,4 +1,4 @@
-<div class="flex flex-row">
+<div class="flex flex-row flex-grow">
     {% include 'django/forms/widgets/input.html' %}
 
     {% if related_url %}

unfold/templates/unfold/widgets/split_datetime.html

@@ -1,23 +1,23 @@
-<div class="datetime flex flex-col gap-2 max-w-2xl lg:flex-row group-[.field-row]:flex-row group-[.field-row]:items-center">
-    <div class="basis-1/2 flex flex-col flex-wrap mb-4 lg:mb-0 group-[.field-row]:flex-row group-[.field-row]:gap-2">
-        <div class="font-medium mb-2 text-gray-500 text-sm dark:text-gray-400 group-[.field-row]:mb-0 group-[.field-row]:flex group-[.field-row]:items-center">
+<div class="datetime flex flex-col gap-2 max-w-2xl lg:flex-row lg:group-[.field-row]:flex-row lg:group-[.field-row]:items-center lg:group-[.field-tabular]:flex-row lg:group-[.field-tabular]:items-center">
+    <div class="basis-1/2 flex flex-col lg:group-[.field-row]:flex-row group-[.field-row]:gap-2 lg:group-[.field-tabular]:flex-row group-[.field-tabular]:gap-2">
+        <div class="font-medium mb-2 text-gray-500 text-sm dark:text-gray-400 group-[.field-row]:mb-0 group-[.field-row]:flex group-[.field-row]:items-center group-[.field-tabular]:mb-0 group-[.field-tabular]:flex group-[.field-tabular]:items-center">
             {{ date_label }}
         </div>
 
         {% with widget=widget.subwidgets.0 %}
-            <div class="flex flex-col relative group-[.field-row]:flex-grow">
+            <div class="flex flex-col min-w-52 relative group-[.field-row]:flex-grow group-[.field-tabular]:flex-grow">
                 {% include widget.template_name %}
             </div>
         {% endwith %}
     </div>
 
-    <div class="basis-1/2 flex flex-col flex-wrap lg:ml-auto mt-3 md:mt-0 group-[.field-row]:flex-row group-[.field-row]:gap-2">
-        <div class="font-medium mb-2 text-gray-500 text-sm dark:text-gray-400 group-[.field-row]:mb-0 group-[.field-row]:flex group-[.field-row]:items-center">
+    <div class="basis-1/2 flex flex-col lg:ml-auto md:mt-0 lg:group-[.field-row]:flex-row group-[.field-row]:gap-2 lg:group-[.field-tabular]:flex-row group-[.field-tabular]:gap-2">
+        <div class="font-medium mb-2 text-gray-500 text-sm dark:text-gray-400 group-[.field-row]:mb-0 group-[.field-row]:flex group-[.field-row]:items-center group-[.field-tabular]:mb-0 group-[.field-tabular]:flex group-[.field-tabular]:items-center">
             {{ time_label }}
         </div>
 
         {% with widget=widget.subwidgets.1 %}
-            <div class="flex flex-col relative group-[.field-row]:flex-grow">
+            <div class="flex flex-col min-w-52 relative group-[.field-row]:flex-grow group-[.field-tabular]:flex-grow">
                 {% include widget.template_name %}
             </div>
         {% endwith %}

unfold/templatetags/unfold.py

@@ -26,6 +26,7 @@ def tab_list(context, opts) -> str:
         context={
             "tab_list": tabs,
             "nav_global": context.get("nav_global"),
+            "actions_detail": context.get("actions_detail"),
             "actions_list": context.get("actions_list"),
             "actions_items": context.get("actions_items"),
             "is_popup": context.get("is_popup"),

unfold/widgets.py

@@ -49,6 +49,7 @@ BASE_CLASSES = [
     "border",
     "bg-white",
     "font-medium",
+    "min-w-20",
     "rounded-md",
     "shadow-sm",
     "text-gray-500",
@@ -78,6 +79,8 @@ BASE_INPUT_CLASSES = [
 
 INPUT_CLASSES = [*BASE_INPUT_CLASSES, "max-w-2xl"]
 
+DATETIME_CLASSES = [*BASE_INPUT_CLASSES, "min-w-52"]
+
 COLOR_CLASSES = [*BASE_CLASSES, "h-9.5", "px-2", "py-2", "w-32"]
 
 INPUT_CLASSES_READONLY = [*BASE_INPUT_CLASSES, "bg-gray-50"]
@@ -227,6 +230,7 @@ SWITCH_CLASSES = [
     "rounded-full",
     "transition-all",
     "w-8",
+    "min-w-8",
     "after:absolute",
     "after:bg-white",
     "after:content-['']",
@@ -321,7 +325,7 @@ class UnfoldAdminDateWidget(AdminDateWidget):
         self, attrs: Optional[Dict[str, Any]] = None, format: Optional[str] = None
     ) -> None:
         attrs = {
-            "class": "vDateField " + " ".join(INPUT_CLASSES),
+            "class": "vDateField " + " ".join(DATETIME_CLASSES),
             "size": "10",
             **(attrs or {}),
         }
@@ -335,7 +339,7 @@ class UnfoldAdminSingleDateWidget(AdminDateWidget):
         self, attrs: Optional[Dict[str, Any]] = None, format: Optional[str] = None
     ) -> None:
         attrs = {
-            "class": "vDateField " + " ".join(INPUT_CLASSES),
+            "class": "vDateField " + " ".join(DATETIME_CLASSES),
             "size": "10",
             **(attrs or {}),
         }
@@ -347,7 +351,7 @@ class UnfoldAdminTimeWidget(AdminTimeWidget):
         self, attrs: Optional[Dict[str, Any]] = None, format: Optional[str] = None
     ) -> None:
         attrs = {
-            "class": "vTimeField " + " ".join(INPUT_CLASSES),
+            "class": "vTimeField " + " ".join(DATETIME_CLASSES),
             "size": "8",
             **(attrs or {}),
         }
@@ -361,7 +365,7 @@ class UnfoldAdminSingleTimeWidget(AdminTimeWidget):
         self, attrs: Optional[Dict[str, Any]] = None, format: Optional[str] = None
     ) -> None:
         attrs = {
-            "class": "vTimeField " + " ".join(INPUT_CLASSES),
+            "class": "vTimeField " + " ".join(DATETIME_CLASSES),
             "size": "8",
             **(attrs or {}),
         }