QT/sure
1
0
Fork 0
mirror of https://github.com/we-promise/sure.git synced 2026-04-19 20:14:08 +00:00
Code Issues Packages Projects Releases Wiki Activity

UI Improvements for Ouflows Section (#334)

Browse Source 
* feat: Improve categories list in outflows section

* feat: align bg containers in home page sections

* Revert "feat: align bg containers in home page sections"

This reverts commit 62ad36f23e.

* Revert "feat: Improve categories list in outflows section"

This reverts commit 4b6cb66843.

* feat: Improve categories list in outflows section

* feat: align bg containers in home page sections

* feat: reduce padding and align styling between outflows and assets sections

* feat: add number of categories and translations

* fix: Adjust Outflows header width for mobile
This commit is contained in:
Alessio Cappa
2025-11-15 16:29:50 +01:00
committed by GitHub
parent 00086bdca0
commit b16857b040
3 changed files with 26 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
app/views/pages/dashboard/_balance_sheet.html.erb
View File

@@ -35,7 +35,7 @@
</div>
</div>
<div class="bg-surface rounded-xl p-1 space-y-1 overflow-x-auto">
<div class="bg-container-inset rounded-xl p-1 space-y-1 overflow-x-auto">
<div class="px-4 py-2 flex items-center uppercase text-xs font-medium text-secondary">
<div class="w-40">Name</div>
<div class="ml-auto text-right flex items-center gap-6">
@@ -50,11 +50,11 @@
<div class="shadow-border-xs rounded-lg bg-container font-medium text-sm min-w-fit">
<% classification_group.account_groups.each_with_index do |account_group, idx| %>
<details class="group open:bg-surface
<details class="group open:bg-container
<%= idx == 0 ? "rounded-t-lg" : "" %>
<%= idx == classification_group.account_groups.size - 1 ? "rounded-b-lg" : "" %>
">
<summary class="cursor-pointer p-4 group-open:bg-surface rounded-lg flex items-center justify-between">
<summary class="cursor-pointer p-4 group-open:bg-container rounded-lg flex items-center justify-between">
<div class="w-40 shrink-0 flex items-center gap-4">
<%= icon("chevron-right", class: "group-open:rotate-90") %>

24
app/views/pages/dashboard/_outflows_donut.html.erb
View File

@@ -59,11 +59,24 @@
</div>
<!-- Category List -->
<div class="w-full lg:w-2/3">
<div class="space-y-2">
<% outflows_data[:categories].each do |category| %>
<div class="w-full lg:w-2/3 bg-container-inset rounded-xl p-1 space-y-1 overflow-x-auto">
<div class="px-4 py-2 flex items-center uppercase text-xs font-medium text-secondary">
<div class="w-16 lg:w-40">
<p><%= t("pages.dashboard.outflows_donut.categories") %><span class="text-subdued mx-1">&middot;</span><%= outflows_data[:categories].count %></p>
</div>
<div class="ml-auto text-right flex items-center gap-6">
<div class="w-16 lg:w-40">
<p><%= t("pages.dashboard.outflows_donut.value") %></p>
</div>
<div class="w-16">
<p><%= t("pages.dashboard.outflows_donut.weight") %></p>
</div>
</div>
</div>
<div class="py-3 shadow-border-xs rounded-lg bg-container font-medium text-sm min-w-fit max-w-full">
<% outflows_data[:categories].each_with_index do |category, idx| %>
<%= link_to transactions_path(q: { categories: [category[:name]], start_date: period.date_range.first, end_date: period.date_range.last }),
class: "flex items-center justify-between p-3 rounded-lg hover:bg-container-inset transition-colors cursor-pointer group",
class: "flex items-center justify-between mx-3 p-3 rounded-lg cursor-pointer group",
data: {
turbo_frame: "_top",
category_id: category[:id],
@@ -79,6 +92,9 @@
<span class="text-sm text-secondary whitespace-nowrap"><%= category[:percentage] %>%</span>
</div>
<% end %>
<% if idx < outflows_data[:categories].size - 1 %>
<%= render "shared/ruler", classes: "mx-3 lg:mx-4" %>
<% end %>
<% end %>
</div>
</div>