QT/sure
1
0
Fork 0
mirror of https://github.com/we-promise/sure.git synced 2026-05-28 15:04:57 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: Avoid overlay in provider section on mobile (#1990)

Browse Source 
* fix: Avoid overlay in provider section on mobile

* feat: Reduce gap between divs

* fix: keep all the elements inside a dedicated container to avoid accessibility issues with the summary node
This commit is contained in:
Alessio Cappa
2026-05-26 09:56:42 +02:00
committed by GitHub
parent d8a12ad6be
commit e0537a45e1
1 changed files with 18 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
app/views/settings/providers/_connection_row.html.erb
View File

@@ -17,18 +17,24 @@
<%= tag.details open: open,
class: "group bg-container shadow-border-xs rounded-xl #{border_class}",
data: details_data do %>
<summary class="flex items-center gap-3 min-h-15 px-4 py-3.5 cursor-pointer rounded-xl list-none [&::-webkit-details-marker]:hidden">
<%= icon "chevron-right", size: "sm", class: "!w-3.5 !h-3.5 text-secondary group-open:rotate-90 transition-transform" %>
<div class="flex items-center gap-2 flex-wrap min-w-0 flex-1">
<h3 class="text-sm font-medium text-primary"><%= entry[:title] %></h3>
<%= render "settings/providers/maturity_badge", label: maturity_lbl %>
</div>
<div class="flex items-center gap-2 shrink-0 group-open:hidden">
<% if meta.present? %>
<span class="text-xs text-subdued"><%= meta %></span>
<% end %>
<%= status_pill %>
<%= sync_action if sync_action %>
<summary class="min-h-15 px-4 py-3.5 cursor-pointer rounded-xl list-none [&::-webkit-details-marker]:hidden">
<div class="flex items-center gap-3">
<%= icon "chevron-right", size: "sm", class: "!w-3.5 !h-3.5 text-secondary group-open:rotate-90 transition-transform" %>
<div class="flex items-center flex-wrap gap-2 min-w-0 flex-1">
<div class="flex items-center gap-2 shrink-0 flex-1">
<h3 class="text-sm font-medium text-primary"><%= entry[:title] %></h3>
<%= render "settings/providers/maturity_badge", label: maturity_lbl %>
</div>
<div class="flex items-center gap-2 shrink-0 group-open:hidden">
<% if meta.present? %>
<span class="text-xs text-subdued"><%= meta %></span>
<% end %>
<%= status_pill %>
</div>
</div>
<div class="group-open:hidden">
<%= sync_action if sync_action %>
</div>
</div>
</summary>
<div class="space-y-4 mt-4 px-4 pb-4">