homelab/docuseal
1
0
Fork 0
mirror of https://github.com/docusealco/docuseal.git synced 2026-08-07 07:14:43 +00:00
Code Issues Packages Projects Releases Wiki Activity

add mobile filters

Browse Source
This commit is contained in:
Alex Turchyn
2026-07-24 17:48:45 +03:00
committed by Pete Matsyburka
parent 3edd1ab32d
commit 270461ad3b
10 changed files with 142 additions and 86 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/javascript/application.js
+2
View File
@@ -56,6 +56,7 @@ import OpenModal from './elements/open_modal'
import BarChart from './elements/bar_chart' import BarChart from './elements/bar_chart'
import FieldCondition from './elements/field_condition' import FieldCondition from './elements/field_condition'
import ConfirmUpload from './elements/confirm_upload' import ConfirmUpload from './elements/confirm_upload'
import ScrollFade from './elements/scroll_fade'
import * as TurboInstantClick from './lib/turbo_instant_click' import * as TurboInstantClick from './lib/turbo_instant_click'
@@ -150,6 +151,7 @@ safeRegisterElement('open-modal', OpenModal)
safeRegisterElement('bar-chart', BarChart) safeRegisterElement('bar-chart', BarChart)
safeRegisterElement('field-condition', FieldCondition) safeRegisterElement('field-condition', FieldCondition)
safeRegisterElement('confirm-upload', ConfirmUpload) safeRegisterElement('confirm-upload', ConfirmUpload)
safeRegisterElement('scroll-fade', ScrollFade)
safeRegisterElement('template-builder', class extends HTMLElement { safeRegisterElement('template-builder', class extends HTMLElement {
connectedCallback () { connectedCallback () {
app/javascript/elements/scroll_fade.js
+40
View File
@@ -0,0 +1,40 @@
export default class extends HTMLElement {
connectedCallback () {
this.addEventListener('scroll', this.updateFade, { passive: true })
window.addEventListener('resize', this.updateFade)
this.updateFade()
}
disconnectedCallback () {
window.removeEventListener('resize', this.updateFade)
}
updateFade = () => {
const maxScroll = this.scrollWidth - this.clientWidth
const fadeGradient = {
right: 'linear-gradient(to right, black calc(100% - 24px), transparent)',
left: 'linear-gradient(to right, transparent, black 24px)',
both: 'linear-gradient(to right, transparent, black 24px, black calc(100% - 24px), transparent)'
}
let state = 'none'
if (maxScroll > 4) {
if (this.scrollLeft <= 4) {
state = 'right'
} else if (this.scrollLeft >= maxScroll - 4) {
state = 'left'
} else {
state = 'both'
}
}
this.applyFade(fadeGradient[state] || '')
}
applyFade (gradient) {
this.style.maskImage = gradient
this.style.webkitMaskImage = gradient
}
}
app/views/shared/_classes.html.erb
+1 -1
View File
@@ -1 +1 @@
<% 'stats stat stat-figure stat-title stat-value text-accent w-fit hover:bg-white dropdown-open border-base-content/30 before:border-base-content/30' %> <% 'stats stat stat-figure stat-title stat-value text-accent w-fit hover:bg-white dropdown-open border-base-content/30 before:border-base-content/30 order-none order-1 order-2 order-3 order-4 order-5' %>
app/views/submissions_archived/index.html.erb
+1 -1
View File
@@ -16,7 +16,7 @@
<% end %> <% end %>
</div> </div>
</div> </div>
<div class="flex flex-col items-end md:flex-row gap-2"> <div class="flex items-center md:items-end gap-2">
<%= render 'submissions_filters/applied_filters', filter_params: %> <%= render 'submissions_filters/applied_filters', filter_params: %>
<%= render 'submissions_filters/filter_button', filter_params: %> <%= render 'submissions_filters/filter_button', filter_params: %>
</div> </div>
app/views/submissions_dashboard/index.html.erb
+3 -3
View File
@@ -34,7 +34,7 @@
<% end %> <% end %>
<% if is_show_tabs %> <% if is_show_tabs %>
<div class="flex items-center flex-col md:flex-row md:flex-wrap gap-2 mb-4"> <div class="flex items-center flex-col md:flex-row md:flex-wrap gap-2 mb-4">
<div class="flex items-center md:items-end flex-col md:flex-row gap-2 w-full md:w-fit"> <div class="hidden md:flex md:items-end gap-2 md:w-fit">
<a href="<%= url_for(params: request.query_parameters.except('status')) %>" class="<%= params[:status].blank? ? 'border-neutral-700' : 'border-neutral-300' %> flex h-10 px-2 py-1 text-lg items-center justify-between border text-center text-neutral font-semibold rounded-xl w-full md:w-48 hover:border-neutral-600"> <a href="<%= url_for(params: request.query_parameters.except('status')) %>" class="<%= params[:status].blank? ? 'border-neutral-700' : 'border-neutral-300' %> flex h-10 px-2 py-1 text-lg items-center justify-between border text-center text-neutral font-semibold rounded-xl w-full md:w-48 hover:border-neutral-600">
<div class="flex items-center space-x-1"> <div class="flex items-center space-x-1">
<%= svg_icon('list', class: 'w-5 h-5') %> <%= svg_icon('list', class: 'w-5 h-5') %>
@@ -54,8 +54,8 @@
</div> </div>
</a> </a>
</div> </div>
<div class="flex items-end flex-col md:flex-row gap-2 w-full md:w-fit"> <div class="flex items-center md:items-end gap-2 w-full md:w-fit">
<%= render 'submissions_filters/applied_filters', filter_params: %> <%= render 'submissions_filters/applied_filters', filter_params:, with_status: true %>
<%= render 'submissions_filters/filter_button', filter_params: %> <%= render 'submissions_filters/filter_button', filter_params: %>
<%= render 'submissions_filters/actions', filter_params: %> <%= render 'submissions_filters/actions', filter_params: %>
</div> </div>
app/views/submissions_filters/_applied_filters.html.erb
+84 -71
View File
@@ -1,72 +1,85 @@
<% query_params = params.permit(:q).merge(filter_params) %> <% query_params = params.permit(:q).merge(filter_params) %>
<% if icon = { 'declined' => 'x_circle', 'expired' => 'clock_cancel', 'partially_completed' => 'clock_edit', 'sent' => 'send', 'opened' => 'mail_opened' }[params[:status]] %> <% filter_names = %w[status folder author completed_at created_at] %>
<div class="flex h-10 px-2 py-1 text-lg items-center justify-between border text-center text-neutral font-semibold rounded-xl w-full md:w-36 border-neutral-700"> <% ordered_filters = request.query_parameters.keys.filter_map { |key| filter_names.find { |name| key.start_with?(name) } }.uniq %>
<%= link_to submissions_filter_path('status', query_params.merge(path: url_for, with_remove: true)), data: { turbo_frame: 'modal' }, class: 'flex items-center space-x-1 flex-1 min-w-0 pr-1' do %> <% chip_order = ordered_filters.reverse.each_with_index.to_h { |name, index| [name, index + 1] } %>
<%= svg_icon(icon, class: 'w-5 h-5 shrink-0') %> <% chip_order.default = ordered_filters.size + 1 %>
<span class="font-normal truncate"><%= t(params[:status]) %></span> <scroll-fade class="flex items-center gap-2 overflow-x-auto flex-1 min-w-0 [scrollbar-width:none] [&::-webkit-scrollbar]:hidden [&::-webkit-scrollbar]:h-0 [&::-webkit-scrollbar]:w-0 md:contents">
<% end %> <% if local_assigns[:with_status] %>
<%= link_to url_for(params: request.query_parameters.except('status')), class: 'rounded-lg ml-1 shrink-0 hover:bg-base-content hover:text-white' do %> <% status_icons = { 'all' => 'list', 'pending' => 'clock', 'completed' => 'circle_check', 'partially_completed' => 'clock_edit', 'sent' => 'send', 'opened' => 'mail_opened', 'declined' => 'x_circle', 'expired' => 'clock_cancel' } %>
<%= svg_icon('x', class: 'w-5 h-5') %> <% current_status = status_icons.key?(params[:status].to_s) ? params[:status] : 'all' %>
<% end %> <a href="<%= submissions_filter_path('status', query_params.merge(path: url_for)) %>" data-turbo-frame="modal" class="order-<%= current_status == 'all' ? 'none' : chip_order['status'] %> md:hidden flex h-10 px-2 py-1 space-x-1 text-base items-center border text-neutral rounded-xl shrink-0 <%= current_status == 'all' ? 'border-neutral-300' : 'border-neutral-700' %>">
</div> <%= svg_icon(status_icons[current_status], class: 'w-5 h-5 shrink-0') %>
<% end %> <span><%= t(current_status) %></span>
<% if params[:folder].present? %> <%= svg_icon('chevron_down', class: 'w-4 h-4 shrink-0') %>
<div class="tooltip tooltip-no-touch tooltip-bottom flex h-10 px-2 py-1 text-lg items-center justify-between border text-center text-neutral font-semibold rounded-xl w-full md:w-36 border-neutral-700" data-tip="<%= t('folder') %>"> </a>
<%= link_to submissions_filter_path('folder', query_params.merge(path: url_for, with_remove: true)), data: { turbo_frame: 'modal' }, class: 'flex items-center space-x-1 flex-1 min-w-0 pr-1' do %> <% end %>
<%= svg_icon('folder', class: 'w-5 h-5 shrink-0') %> <% if icon = { 'declined' => 'x_circle', 'expired' => 'clock_cancel', 'partially_completed' => 'clock_edit', 'sent' => 'send', 'opened' => 'mail_opened' }[params[:status]] %>
<span class="font-normal truncate"><%= params[:folder] %></span> <div class="order-<%= chip_order['status'] %> md:order-none <%= 'hidden md:flex' if local_assigns[:with_status] %> flex h-10 px-2 py-1 text-base md:text-lg items-center justify-between border text-center text-neutral font-semibold rounded-xl shrink-0 max-w-[60vw] md:w-36 border-neutral-700">
<% end %> <%= link_to submissions_filter_path('status', query_params.merge(path: url_for, with_remove: true)), data: { turbo_frame: 'modal' }, class: 'flex items-center space-x-1 flex-1 min-w-0 pr-1' do %>
<%= link_to url_for(params: request.query_parameters.except('folder')), class: 'rounded-lg ml-1 shrink-0 hover:bg-base-content hover:text-white' do %> <%= svg_icon(icon, class: 'w-5 h-5 shrink-0') %>
<%= svg_icon('x', class: 'w-5 h-5') %> <span class="font-normal truncate"><%= t(params[:status]) %></span>
<% end %> <% end %>
</div> <%= link_to url_for(params: request.query_parameters.except('status')), class: 'rounded-lg ml-1 shrink-0 hover:bg-base-content hover:text-white' do %>
<% end %> <%= svg_icon('x', class: 'w-5 h-5') %>
<% if params[:author].present? %> <% end %>
<div class="tooltip tooltip-no-touch tooltip-bottom flex h-10 px-2 py-1 text-lg items-center justify-between border text-center text-neutral font-semibold rounded-xl w-full md:w-36 border-neutral-700" data-tip="<%= t('author') %>"> </div>
<%= link_to submissions_filter_path('author', query_params.merge(path: url_for, with_remove: true)), data: { turbo_frame: 'modal' }, class: 'flex items-center space-x-1 flex-1 min-w-0 pr-1' do %> <% end %>
<%= svg_icon('user', class: 'w-5 h-5 shrink-0') %> <% if params[:folder].present? %>
<span class="font-normal truncate"><%= current_account.users.accessible_by(current_ability).where(account: current_account).find_by(email: params[:author])&.full_name || 'NA' %></span> <div class="order-<%= chip_order['folder'] %> md:order-none md:tooltip tooltip-no-touch tooltip-bottom flex md:flex h-10 px-2 py-1 text-base md:text-lg items-center justify-between border text-center text-neutral font-semibold rounded-xl shrink-0 max-w-[60vw] md:w-36 border-neutral-700" data-tip="<%= t('folder') %>">
<% end %> <%= link_to submissions_filter_path('folder', query_params.merge(path: url_for, with_remove: true)), data: { turbo_frame: 'modal' }, class: 'flex items-center space-x-1 flex-1 min-w-0 pr-1' do %>
<%= link_to url_for(params: request.query_parameters.except('author')), class: 'rounded-lg ml-1 shrink-0 hover:bg-base-content hover:text-white' do %> <%= svg_icon('folder', class: 'w-5 h-5 shrink-0') %>
<%= svg_icon('x', class: 'w-5 h-5') %> <span class="font-normal truncate"><%= params[:folder] %></span>
<% end %> <% end %>
</div> <%= link_to url_for(params: request.query_parameters.except('folder')), class: 'rounded-lg ml-1 shrink-0 hover:bg-base-content hover:text-white' do %>
<% end %> <%= svg_icon('x', class: 'w-5 h-5') %>
<% if query_params[:completed_at_from].present? || query_params[:completed_at_to].present? %> <% end %>
<div class="tooltip tooltip-no-touch tooltip-bottom flex h-10 px-2 py-1 text-lg items-center justify-between border text-center text-neutral font-semibold rounded-xl w-full md:w-36 border-neutral-700" data-tip="<%= t('completed_at') %>"> </div>
<%= link_to submissions_filter_path('completed_at', query_params.merge(path: url_for, with_remove: true)), data: { turbo_frame: 'modal' }, class: 'flex items-center space-x-1 flex-1 min-w-0 pr-1' do %> <% end %>
<%= svg_icon('calendar_check', class: 'w-5 h-5 shrink-0') %> <% if params[:author].present? %>
<span class="flex flex-row md:flex-col font-normal text-left md:text-center md:text-xs"> <div class="order-<%= chip_order['author'] %> md:order-none md:tooltip tooltip-no-touch tooltip-bottom flex md:flex h-10 px-2 py-1 text-base md:text-lg items-center justify-between border text-center text-neutral font-semibold rounded-xl shrink-0 max-w-[60vw] md:w-36 border-neutral-700" data-tip="<%= t('author') %>">
<% if query_params[:completed_at_from] == query_params[:completed_at_to] %> <%= link_to submissions_filter_path('author', query_params.merge(path: url_for, with_remove: true)), data: { turbo_frame: 'modal' }, class: 'flex items-center space-x-1 flex-1 min-w-0 pr-1' do %>
<span><%= l(Date.parse(query_params[:completed_at_from]), locale: current_account.locale) %></span> <%= svg_icon('user', class: 'w-5 h-5 shrink-0') %>
<% else %> <span class="font-normal truncate"><%= current_account.users.accessible_by(current_ability).where(account: current_account).find_by(email: params[:author])&.full_name || 'NA' %></span>
<span><%= query_params[:completed_at_from].present? ? l(Date.parse(query_params[:completed_at_from]), locale: current_account.locale) : '∞' %></span> <% end %>
<span class="px-1 md:px-0 md:hidden">-</span> <%= link_to url_for(params: request.query_parameters.except('author')), class: 'rounded-lg ml-1 shrink-0 hover:bg-base-content hover:text-white' do %>
<span><%= query_params[:completed_at_to].present? ? l(Date.parse(query_params[:completed_at_to]), locale: current_account.locale) : t('today') %></span> <%= svg_icon('x', class: 'w-5 h-5') %>
<% end %> <% end %>
</span> </div>
<% end %> <% end %>
<%= link_to url_for(params: request.query_parameters.except('completed_at_from', 'completed_at_to')), class: 'rounded-lg ml-1 shrink-0 hover:bg-base-content hover:text-white' do %> <% if query_params[:completed_at_from].present? || query_params[:completed_at_to].present? %>
<%= svg_icon('x', class: 'w-5 h-5') %> <div class="order-<%= chip_order['completed_at'] %> md:order-none md:tooltip tooltip-no-touch tooltip-bottom flex md:flex h-10 px-2 py-1 text-base md:text-lg items-center justify-between border text-center text-neutral font-semibold rounded-xl shrink-0 max-w-[60vw] md:w-36 border-neutral-700" data-tip="<%= t('completed_at') %>">
<% end %> <%= link_to submissions_filter_path('completed_at', query_params.merge(path: url_for, with_remove: true)), data: { turbo_frame: 'modal' }, class: 'flex items-center space-x-1 flex-1 min-w-0 pr-1' do %>
</div> <%= svg_icon('calendar_check', class: 'w-5 h-5 shrink-0') %>
<% end %> <span class="flex flex-col font-normal text-left md:text-center text-xs">
<% if query_params[:created_at_from].present? || query_params[:created_at_to].present? %> <% if query_params[:completed_at_from] == query_params[:completed_at_to] %>
<div class="tooltip tooltip-no-touch tooltip-bottom flex h-10 px-2 py-1 text-lg items-center justify-between border text-center text-neutral font-semibold rounded-xl w-full md:w-36 border-neutral-700" data-tip="<%= t('created_at') %>"> <span><%= l(Date.parse(query_params[:completed_at_from]), locale: current_account.locale) %></span>
<%= link_to submissions_filter_path('created_at', query_params.merge(path: url_for, with_remove: true)), data: { turbo_frame: 'modal' }, class: 'flex items-center space-x-1 flex-1 min-w-0 pr-1' do %> <% else %>
<%= svg_icon('calendar', class: 'w-5 h-5 shrink-0') %> <span><%= query_params[:completed_at_from].present? ? l(Date.parse(query_params[:completed_at_from]), locale: current_account.locale) : '∞' %></span>
<span class="flex flex-row md:flex-col font-normal text-left md:text-center md:text-xs"> <span><%= query_params[:completed_at_to].present? ? l(Date.parse(query_params[:completed_at_to]), locale: current_account.locale) : t('today') %></span>
<% if query_params[:created_at_from] == query_params[:created_at_to] %> <% end %>
<span><%= l(Date.parse(query_params[:created_at_from]), locale: current_account.locale) %></span> </span>
<% else %> <% end %>
<span><%= query_params[:created_at_from].present? ? l(Date.parse(query_params[:created_at_from]), locale: current_account.locale) : '∞' %></span> <%= link_to url_for(params: request.query_parameters.except('completed_at_from', 'completed_at_to')), class: 'rounded-lg ml-1 shrink-0 hover:bg-base-content hover:text-white' do %>
<span class="px-1 md:px-0 md:hidden">-</span> <%= svg_icon('x', class: 'w-5 h-5') %>
<span><%= query_params[:created_at_to].present? ? l(Date.parse(query_params[:created_at_to]), locale: current_account.locale) : t('today') %></span> <% end %>
<% end %> </div>
</span> <% end %>
<% end %> <% if query_params[:created_at_from].present? || query_params[:created_at_to].present? %>
<%= link_to url_for(params: request.query_parameters.except('created_at_to', 'created_at_from')), class: 'rounded-lg ml-1 shrink-0 hover:bg-base-content hover:text-white' do %> <div class="order-<%= chip_order['created_at'] %> md:order-none md:tooltip tooltip-no-touch tooltip-bottom flex md:flex h-10 px-2 py-1 text-base md:text-lg items-center justify-between border text-center text-neutral font-semibold rounded-xl shrink-0 max-w-[60vw] md:w-36 border-neutral-700" data-tip="<%= t('created_at') %>">
<%= svg_icon('x', class: 'w-5 h-5') %> <%= link_to submissions_filter_path('created_at', query_params.merge(path: url_for, with_remove: true)), data: { turbo_frame: 'modal' }, class: 'flex items-center space-x-1 flex-1 min-w-0 pr-1' do %>
<% end %> <%= svg_icon('calendar', class: 'w-5 h-5 shrink-0') %>
</div> <span class="flex flex-col font-normal text-left md:text-center text-xs">
<% end %> <% if query_params[:created_at_from] == query_params[:created_at_to] %>
<span><%= l(Date.parse(query_params[:created_at_from]), locale: current_account.locale) %></span>
<% else %>
<span><%= query_params[:created_at_from].present? ? l(Date.parse(query_params[:created_at_from]), locale: current_account.locale) : '∞' %></span>
<span><%= query_params[:created_at_to].present? ? l(Date.parse(query_params[:created_at_to]), locale: current_account.locale) : t('today') %></span>
<% end %>
</span>
<% end %>
<%= link_to url_for(params: request.query_parameters.except('created_at_to', 'created_at_from')), class: 'rounded-lg ml-1 shrink-0 hover:bg-base-content hover:text-white' do %>
<%= svg_icon('x', class: 'w-5 h-5') %>
<% end %>
</div>
<% end %>
</scroll-fade>
app/views/submissions_filters/_filter_button.html.erb
+5 -4
View File
@@ -1,8 +1,9 @@
<% query_params = params.permit(:q).merge(filter_params) %> <% query_params = params.permit(:q).merge(filter_params) %>
<div class="dropdown dropdown-end"> <% advanced_filters = filter_params.then { |f| f[:status].in?(%w[pending completed]) ? f.except(:status) : f } %>
<label tabindex="0" class="cursor-pointer flex h-10 px-3 py-1 space-x-1 text-lg items-center justify-between border text-center text-neutral rounded-xl border-neutral-300 hover:border-neutral-700"> <div class="dropdown dropdown-end shrink-0">
<label tabindex="0" class="cursor-pointer flex h-10 py-1 w-10 md:w-auto px-0 md:px-3 space-x-0 md:space-x-1 justify-center md:justify-between text-lg items-center border text-center text-neutral rounded-xl <%= advanced_filters.present? ? 'border-neutral-700 md:border-neutral-300' : 'border-neutral-300' %> hover:border-neutral-700">
<%= svg_icon('filter', class: 'w-5 h-5 flex-shrink-0 stroke-2') %> <%= svg_icon('filter', class: 'w-5 h-5 flex-shrink-0 stroke-2') %>
<span class="<%= filter_params.then { |f| f[:status].in?(%w[pending completed]) ? f.except(:status) : f }.present? ? 'md:hidden' : '' %>">Filter</span> <span class="hidden <%= 'md:inline' if advanced_filters.blank? %>">Filter</span>
</label> </label>
<ul tabindex="0" class="z-10 dropdown-content p-2 mt-2 shadow menu text-base bg-base-100 rounded-box min-w-[180px] text-right"> <ul tabindex="0" class="z-10 dropdown-content p-2 mt-2 shadow menu text-base bg-base-100 rounded-box min-w-[180px] text-right">
<li class="flex"> <li class="flex">
@@ -17,7 +18,7 @@
<span><%= t('created_at') %></span> <span><%= t('created_at') %></span>
<% end %> <% end %>
</li> </li>
<li class="flex"> <li class="hidden md:flex">
<%= link_to submissions_filter_path('status', query_params.merge(path: url_for)), data: { turbo_frame: 'modal' } do %> <%= link_to submissions_filter_path('status', query_params.merge(path: url_for)), data: { turbo_frame: 'modal' } do %>
<%= svg_icon('info_circle', class: 'w-5 h-5 flex-shrink-0 stroke-2') %> <%= svg_icon('info_circle', class: 'w-5 h-5 flex-shrink-0 stroke-2') %>
<span><%= t('status') %></span> <span><%= t('status') %></span>
app/views/template_folders/show.html.erb
+1 -1
View File
@@ -1,5 +1,5 @@
<div> <div>
<%= link_to @template_folder.parent_folder ? folder_path(@template_folder.parent_folder) : root_path, class: 'flex items-center mb-1 md:mb-0' do %> <%= link_to @template_folder.parent_folder ? folder_path(@template_folder.parent_folder) : root_path, class: 'flex items-center' do %>
<%= svg_icon('chevron_left', class: 'w-5 h-5') %> <%= svg_icon('chevron_left', class: 'w-5 h-5') %>
<span style="margin-left: 3px"><%= @template_folder.parent_folder&.name || t('home') %></span> <span style="margin-left: 3px"><%= @template_folder.parent_folder&.name || t('home') %></span>
<% end %> <% end %>
app/views/templates/show.html.erb
+3 -3
View File
@@ -29,7 +29,7 @@
<% end %> <% end %>
<% if is_show_tabs %> <% if is_show_tabs %>
<div class="flex items-center flex-col md:flex-row md:flex-wrap gap-2 mb-4"> <div class="flex items-center flex-col md:flex-row md:flex-wrap gap-2 mb-4">
<div class="flex items-center md:items-end flex-col md:flex-row gap-2 w-full md:w-fit"> <div class="hidden md:flex md:items-end gap-2 md:w-fit">
<a href="<%= url_for(params: request.query_parameters.except('status')) %>" class="<%= params[:status].blank? ? 'border-neutral-700' : 'border-neutral-300' %> flex h-10 px-2 py-1 text-lg items-center justify-between border text-center text-neutral font-semibold rounded-xl w-full md:w-48 hover:border-neutral-700"> <a href="<%= url_for(params: request.query_parameters.except('status')) %>" class="<%= params[:status].blank? ? 'border-neutral-700' : 'border-neutral-300' %> flex h-10 px-2 py-1 text-lg items-center justify-between border text-center text-neutral font-semibold rounded-xl w-full md:w-48 hover:border-neutral-700">
<div class="flex items-center space-x-1"> <div class="flex items-center space-x-1">
<%= svg_icon('list', class: 'w-5 h-5') %> <%= svg_icon('list', class: 'w-5 h-5') %>
@@ -64,8 +64,8 @@
<% end %> <% end %>
</a> </a>
</div> </div>
<div class="flex items-end flex-col md:flex-row gap-2 w-full md:w-fit"> <div class="flex items-center md:items-end gap-2 w-full md:w-fit">
<%= render 'submissions_filters/applied_filters', filter_params: %> <%= render 'submissions_filters/applied_filters', filter_params:, with_status: true %>
<%= render 'submissions_filters/filter_button', filter_params: %> <%= render 'submissions_filters/filter_button', filter_params: %>
<% unless @template.archived_at? %> <% unless @template.archived_at? %>
<%= render 'submissions_filters/actions', filter_params: filter_params.merge(template_id: @template.id) %> <%= render 'submissions_filters/actions', filter_params: filter_params.merge(template_id: @template.id) %>
app/views/templates_archived_submissions/index.html.erb
+2 -2
View File
@@ -18,12 +18,12 @@
<% end %> <% end %>
</div> </div>
</div> </div>
<div class="flex flex-wrap justify-end items-center gap-2"> <div class="flex flex-nowrap md:flex-wrap justify-end items-center gap-2">
<%= render 'submissions_filters/applied_filters', filter_params: %> <%= render 'submissions_filters/applied_filters', filter_params: %>
<div class="shrink-0 md:order-first"> <div class="shrink-0 md:order-first">
<%= link_to new_template_submissions_export_path(@template, archived: true), class: 'btn btn-ghost text-base h-10 min-h-10', data: { turbo_frame: 'modal' } do %> <%= link_to new_template_submissions_export_path(@template, archived: true), class: 'btn btn-ghost text-base h-10 min-h-10', data: { turbo_frame: 'modal' } do %>
<%= svg_icon('download', class: 'w-6 h-6 stroke-2') %> <%= svg_icon('download', class: 'w-6 h-6 stroke-2') %>
<span><%= t('export') %></span> <span class="hidden md:inline"><%= t('export') %></span>
<% end %> <% end %>
</div> </div>
<%= render 'submissions_filters/filter_button', filter_params: %> <%= render 'submissions_filters/filter_button', filter_params: %>