mirror of
https://github.com/maybe-finance/maybe.git
synced 2025-08-09 15:35:22 +02:00
fix: apply requested changes and linting fixes
This commit is contained in:
Guilherme Mena
parent
f55616851d
commit
499935039d
28 changed files with 56 additions and 74 deletions
|
|
@ -634,6 +634,7 @@
|
|||
@apply disabled:text-subdued;
|
||||
@apply text-ellipsis overflow-hidden whitespace-nowrap;
|
||||
@apply transition-opacity duration-300;
|
||||
@apply placeholder:text-subdued;
|
||||
|
||||
&select {
|
||||
@apply pr-8;
|
||||
|
|
@ -849,11 +850,3 @@
|
|||
@apply bg-white;
|
||||
}
|
||||
}
|
||||
|
||||
@utility bg-primary-adaptive {
|
||||
@apply bg-white;
|
||||
|
||||
@variant theme-dark {
|
||||
@apply bg-black ;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,17 +1,12 @@
|
|||
class StyledFormBuilder < ActionView::Helpers::FormBuilder
|
||||
# Fields that visually inherit from "text field"
|
||||
class_attribute :text_field_helpers,
|
||||
default: (field_helpers - [ :label, :check_box, :radio_button, :fields_for, :fields, :hidden_field, :file_field ]) + [ :number_field, :date_field ]
|
||||
class_attribute :text_field_helpers, default: field_helpers - [ :label, :check_box, :radio_button, :fields_for, :fields, :hidden_field, :file_field ]
|
||||
|
||||
# Wraps "text" inputs with custom structure + base styles
|
||||
text_field_helpers.each do |selector|
|
||||
class_eval <<-RUBY_EVAL, __FILE__, __LINE__ + 1
|
||||
def #{selector}(method, options = {})
|
||||
base_classes = "form-field__input text-ellipsis text-subdued"
|
||||
merged_options = options.merge(
|
||||
class: [base_classes, options[:class]].compact.join(" ")
|
||||
)
|
||||
|
||||
merged_options = { class: "form-field__input" }.merge(options)
|
||||
label = build_label(method, options)
|
||||
field = super(method, merged_options)
|
||||
|
||||
|
|
@ -27,7 +22,7 @@ class StyledFormBuilder < ActionView::Helpers::FormBuilder
|
|||
end
|
||||
|
||||
def select(method, choices, options = {}, html_options = {})
|
||||
merged_html_options = { class: "form-field__input text-ellipsis text-subdued" }.merge(html_options)
|
||||
merged_html_options = { class: "form-field__input" }.merge(html_options)
|
||||
|
||||
label = build_label(method, options.merge(required: merged_html_options[:required]))
|
||||
field = super(method, choices, options, merged_html_options)
|
||||
|
|
@ -36,7 +31,7 @@ class StyledFormBuilder < ActionView::Helpers::FormBuilder
|
|||
end
|
||||
|
||||
def collection_select(method, collection, value_method, text_method, options = {}, html_options = {})
|
||||
merged_html_options = { class: "form-field__input text-ellipsis text-subdued" }.merge(html_options)
|
||||
merged_html_options = { class: "form-field__input" }.merge(html_options)
|
||||
|
||||
label = build_label(method, options.merge(required: merged_html_options[:required]))
|
||||
field = super(method, collection, value_method, text_method, options, merged_html_options)
|
||||
|
|
@ -64,7 +59,6 @@ class StyledFormBuilder < ActionView::Helpers::FormBuilder
|
|||
super(value, merged_options)
|
||||
end
|
||||
|
||||
|
||||
private
|
||||
|
||||
def build_styled_field(label, field, options, remove_padding_right: false)
|
||||
|
|
|
|||
|
|
@ -15,7 +15,7 @@
|
|||
class: "btn btn--primary flex items-center justify-center gap-1 w-9 h-9 md:w-auto md:h-auto rounded-full md:rounded-lg" do %>
|
||||
<div class="flex items-center justify-center w-5 h-5">
|
||||
|
||||
<%= lucide_icon("plus")%>
|
||||
<%= lucide_icon("plus") %>
|
||||
</div>
|
||||
<p class="hidden md:block text-sm font-medium"><%= t(".new_account") %></p>
|
||||
<% end %>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<%# locals: (budget:) %>
|
||||
|
||||
<div>
|
||||
<div class="p-4 border-b border-gray-100">
|
||||
<div class="p-4 border-b border-secondary">
|
||||
<h3 class="text-sm text-secondary mb-2">Income</h3>
|
||||
|
||||
<span class="inline-block mb-2 text-xl font-medium text-primary">
|
||||
|
|
|
|||
|
|
@ -31,7 +31,7 @@
|
|||
</div>
|
||||
<% end %>
|
||||
|
||||
<hr class="border border-secondary w-12 group-last:hidden" />
|
||||
<hr class="border border-secondary w-12 group-last:hidden">
|
||||
</li>
|
||||
<% end %>
|
||||
</ul>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<%# locals: (budget:) %>
|
||||
|
||||
<div>
|
||||
<div class="p-4 border-b border-gray-100">
|
||||
<div class="p-4 border-b border-secondary">
|
||||
<h3 class="text-sm text-secondary mb-2">Expected income</h3>
|
||||
|
||||
<span class="inline-block mb-2 text-xl font-medium text-primary">
|
||||
|
|
|
|||
|
|
@ -1,6 +1,5 @@
|
|||
<%# locals: (import:, mapping_class:, step_idx:) %>
|
||||
|
||||
|
||||
<% mappings = mapping_class.for_import(import) %>
|
||||
<% is_last_step = step_idx == import.mapping_steps.count - 1 %>
|
||||
|
||||
|
|
|
|||
|
|
@ -26,20 +26,20 @@
|
|||
"focus:outline-none focus:z-10 relative",
|
||||
],
|
||||
disabled: row.import.complete? %>
|
||||
|
||||
|
||||
<% if !cell_is_valid?(row, key) %>
|
||||
<span class="absolute right-2 top-1/2 -translate-y-1/2 text-red-500 md:hidden"
|
||||
<span class="absolute right-2 top-1/2 -translate-y-1/2 text-red-500 md:hidden"
|
||||
data-action="click->mobile-cell-interaction#toggleErrorMessage"
|
||||
data-mobile-cell-interaction-target="errorIcon">
|
||||
<%= lucide_icon "alert-circle", class: "w-4 h-4" %>
|
||||
</span>
|
||||
|
||||
|
||||
<div class="absolute left-4 right-4 bottom-full mb-2 p-2 bg-red-50 border border-red-200 rounded-lg shadow-lg text-xs text-red-600 hidden md:hidden z-20"
|
||||
data-mobile-cell-interaction-target="errorTooltip">
|
||||
<%= row.errors[key].join(", ") %>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
|
||||
<div class="absolute inset-0 bg-primary/5 pointer-events-none opacity-0 transition-opacity duration-150 ease-in-out z-0" data-mobile-cell-interaction-target="highlight"></div>
|
||||
</div>
|
||||
<% end %>
|
||||
|
|
|
|||
|
|
@ -11,9 +11,9 @@
|
|||
<p class="text-secondary text-sm"><%= t(".description") %></p>
|
||||
</div>
|
||||
|
||||
<div
|
||||
data-controller="tabs"
|
||||
data-tabs-active-class="bg-surface shadow-sm text-primary"
|
||||
<div
|
||||
data-controller="tabs"
|
||||
data-tabs-active-class="bg-surface shadow-sm text-primary"
|
||||
data-tabs-inactive-class="text-secondary"
|
||||
data-tabs-default-tab-value="csv-upload-tab">
|
||||
<div class="flex justify-center mb-4 w-full">
|
||||
|
|
@ -47,12 +47,12 @@
|
|||
<span class="font-medium text-primary">Browse</span> to add your CSV file here
|
||||
</p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="flex flex-col items-center hidden" data-file-upload-target="fileName">
|
||||
<%= lucide_icon("file-text", class: "w-6 h-6 mb-4 text-primary") %>
|
||||
<p class="mb-2 text-md font-medium text-primary"></p>
|
||||
</div>
|
||||
|
||||
|
||||
<%= form.file_field :csv_file, class: "hidden", "data-auto-submit-form-target": "auto", "data-file-upload-target": "input" %>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -72,5 +72,4 @@
|
|||
</span>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -43,7 +43,7 @@
|
|||
</div>
|
||||
<% end %>
|
||||
|
||||
<hr class="border border-secondary w-12 group-last:hidden" />
|
||||
<hr class="border border-secondary w-12 group-last:hidden">
|
||||
</li>
|
||||
<% end %>
|
||||
</ul>
|
||||
|
|
|
|||
|
|
@ -16,9 +16,9 @@
|
|||
<% headers.each_with_index do |header, index| %>
|
||||
<th class="
|
||||
bg-container-inset px-3 py-2.5 font-medium text-left whitespace-nowrap
|
||||
<%= index == 0 ? 'rounded-tl-md' : '' %>
|
||||
<%= index == headers.length - 1 ? 'rounded-tr-md' : '' %>
|
||||
<%= index < headers.length - 1 ? 'border-r border-r-alpha-black-200' : '' %>
|
||||
<%= index == 0 ? "rounded-tl-md" : "" %>
|
||||
<%= index == headers.length - 1 ? "rounded-tr-md" : "" %>
|
||||
<%= index < headers.length - 1 ? "border-r border-r-alpha-black-200" : "" %>
|
||||
">
|
||||
<%= header %>
|
||||
</th>
|
||||
|
|
@ -31,9 +31,9 @@
|
|||
<% row.each_with_index do |(header, value), col_index| %>
|
||||
<td class="
|
||||
px-3 py-2.5 whitespace-nowrap text-left
|
||||
<%= col_index < row.length - 1 ? 'border-r border-r-alpha-black-200' : '' %>
|
||||
<%= !caption && row_index == rows.length - 1 && col_index == 0 ? 'rounded-bl-md' : '' %>
|
||||
<%= !caption && row_index == rows.length - 1 && col_index == row.length - 1 ? 'rounded-br-md' : '' %>
|
||||
<%= col_index < row.length - 1 ? "border-r border-r-alpha-black-200" : "" %>
|
||||
<%= !caption && row_index == rows.length - 1 && col_index == 0 ? "rounded-bl-md" : "" %>
|
||||
<%= !caption && row_index == rows.length - 1 && col_index == row.length - 1 ? "rounded-br-md" : "" %>
|
||||
">
|
||||
<%= value %>
|
||||
</td>
|
||||
|
|
|
|||
|
|
@ -13,11 +13,11 @@
|
|||
<% if (controller_name == "sessions" && action_name == "new") || (controller_name == "registrations" && action_name == "new") %>
|
||||
<div class="space-y-3 md:hidden w-full my-4">
|
||||
<div class="bg-surface-inset rounded-lg p-1 flex">
|
||||
<%= link_to new_session_path,
|
||||
<%= link_to new_session_path,
|
||||
class: "w-1/2 px-2 py-1 rounded-md text-sm text-center font-medium #{current_page?(new_session_path) ? 'bg-surface shadow-sm text-primary' : 'text-secondary'}" do %>
|
||||
<%= t("layouts.auth.sign_in") %>
|
||||
<% end %>
|
||||
<%= link_to new_registration_path,
|
||||
<%= link_to new_registration_path,
|
||||
class: "w-1/2 px-2 py-1 rounded-md text-sm text-center font-medium #{!current_page?(new_session_path) ? 'bg-surface shadow-sm text-primary' : 'text-secondary'}" do %>
|
||||
<%= t("layouts.auth.sign_up") %>
|
||||
<% end %>
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@
|
|||
<%= javascript_importmap_tags %>
|
||||
<%= turbo_refreshes_with method: :morph, scroll: :preserve %>
|
||||
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, viewport-fit=cover" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, viewport-fit=cover">
|
||||
|
||||
<meta name="mobile-web-app-capable" content="yes">
|
||||
<meta name="apple-mobile-web-app-capable" content="yes">
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<%= render "layouts/shared/htmldoc" do %>
|
||||
<div class="bg-primary-adaptive flex flex-col h-dvh pt-safe">
|
||||
<div class="bg-container flex flex-col h-dvh pt-safe">
|
||||
<header class="flex items-center justify-between p-8">
|
||||
<%= link_to content_for(:previous_path) || root_path do %>
|
||||
<%= lucide_icon "arrow-left", class: "w-5 h-5 text-secondary" %>
|
||||
|
|
|
|||
|
|
@ -32,4 +32,4 @@
|
|||
<% end %>
|
||||
|
||||
<p class="text-xs text-secondary">AI responses are informational only and are not financial advice.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
<h1 class="text-3xl font-medium text-primary">Welcome back, <%= Current.user.first_name %></h1>
|
||||
<p class="text-gray-500">Here's what's happening with your finances</p>
|
||||
</div>
|
||||
|
||||
|
||||
<%= link_to new_account_path(step: "method_select", classification: "asset"),
|
||||
class: "btn btn--primary flex items-center justify-center gap-2 rounded-full w-9 h-9 md:hidden",
|
||||
data: { turbo_frame: "modal" } do %>
|
||||
|
|
|
|||
|
|
@ -55,7 +55,7 @@
|
|||
<div class="flex sm:hidden items-center gap-2">
|
||||
<div class="flex gap-[3px]">
|
||||
<% 10.times do |i| %>
|
||||
<div class="w-[2px] h-[10px] rounded-lg <%= i < (account_group.weight / 10.0).ceil ? '' : 'opacity-20' %>" style="background-color: <%= account_group.color %>;"></div>
|
||||
<div class="w-[2px] h-[10px] rounded-lg <%= i < (account_group.weight / 10.0).ceil ? "" : "opacity-20" %>" style="background-color: <%= account_group.color %>;"></div>
|
||||
<% end %>
|
||||
</div>
|
||||
<p class="text-sm"><%= number_to_percentage(account_group.weight, precision: 2) %></p>
|
||||
|
|
@ -85,7 +85,7 @@
|
|||
<div class="flex sm:hidden items-center gap-2">
|
||||
<div class="flex gap-[3px]">
|
||||
<% 10.times do |i| %>
|
||||
<div class="w-[2px] h-[10px] rounded-lg <%= i < (account.weight / 10.0).ceil ? '' : 'opacity-20' %>" style="background-color: <%= account_group.color %>;"></div>
|
||||
<div class="w-[2px] h-[10px] rounded-lg <%= i < (account.weight / 10.0).ceil ? "" : "opacity-20" %>" style="background-color: <%= account_group.color %>;"></div>
|
||||
<% end %>
|
||||
</div>
|
||||
<p class="text-sm"><%= number_to_percentage(account.weight, precision: 2) %></p>
|
||||
|
|
|
|||
|
|
@ -32,28 +32,28 @@
|
|||
placeholder: "you@example.com",
|
||||
label: true,
|
||||
disabled: @invitation.present? %>
|
||||
|
||||
|
||||
<% if invite_code_required? && !@invitation %>
|
||||
<%= form.text_field :invite_code, required: "required", label: true, value: params[:invite] %>
|
||||
<% end %>
|
||||
|
||||
|
||||
<%= form.hidden_field :invitation, value: @invitation&.token %>
|
||||
|
||||
|
||||
<div data-controller="password-validator">
|
||||
<div data-controller="password-visibility" class="relative">
|
||||
<%= form.password_field :password,
|
||||
autocomplete: "new-password",
|
||||
required: "required",
|
||||
<%= form.password_field :password,
|
||||
autocomplete: "new-password",
|
||||
required: "required",
|
||||
placeholder: t(".password_placeholder"),
|
||||
label: true,
|
||||
label: true,
|
||||
maxlength: 72,
|
||||
data: {
|
||||
data: {
|
||||
password_validator_target: "input",
|
||||
password_visibility_target: "input",
|
||||
action: "input->password-validator#validate"
|
||||
} %>
|
||||
<button type="button"
|
||||
class="absolute right-3 top-1/2 -translate-y-1/2 text-gray-500 hover:text-gray-700 focus:outline-none"
|
||||
<button type="button"
|
||||
class="absolute right-3 top-1/2 -translate-y-1/2 text-gray-500 hover:text-gray-700 focus:outline-none"
|
||||
data-action="click->password-visibility#toggle">
|
||||
<div data-password-visibility-target="showIcon">
|
||||
<%= lucide_icon "eye", class: "w-5 h-5 text-gray" %>
|
||||
|
|
@ -63,14 +63,14 @@
|
|||
</div>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="flex gap-4 my-4">
|
||||
<div class="h-1 bg-gray-200 rounded-full flex-grow" data-password-validator-target="blockLine" data-requirement-type="length"></div>
|
||||
<div class="h-1 bg-gray-200 rounded-full flex-grow" data-password-validator-target="blockLine" data-requirement-type="case"></div>
|
||||
<div class="h-1 bg-gray-200 rounded-full flex-grow" data-password-validator-target="blockLine" data-requirement-type="number"></div>
|
||||
<div class="h-1 bg-gray-200 rounded-full flex-grow" data-password-validator-target="blockLine" data-requirement-type="special"></div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="space-y-1 my-4">
|
||||
<div class="flex items-center gap-2 text-secondary text-sm" data-password-validator-target="requirementType" data-requirement-type="length">
|
||||
<%= lucide_icon "check", class: "w-4 h-4" %>
|
||||
|
|
@ -90,8 +90,6 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<%= form.submit t(".submit") %>
|
||||
<% end %>
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@
|
|||
<%= form.select :action_type, rule.action_executors.map { |executor| [ executor.label, executor.key ] }, {}, data: { action: "rule--actions#handleActionTypeChange" } %>
|
||||
</div>
|
||||
|
||||
<%= tag.div class: class_names("min-w-1/2 flex items-center gap-2", "hidden" => !needs_value),
|
||||
<%= tag.div class: class_names("min-w-1/2 flex items-center gap-2", "hidden" => !needs_value),
|
||||
data: { rule__actions_target: "actionValue" } do %>
|
||||
<span class="font-medium uppercase text-xs">to</span>
|
||||
<%= form.select :value, action.options || [], {}, disabled: !needs_value %>
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@
|
|||
<%= form.hidden_field :_destroy, value: false, data: { rule__conditions_target: "destroyField" } %>
|
||||
|
||||
<div class="w-2/5 shrink-0">
|
||||
<%= form.select :condition_type, rule.condition_filters.map { |filter| [ filter.label, filter.key ] }, {}, data: { action: "rule--conditions#handleConditionTypeChange" } %>
|
||||
<%= form.select :condition_type, rule.condition_filters.map { |filter| [ filter.label, filter.key ] }, {}, data: { action: "rule--conditions#handleConditionTypeChange" } %>
|
||||
</div>
|
||||
|
||||
<%= form.select :operator, condition.operators, { container_class: "w-fit min-w-36" }, data: { rule__conditions_target: "operatorSelect" } %>
|
||||
|
|
|
|||
|
|
@ -17,4 +17,4 @@
|
|||
<%= tag.a "Create rule", href: new_rule_path(resource_type: "transaction", action_type: "set_transaction_category", action_value: cta[:category_id]), class: "btn btn--primary", data: { turbo_frame: "modal" } %>
|
||||
<% end %>
|
||||
<% end %>
|
||||
<% end %>
|
||||
<% end %>
|
||||
|
|
|
|||
|
|
@ -22,7 +22,7 @@
|
|||
<span class="px-2 py-1 border border-alpha-black-200 rounded-full">
|
||||
<% if rule.actions.first.value && rule.actions.first.options %>
|
||||
<%= rule.actions.first.executor.label %> to <%= rule.actions.first.value_display %>
|
||||
<% else%>
|
||||
<% else %>
|
||||
<%= rule.actions.first.executor.label %>
|
||||
<% end %>
|
||||
</span>
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@
|
|||
</div>
|
||||
<div class="text-secondary text-sm">
|
||||
<p>
|
||||
You are about to apply this rule to
|
||||
You are about to apply this rule to
|
||||
<span class="text-primary font-medium"><%= @rule.affected_resource_count %> <%= @rule.resource_type.pluralize %></span>
|
||||
that meet the specified rule criteria. Please confirm if you wish to proceed with this change.
|
||||
</p>
|
||||
|
|
@ -17,4 +17,4 @@
|
|||
</div>
|
||||
<%= button_to "Confirm changes", apply_rule_path(@rule), class: "btn btn--primary w-full justify-center", data: { turbo_frame: "_top"} %>
|
||||
</div>
|
||||
<% end %>
|
||||
<% end %>
|
||||
|
|
|
|||
|
|
@ -89,7 +89,7 @@
|
|||
<% end %>
|
||||
</section>
|
||||
</nav>
|
||||
<nav class="space-y-4 overflow-y-auto md:hidden" id="mobile-settings-nav" data-preserve-scroll data-controller="preserve-scroll">
|
||||
<nav class="space-y-4 overflow-y-auto md:hidden" id="mobile-settings-nav" data-preserve-scroll data-controller="preserve-scroll">
|
||||
|
||||
<ul class="flex space-y-1">
|
||||
|
||||
|
|
|
|||
|
|
@ -48,9 +48,8 @@
|
|||
</span>
|
||||
<% end %>
|
||||
|
||||
|
||||
<p class="mt-2 text-xs text-secondary"><%= t(".accepted_formats") %></p>
|
||||
|
||||
|
||||
<%= form.file_field :profile_image,
|
||||
accept: "image/png, image/jpeg",
|
||||
class: "hidden px-3 py-2 bg-gray-50 text-primary rounded-md text-sm font-medium",
|
||||
|
|
|
|||
|
|
@ -3,4 +3,4 @@
|
|||
<% size_class = case size when "sm" then "w-4 h-4" when "md" then "w-5 h-5" when "lg" then "w-6 h-6" end %>
|
||||
<% color_class = case color when "current" then "text-current" when "gray" then "text-secondary" end %>
|
||||
|
||||
<%= image_tag("icon-#{key}.svg", class: class_names(size_class, color_class, "shrink-0"), alt: key )%>
|
||||
<%= image_tag("icon-#{key}.svg", class: class_names(size_class, color_class, "shrink-0"), alt: key ) %>
|
||||
|
|
|
|||
|
|
@ -20,4 +20,4 @@
|
|||
<span class="text-sm text-secondary">
|
||||
<%= I18n.l(entry.date, format: :long) %>
|
||||
</span>
|
||||
<% end %>
|
||||
<% end %>
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
|
||||
<%= turbo_frame_tag dom_id(entry) do %>
|
||||
<%= turbo_frame_tag dom_id(transaction) do %>
|
||||
<div class="grid grid-cols-12 items-center text-primary text-sm font-medium p-4 md:p-4
|
||||
<div class="grid grid-cols-12 items-center text-primary text-sm font-medium p-4 md:p-4
|
||||
<%= @focused_record == entry || @focused_record == transaction ?
|
||||
"border border-gray-900 rounded-lg" : "" %>">
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue