From 20cc5d1e2e33987ddd63fce61a4aca68af66e230 Mon Sep 17 00:00:00 2001
From: Pete Matsyburka <pete@docuseal.com>
Date: Fri, 18 Sep 2026 16:25:51 +0300
Subject: [PATCH] adjust mobile dropdown

---
 .../_applied_filters.html.erb                 | 12 +++++------
 .../_filter_button.html.erb                   | 20 +++++++++----------
 app/views/templates/_template.html.erb        | 16 +++++++--------
 3 files changed, 24 insertions(+), 24 deletions(-)

diff --git a/app/views/submissions_filters/_applied_filters.html.erb b/app/views/submissions_filters/_applied_filters.html.erb
index 36037dc01..480a86517 100644
--- a/app/views/submissions_filters/_applied_filters.html.erb
+++ b/app/views/submissions_filters/_applied_filters.html.erb
@@ -113,8 +113,8 @@
     </label>
     <ul tabindex="0" class="<%= turbo_native_app? ? 'hidden' : 'z-10 dropdown-content p-2 mt-2 shadow menu text-base bg-base-100 rounded-box' %>" style="min-width: 180px;">
       <li>
-        <native-menu-action data-icon="list" data-label="<%= t('all') %>" data-selected="<%= current_status == 'all' %>" class="grid-cols-1 <%= 'bg-base-200' if current_status == 'all' %>">
-          <%= link_to url_for(params: request.query_parameters.except('status')), class: 'flex items-center gap-2', aria: { label: t('all') } do %>
+        <native-menu-action data-icon="list" data-label="<%= t('all') %>" data-selected="<%= current_status == 'all' %>" class="grid-cols-1 p-0 <%= 'bg-base-200' if current_status == 'all' %>">
+          <%= link_to url_for(params: request.query_parameters.except('status')), class: 'flex items-center gap-2 px-4 py-2', aria: { label: t('all') } do %>
             <%= svg_icon('list', class: 'w-5 h-5 shrink-0') %>
             <span><%= t('all') %></span>
             <% if local_assigns[:all_count] %>
@@ -126,8 +126,8 @@
         </native-menu-action>
       </li>
       <li>
-        <native-menu-action data-icon="clock" data-label="<%= t('pending') %>" data-selected="<%= current_status == 'pending' %>" class="grid-cols-1 <%= 'bg-base-200' if current_status == 'pending' %>">
-          <%= link_to url_for(params: request.query_parameters.merge('status' => 'pending')), class: 'flex items-center gap-2', aria: { label: t('pending') } do %>
+        <native-menu-action data-icon="clock" data-label="<%= t('pending') %>" data-selected="<%= current_status == 'pending' %>" class="grid-cols-1 p-0 <%= 'bg-base-200' if current_status == 'pending' %>">
+          <%= link_to url_for(params: request.query_parameters.merge('status' => 'pending')), class: 'flex items-center gap-2 px-4 py-2', aria: { label: t('pending') } do %>
             <%= svg_icon('clock', class: 'w-5 h-5 shrink-0') %>
             <span><%= t('pending') %></span>
             <% if local_assigns[:pending_count] %>
@@ -139,8 +139,8 @@
         </native-menu-action>
       </li>
       <li>
-        <native-menu-action data-icon="circle_check" data-label="<%= t('completed') %>" data-selected="<%= current_status == 'completed' %>" class="grid-cols-1 <%= 'bg-base-200' if current_status == 'completed' %>">
-          <%= link_to url_for(params: request.query_parameters.merge('status' => 'completed')), class: 'flex items-center gap-2', aria: { label: t('completed') } do %>
+        <native-menu-action data-icon="circle_check" data-label="<%= t('completed') %>" data-selected="<%= current_status == 'completed' %>" class="grid-cols-1 p-0 <%= 'bg-base-200' if current_status == 'completed' %>">
+          <%= link_to url_for(params: request.query_parameters.merge('status' => 'completed')), class: 'flex items-center gap-2 px-4 py-2', aria: { label: t('completed') } do %>
             <%= svg_icon('circle_check', class: 'w-5 h-5 shrink-0') %>
             <span><%= t('completed') %></span>
             <% if local_assigns[:completed_count] %>
diff --git a/app/views/submissions_filters/_filter_button.html.erb b/app/views/submissions_filters/_filter_button.html.erb
index 07a07c7f9..bba69c841 100644
--- a/app/views/submissions_filters/_filter_button.html.erb
+++ b/app/views/submissions_filters/_filter_button.html.erb
@@ -9,40 +9,40 @@
   </label>
   <ul tabindex="0" class="<%= turbo_native_app? ? 'hidden' : 'z-10 dropdown-content p-2 mt-2 shadow menu text-base bg-base-100 rounded-box text-right' %>" style="min-width: 180px;">
     <li class="flex">
-      <native-menu-action data-icon="calendar_check" data-label="<%= t('completed_at') %>">
-        <%= link_to submissions_filter_path('completed_at', query_params.merge(path: url_for)), class: 'flex items-center gap-2', data: { turbo_frame: 'modal', native_modal: 'medium' } do %>
+      <native-menu-action data-icon="calendar_check" data-label="<%= t('completed_at') %>" class="grid-cols-1 p-0">
+        <%= link_to submissions_filter_path('completed_at', query_params.merge(path: url_for)), class: 'flex items-center gap-2 px-4 py-2', data: { turbo_frame: 'modal', native_modal: 'medium' } do %>
           <%= svg_icon('calendar_check', class: 'w-5 h-5 flex-shrink-0 stroke-2') %>
           <span><%= t('completed_at') %></span>
         <% end %>
       </native-menu-action>
     </li>
     <li class="flex">
-      <native-menu-action data-icon="calendar" data-label="<%= t('created_at') %>">
-        <%= link_to submissions_filter_path('created_at', query_params.merge(path: url_for)), class: 'flex items-center gap-2', data: { turbo_frame: 'modal', native_modal: 'medium' } do %>
+      <native-menu-action data-icon="calendar" data-label="<%= t('created_at') %>" class="grid-cols-1 p-0">
+        <%= link_to submissions_filter_path('created_at', query_params.merge(path: url_for)), class: 'flex items-center gap-2 px-4 py-2', data: { turbo_frame: 'modal', native_modal: 'medium' } do %>
           <%= svg_icon('calendar', class: 'w-5 h-5 flex-shrink-0 stroke-2') %>
           <span><%= t('created_at') %></span>
         <% end %>
       </native-menu-action>
     </li>
     <li class="flex">
-      <native-menu-action data-icon="info_circle" data-label="<%= t('status') %>">
-        <%= link_to submissions_filter_path('status', query_params.merge(path: url_for)), class: 'flex items-center gap-2', data: { turbo_frame: 'modal', native_modal: 'medium' } do %>
+      <native-menu-action data-icon="info_circle" data-label="<%= t('status') %>" class="grid-cols-1 p-0">
+        <%= link_to submissions_filter_path('status', query_params.merge(path: url_for)), class: 'flex items-center gap-2 px-4 py-2', data: { turbo_frame: 'modal', native_modal: 'medium' } do %>
           <%= svg_icon('info_circle', class: 'w-5 h-5 flex-shrink-0 stroke-2') %>
           <span><%= t('status') %></span>
         <% end %>
       </native-menu-action>
     </li>
     <li class="flex">
-      <native-menu-action data-icon="folder" data-label="<%= t('folder') %>">
-        <%= link_to submissions_filter_path('folder', query_params.merge(path: url_for)), class: 'flex items-center gap-2', data: { turbo_frame: 'modal', native_modal: 'medium' } do %>
+      <native-menu-action data-icon="folder" data-label="<%= t('folder') %>" class="grid-cols-1 p-0">
+        <%= link_to submissions_filter_path('folder', query_params.merge(path: url_for)), class: 'flex items-center gap-2 px-4 py-2', data: { turbo_frame: 'modal', native_modal: 'medium' } do %>
           <%= svg_icon('folder', class: 'w-5 h-5 flex-shrink-0 stroke-2') %>
           <span><%= t('folder') %></span>
         <% end %>
       </native-menu-action>
     </li>
     <li class="flex">
