FIX: Small layout adjustments (#507)

* feat: adjust padding and icon sizing in outflows chart

* fix: Remove extra div in reports page to fix layout issues on mobile

* fix: Padding adjustments to keep pages consistent

* fix: Align report page with main
This commit is contained in:
Alessio Cappa
2026-01-13 13:23:10 +01:00
committed by GitHub
parent 425570cd1f
commit 5f8a0dc78e
4 changed files with 6 additions and 6 deletions

View File

@@ -27,7 +27,7 @@
</div>
<% end %>
<div class="w-full space-y-6 pb-24" data-controller="dashboard-sortable" data-action="dragover->dashboard-sortable#dragOver drop->dashboard-sortable#drop" role="list" aria-label="Dashboard sections">
<div class="w-full space-y-6 pb-6 lg:pb-12" data-controller="dashboard-sortable" data-action="dragover->dashboard-sortable#dragOver drop->dashboard-sortable#drop" role="list" aria-label="Dashboard sections">
<% if Current.family.accounts.any? %>
<% @dashboard_sections.each do |section| %>
<% next unless section[:visible] %>

View File

@@ -13,7 +13,7 @@
<div class="px-4">
<div class="flex flex-col lg:flex-row gap-8 items-center">
<!-- Donut Chart -->
<div class="w-full lg:w-1/3 max-w-[300px] p-4">
<div class="w-full lg:w-1/3 max-w-[300px] px-4">
<div class="h-[300px] relative"
data-controller="donut-chart"
data-donut-chart-segments-value="<%= outflows_data[:categories].to_json %>"
@@ -74,7 +74,7 @@
category_content = capture do
%>
<div class="flex items-center gap-3 flex-1 min-w-0">
<div class="h-6 w-6 flex-shrink-0 group-hover:scale-105 transition-all duration-300 rounded-full flex justify-center items-center"
<div class="h-7 w-7 flex-shrink-0 group-hover:scale-105 transition-all duration-300 rounded-full flex justify-center items-center"
style="
background-color: color-mix(in oklab, <%= category[:color] %> 10%, transparent);
border-color: color-mix(in oklab, <%= category[:color] %> 10%, transparent);

View File

@@ -1,4 +1,4 @@
<div>
<div class="space-y-8">
<%# Month-over-Month Trends %>
<div>
<h3 class="text-sm font-medium text-secondary mb-4">
@@ -78,4 +78,4 @@
</div>
<% end %>
</div>
</div>
</div>

View File

@@ -96,7 +96,7 @@
</div>
<% end %>
<div class="w-full space-y-6 pb-24">
<div class="w-full space-y-6 pb-4 lg:pb-6">
<% if Current.family.transactions.any? %>
<%# Summary Dashboard - Always visible, not collapsible %>
<section>