Docker/Maybe
Docker/Maybe
1
0
Fork 0
mirror of https://github.com/maybe-finance/maybe.git synced 2025-08-04 04:55:20 +02:00
Code Issues Releases Activity Actions

UI Fixes (#2276)

Browse source 
* Use rounded-full on budget allocation bar

* Fix backgrounds when balance sheet groups are open

* Add rulers between accounts and classification groups in balance sheet and account groups views.
This commit is contained in:
Alex Hatzenbuhler 2025-05-22 10:35:55 -05:00 • committed by GitHub
parent 2fbd6cbc5d
commit a71b62575c
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 24 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

5
app/views/accounts/index/_account_groups.erb
View file

@ -12,8 +12,11 @@
<% end %> <% end %>
</div> </div>
<div class="bg-container rounded-lg shadow-border-xs"> <div class="bg-container rounded-lg shadow-border-xs">
<% accounts.each do |account| %> <% accounts.each_with_index do |account, index| %>
<%= render account %> <%= render account %>
<% unless index == accounts.count - 1 %>
<%= render "shared/ruler" %>
<% end %>
<% end %> <% end %>
</div> </div>
</div> </div>

4
app/views/budgets/_actuals_summary.html.erb
View file

@ -12,7 +12,7 @@
<div> <div>
<div class="flex h-1.5 mb-3 gap-1"> <div class="flex h-1.5 mb-3 gap-1">
<% budget.income_category_totals.each do |category_total| %> <% budget.income_category_totals.each do |category_total| %>
<div class="h-full rounded-xs" style="background-color: <%= category_total.category.color %>; width: <%= category_total.weight %>%"></div> <div class="h-full rounded-full" style="background-color: <%= category_total.category.color %>; width: <%= category_total.weight %>%"></div>
<% end %> <% end %>
</div> </div>
@ -38,7 +38,7 @@
<div> <div>
<div class="flex h-1.5 mb-3 gap-1"> <div class="flex h-1.5 mb-3 gap-1">
<% budget.expense_category_totals.each do |category_total| %> <% budget.expense_category_totals.each do |category_total| %>
<div class="h-full rounded-xs" style="background-color: <%= category_total.category.color %>; width: <%= category_total.weight %>%"></div> <div class="h-full rounded-full" style="background-color: <%= category_total.category.color %>; width: <%= category_total.weight %>%"></div>
<% end %> <% end %>
</div> </div>

23
app/views/pages/dashboard/_balance_sheet.html.erb
View file

@ -58,10 +58,13 @@
</div> </div>
</div> </div>
<div class="shadow-border-xs rounded-lg font-medium text-sm bg-container min-w-fit"> <div class="shadow-border-xs rounded-lg bg-container font-medium text-sm min-w-fit">
<% classification_group.account_groups.each do |account_group| %> <% classification_group.account_groups.each_with_index do |account_group, idx| %>
<details class="group"> <details class="group open:bg-surface
<summary class="cursor-pointer p-4 group-open:bg-surface bg-container rounded-lg flex items-center justify-between"> <%= 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">
<div class="w-40 shrink-0 flex items-center gap-4"> <div class="w-40 shrink-0 flex items-center gap-4">
<%= icon("chevron-right", class: "group-open:rotate-90") %> <%= icon("chevron-right", class: "group-open:rotate-90") %>
@ -93,7 +96,7 @@
<div> <div>
<% account_group.accounts.each_with_index do |account, idx| %> <% account_group.accounts.each_with_index do |account, idx| %>
<div class="pl-12 pr-4 py-3 flex items-center bg-container justify-between text-sm font-medium"> <div class="pl-12 pr-4 py-3 flex items-center justify-between text-sm font-medium">
<div class="flex items-center gap-3"> <div class="flex items-center gap-3">
<%= render "accounts/logo", account: account, size: "sm", color: account_group.color %> <%= render "accounts/logo", account: account, size: "sm", color: account_group.color %>
@ -129,6 +132,9 @@
<% end %> <% end %>
</div> </div>
</details> </details>
<% unless idx == classification_group.account_groups.size - 1 %>
<%= render "shared/ruler", classes: "mx-4 group-ruler" %>
<% end %>
<% end %> <% end %>
</div> </div>
</div> </div>
@ -147,3 +153,10 @@
</div> </div>
<% end %> <% end %>
</div> </div>
<%# Custom style for hiding ruler when details are open %>
<style>
details[open] + .group-ruler {
display: none;
}
</style>