Standardize & improve a bunch of corners, fix some backgrounds, fix merchants for dark mode

app/views/accounts/index/_account_groups.erb

@@ -8,7 +8,7 @@
       <p><%= accounts.count %></p>
       <p class="ml-auto"><%= totals_by_currency(collection: accounts, money_method: :balance_money) %></p>
     </div>
-    <div class="bg-container">
+    <div class="bg-container rounded-lg shadow-border-xs">
       <% accounts.each do |account| %>
         <%= render account %>
       <% end %>

app/views/accounts/show/_activity.html.erb

@@ -75,16 +75,14 @@
         </div>
 
         <div>
-          <div class="rounded-tl-lg rounded-tr-lg bg-container border-alpha-black-25 shadow-xs">
-            <div class="space-y-4">
-              <% calculator = Balance::TrendCalculator.new(@account.balances) %>
+          <div class="space-y-4">
+            <% calculator = Balance::TrendCalculator.new(@account.balances) %>
 
-              <%= entries_by_date(@entries) do |entries| %>
-                <% entries.each_with_index do |entry, index| %>
-                  <%= render entry, balance_trend: index == 0 ? calculator.trend_for(entry.date) : nil, view_ctx: "account" %>
-                <% end %>
+            <%= entries_by_date(@entries) do |entries| %>
+              <% entries.each_with_index do |entry, index| %>
+                <%= render entry, balance_trend: index == 0 ? calculator.trend_for(entry.date) : nil, view_ctx: "account" %>
               <% end %>
-            </div>
+            <% end %>
           </div>
 
           <div class="p-4 bg-container rounded-bl-lg rounded-br-lg">

app/views/categories/_category_list_group.html.erb

@@ -7,8 +7,8 @@
     <p><%= categories.count %></p>
   </div>
 
-  <div class="shadow-border-xs rounded-md bg-container">
-    <div class="overflow-hidden rounded-md">
+  <div class="shadow-border-xs rounded-lg bg-container">
+    <div class="overflow-hidden rounded-lg">
       <% Category::Group.for(categories).each_with_index do |group, idx| %>
         <%= render group.category %>
 

app/views/entries/_entry_group.html.erb

@@ -21,7 +21,7 @@
       </div>
     <% end %>
   </div>
-  <div class="bg-container shadow-border-xs rounded-md divide-y divide-alpha-black-50">
+  <div class="bg-container shadow-border-xs rounded-lg">
     <%= content %>
   </div>
 </div>

app/views/family_merchants/_family_merchant.html.erb

@@ -1,6 +1,6 @@
 <%# locals: (family_merchant:) %>
 
-<div class="flex justify-between items-center p-4 bg-white">
+<div class="flex justify-between items-center p-4 bg-container">
   <div class="flex w-full items-center gap-2.5">
     <% if family_merchant.logo_url %>
       <div class="w-8 h-8 rounded-full flex justify-center items-center">

app/views/family_merchants/index.html.erb

@@ -18,8 +18,8 @@
         <p><%= @merchants.count %></p>
       </div>
 
-      <div class="border border-alpha-black-25 rounded-md bg-container shadow-border-xs">
-        <div class="overflow-hidden rounded-md">
+      <div class="border border-alpha-black-25 rounded-lg bg-container shadow-border-xs">
+        <div class="overflow-hidden rounded-lg">
           <%= render partial: "family_merchants/family_merchant", collection: @merchants, spacer_template: "shared/ruler" %>
         </div>
       </div>

app/views/pages/dashboard/_balance_sheet.html.erb

@@ -27,6 +27,7 @@
               <div class="flex items-center gap-2 text-sm">
                 <div class="h-2.5 w-2.5 rounded-full" style="background-color: <%= account_group.color %>;"></div>
                 <p class="text-secondary"><%= account_group.name %></p>
+                <span class="text-secondary">&middot;</span>
                 <p class="text-primary font-mono"><%= number_to_percentage(account_group.weight, precision: 0) %></p>
               </div>
             <% end %>
@@ -46,10 +47,10 @@
             </div>
           </div>
 
-          <div class="shadow-border-xs rounded-lg bg-container min-w-fit">
+          <div class="shadow-border-xs rounded-lg font-medium text-sm bg-container min-w-fit">
             <% classification_group.account_groups.each do |account_group| %>
-              <details class="group rounded-lg open:bg-surface font-medium text-sm">
-                <summary class="focus-visible:outline-none focus-visible:ring-0 cursor-pointer p-4 group-open:bg-surface bg-container rounded-lg flex items-center justify-between">
+              <details class="group">
+                <summary class="cursor-pointer p-4 group-open:bg-surface 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") %>
 
@@ -69,7 +70,7 @@
 
                 <div>
                   <% account_group.accounts.each_with_index do |account, idx| %>
-                    <div class="pl-12 pr-4 py-3 flex items-center justify-between text-sm font-medium">
+                    <div class="pl-12 pr-4 py-3 flex items-center bg-container justify-between text-sm font-medium">
                       <div class="flex items-center gap-3">
                         <%= render "accounts/logo", account: account, size: "sm", color: account_group.color %>
 

app/views/rules/index.html.erb

@@ -58,7 +58,7 @@
         </div>
       </div>
       <div class="p-1">
-        <div class="flex flex-col bg-container rounded-xl shadow-border-xs first_child:rounded-t-xl last_child:rounded-b-xl">
+        <div class="flex flex-col bg-container rounded-lg shadow-border-xs rounded-lg">
           <%= render partial: "rule", collection: @rules, spacer_template: "shared/ruler" %>
         </div>
       </div>

app/views/settings/profiles/show.html.erb

@@ -41,7 +41,7 @@
         <p class="uppercase text-xs text-secondary font-medium"><%= Current.family.name %> &middot; <%= Current.family.users.size %></p>
       </div>
       <% @users.each do |user| %>
-        <div class="flex gap-2 mt-2 items-center bg-container p-4 border border-alpha-black-25 rounded-lg">
+        <div class="flex gap-2 mt-2 items-center bg-container p-4 shadow-border-xs rounded-lg">
           <div class="w-9 h-9 shrink-0">
             <%= render "settings/user_avatar", avatar_url: user.profile_image&.variant(:small)&.url, initials: user.initials %>
           </div>

app/views/tags/index.html.erb

@@ -33,8 +33,8 @@
         <p><%= @tags.count %></p>
       </div>
 
-      <div class="border border-alpha-black-25 rounded-md bg-container shadow-border-xs">
-        <div class="overflow-hidden rounded-md">
+      <div class="border border-alpha-black-25 rounded-lg bg-container shadow-border-xs">
+        <div class="overflow-hidden rounded-lg">
           <%= render partial: @tags, spacer_template: "shared/ruler" %>
         </div>
       </div>