mirror of
https://github.com/maybe-finance/maybe.git
synced 2025-08-05 05:25:24 +02:00
Add placeholders for dashboard features (#642)
* Add placeholders for new dashboard * Fix tests and lint errors
This commit is contained in:
parent
4708e85da3
commit
f5f624881f
14 changed files with 196 additions and 109 deletions
|
@ -1,23 +0,0 @@
|
|||
<%# locals: (label:, period:, balance:, trend:, size: "lg")%>
|
||||
<div class="space-y-2">
|
||||
<p class="text-sm text-gray-500"><%= label %></p>
|
||||
<p class="text-gray-900 -space-x-0.5">
|
||||
<span class="text-gray-500"><%= balance.currency.symbol %></span>
|
||||
<span class="<%= size == "lg" ? "text-xl" : "text-lg" %> font-medium"><%= format_money_without_symbol balance, precision: 0 %></span>
|
||||
<%- if balance.currency.default_precision.positive? -%>
|
||||
<span class="text-gray-500">
|
||||
<%= balance.currency.separator %><%= balance.cents_str %>
|
||||
</span>
|
||||
<% end %>
|
||||
</p>
|
||||
<% if trend.nil? %>
|
||||
<p class="text-sm text-gray-500">Data not available for the selected period</p>
|
||||
<% elsif trend.direction == "flat" %>
|
||||
<p class="text-sm text-gray-500">No change vs. prior period</p>
|
||||
<% else %>
|
||||
<div class="flex items-center gap-2">
|
||||
<%= render partial: "shared/trend_change", locals: { trend: trend } %>
|
||||
<span class="text-sm text-gray-500"><%= period_label(period) %></span>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
|
@ -1,6 +1,6 @@
|
|||
<%# locals: (content:) -%>
|
||||
<%= turbo_frame_tag "modal" do %>
|
||||
<dialog class="bg-white border border-alpha-black-25 rounded-2xl max-h-[648px] max-w-[580px] w-full shadow-xs h-full" data-controller="modal" data-action="click->modal#clickOutside">
|
||||
<dialog class="bg-white border border-alpha-black-25 rounded-2xl max-h-[648px] max-w-[580px] w-full shadow-xs h-fit" data-controller="modal" data-action="click->modal#clickOutside">
|
||||
<div class="flex flex-col h-full">
|
||||
<%= content %>
|
||||
</div>
|
||||
|
|
|
@ -1,10 +1,10 @@
|
|||
<%# locals: (trend:) %>
|
||||
<%# locals: { trend: } %>
|
||||
<% styles = trend_styles(trend) %>
|
||||
<p class="text-sm <%= styles[:text_class] %>">
|
||||
<% if trend.direction == "flat" %>
|
||||
<span>No change</span>
|
||||
<% else %>
|
||||
<span><%= styles[:symbol] %><%= format_money trend.value.abs %></span>
|
||||
<span><%= styles[:symbol] %><%= trend.value.is_a?(Money) ? format_money(trend.value.abs) : trend.value.abs %></span>
|
||||
<span>(<%= lucide_icon(styles[:icon], class: "w-4 h-4 align-text-bottom inline") %><%= trend.percent %>%)</span>
|
||||
<% end %>
|
||||
</p>
|
||||
|
|
27
app/views/shared/_value_heading.html.erb
Normal file
27
app/views/shared/_value_heading.html.erb
Normal file
|
@ -0,0 +1,27 @@
|
|||
<%# locals: (label:, period:, value:, trend:, size: "lg", is_percentage: false)%>
|
||||
<div class="space-y-2">
|
||||
<p class="text-sm text-gray-500 font-medium"><%= label %></p>
|
||||
<p class="text-gray-900 -space-x-0.5">
|
||||
<% if value.is_a?(Money) %>
|
||||
<span class="text-gray-500"><%= value.currency.symbol %></span>
|
||||
<span class="<%= size == "lg" ? "text-xl" : "text-lg" %> font-medium"><%= format_money_without_symbol value, precision: 0 %></span>
|
||||
<%- if value.currency.default_precision.positive? -%>
|
||||
<span class="text-gray-500">
|
||||
<%= value.currency.separator %><%= value.cents_str %>
|
||||
</span>
|
||||
<% end %>
|
||||
<% else %>
|
||||
<span class="<%= size == "lg" ? "text-xl" : "text-lg" %> font-medium"><%= is_percentage ? number_to_percentage(value, precision: 2) : value %></span>
|
||||
<% end %>
|
||||
</p>
|
||||
<% if trend.nil? %>
|
||||
<p class="text-sm text-gray-500">Data not available for the selected period</p>
|
||||
<% elsif trend.direction == "flat" %>
|
||||
<p class="text-sm text-gray-500">No change vs. prior period</p>
|
||||
<% else %>
|
||||
<div class="flex items-center gap-2">
|
||||
<%= render partial: "shared/trend_change", locals: { trend: trend } %>
|
||||
<span class="text-sm text-gray-500"><%= period_label(period) %></span>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
Loading…
Add table
Add a link
Reference in a new issue