-      <native-menu-action data-icon="user" data-label="<%= t('author') %>">
-        <%= link_to submissions_filter_path('author', query_params.merge(path: url_for)), class: 'flex items-center gap-2', data: { turbo_frame: 'modal', native_modal: 'medium' } do %>
+      <native-menu-action data-icon="user" data-label="<%= t('author') %>" class="grid-cols-1 p-0">
+        <%= link_to submissions_filter_path('author', query_params.merge(path: url_for)), class: 'flex items-center gap-2 px-4 py-2', data: { turbo_frame: 'modal', native_modal: 'medium' } do %>
           <%= svg_icon('user', class: 'w-5 h-5 flex-shrink-0 stroke-2') %>
           <span><%= t('author') %></span>
         <% end %>
diff --git a/app/views/templates/_template.html.erb b/app/views/templates/_template.html.erb
index c05b1208f..074a919a3 100644
--- a/app/views/templates/_template.html.erb
+++ b/app/views/templates/_template.html.erb
@@ -76,8 +76,8 @@
       <ul tabindex="0" class="<%= turbo_native_app? ? 'hidden' : 'z-10 dropdown-content p-2 mb-1 shadow menu text-base bg-base-100 rounded-box min-w-[160px]' %>">
         <% if can?(:update, template) %>
           <li>
-            <native-menu-action data-icon="pencil" data-label="<%= t('edit') %>">
-              <%= link_to edit_template_path(template), class: 'flex items-center gap-2', data: { native_title: template.name } do %>
+            <native-menu-action data-icon="pencil" data-label="<%= t('edit') %>" class="grid-cols-1 p-0">
+              <%= link_to edit_template_path(template), class: 'flex items-center gap-2 px-4 py-2', data: { native_title: template.name } do %>
                 <%= svg_icon('pencil', class: 'w-5 h-5 flex-shrink-0') %>
                 <span><%= t('edit') %></span>
               <% end %>
@@ -86,8 +86,8 @@
         <% end %>
         <% if can?(:update, template) && template.account_id == current_account.id %>
           <li>
-            <native-menu-action data-icon="folder" data-label="<%= t('move') %>">
-              <%= link_to edit_template_folder_path(template.id), class: 'flex items-center gap-2', data: { turbo_frame: :modal, native_modal: :medium } do %>
+            <native-menu-action data-icon="folder" data-label="<%= t('move') %>" class="grid-cols-1 p-0">
+              <%= link_to edit_template_folder_path(template.id), class: 'flex items-center gap-2 px-4 py-2', data: { turbo_frame: :modal, native_modal: :medium } do %>
                 <%= svg_icon('folder_share', class: 'w-5 h-5 flex-shrink-0') %>
                 <span><%= t('move') %></span>
               <% end %>
@@ -96,8 +96,8 @@
         <% end %>
         <% if can?(:create, template) %>
           <li>
-            <native-menu-action data-icon="copy" data-label="<%= t('clone') %>">
-              <%= link_to new_template_clone_path(template), class: 'flex items-center gap-2', data: { turbo_frame: :modal, native_modal: :medium } do %>
+            <native-menu-action data-icon="copy" data-label="<%= t('clone') %>" class="grid-cols-1 p-0">
+              <%= link_to new_template_clone_path(template), class: 'flex items-center gap-2 px-4 py-2', data: { turbo_frame: :modal, native_modal: :medium } do %>
                 <%= svg_icon('copy', class: 'w-5 h-5 flex-shrink-0') %>
                 <span><%= t('clone') %></span>
               <% end %>
@@ -106,8 +106,8 @@
         <% end %>
         <% if can?(:destroy, template) %>
           <li>
-            <native-menu-action data-icon="archive" data-label="<%= t('archive') %>">
-              <button form="<%= form_uuid = SecureRandom.uuid %>" class="flex items-center">
+            <native-menu-action data-icon="archive" data-label="<%= t('archive') %>" class="grid-cols-1 p-0">
+              <button form="<%= form_uuid = SecureRandom.uuid %>" class="flex items-center px-4 py-2">
                 <%= button_title(title: t('archive'), disabled_with: t('archiving'), icon: svg_icon('archive', class: 'w-5 h-5 flex-shrink-0')) %>
               </button>
               <%= button_to '', template_path(template), method: :delete, form: { id: form_uuid, class: 'hidden' } %>