Replace text-tertiary with text-subdued in views (#999)

* Replace text-tertiary with text-subdued in views

Replace usages of the text-tertiary utility with text-subdued across several view partials to standardize subdued text styling because text-tertiary does not exist in the design system (reports, doorkeeper auth, simplefin items). Also adjust the net worth empty-liabilities markup to use a grid layout for consistent spacing, and update the related controller test selector to match the new CSS class.

* Standardize empty net worth message markup

Replace inconsistent markup and classes for empty asset/liability sections in the net worth partial. Swap text-secondary/p-2/text-center for text-subdued with unified padding (py-3 px-4 lg:px-6), and simplify the liabilities block from a grid/div to a single paragraph for consistent styling and spacing.

app/views/doorkeeper/authorizations/new.html.erb

@@ -70,7 +70,7 @@
     <% end %>
   </div>
 
-  <p class="text-xs text-tertiary text-center">
+  <p class="text-xs text-subdued text-center">
     By authorizing, you allow this app to access your <%= product_name %> data according to the permissions above.
   </p>
 </div>

app/views/reports/_budget_performance.html.erb

@@ -3,7 +3,7 @@
     <h2 class="text-lg font-medium text-primary">
       <%= t("reports.budget_performance.title") %>
     </h2>
-    <p class="text-sm text-tertiary">
+    <p class="text-sm text-subdued">
       <%= start_date.strftime("%B %Y") %>
     </p>
   </div>
@@ -62,13 +62,13 @@
           <div class="flex items-center justify-between text-sm">
             <div class="flex items-center gap-4">
               <div>
-                <span class="text-tertiary"><%= t("reports.budget_performance.spent") %>:</span>
+                <span class="text-subdued"><%= t("reports.budget_performance.spent") %>:</span>
                 <span class="font-medium text-primary">
                   <%= Money.new(budget_item[:actual], Current.family.currency).format %>
                 </span>
               </div>
               <div>
-                <span class="text-tertiary"><%= t("reports.budget_performance.budgeted") %>:</span>
+                <span class="text-subdued"><%= t("reports.budget_performance.budgeted") %>:</span>
                 <span class="font-medium text-secondary">
                   <%= Money.new(budget_item[:budgeted], Current.family.currency).format %>
                 </span>
@@ -77,12 +77,12 @@
 
             <div>
               <% if budget_item[:remaining] >= 0 %>
-                <span class="text-tertiary"><%= t("reports.budget_performance.remaining") %>:</span>
+                <span class="text-subdued"><%= t("reports.budget_performance.remaining") %>:</span>
                 <span class="font-medium text-success">
                   <%= Money.new(budget_item[:remaining], Current.family.currency).format %>
                 </span>
               <% else %>
-                <span class="text-tertiary"><%= t("reports.budget_performance.over_by") %>:</span>
+                <span class="text-subdued"><%= t("reports.budget_performance.over_by") %>:</span>
                 <span class="font-medium text-destructive">
                   <%= Money.new(budget_item[:remaining].abs, Current.family.currency).format %>
                 </span>
@@ -95,7 +95,7 @@
             <% days_remaining = (start_date.end_of_month - Date.current).to_i + 1 %>
             <% if days_remaining > 0 %>
               <div class="mt-3 pt-3 border-t border-tertiary">
-                <p class="text-xs text-tertiary">
+                <p class="text-xs text-subdued">
                   <%= t("reports.budget_performance.suggested_daily",
                         amount: Money.new((budget_item[:remaining] / days_remaining), Current.family.currency).format,
                         days: days_remaining) %>
@@ -108,8 +108,8 @@
     </div>
   <% else %>
     <div class="text-center py-12">
-      <%= icon("gauge", class: "w-12 h-12 text-tertiary mx-auto mb-4") %>
+      <%= icon("gauge", class: "w-12 h-12 text-subdued mx-auto mb-4") %>
-      <p class="text-tertiary">
+      <p class="text-subdued">
         <%= t("reports.budget_performance.no_budgets") %>
       </p>
     </div>

app/views/reports/_category_row.html.erb

@@ -31,7 +31,7 @@
     <span class="font-medium text-primary">
       <%= item[:category_name] %>
     </span>
-    <span class="text-xs text-tertiary whitespace-nowrap">
+    <span class="text-xs text-subdued whitespace-nowrap">
       (<%= t("reports.transactions_breakdown.table.entries", count: item[:count]) %>)
     </span>
   </div>

app/views/reports/_empty_state.html.erb

@@ -1,5 +1,5 @@
 <div class="bg-container rounded-xl shadow-border-xs p-12 text-center">
-  <%= icon("chart-bar", class: "w-16 h-16 text-tertiary mx-auto mb-6") %>
+  <%= icon("chart-bar", class: "w-16 h-16 text-subdued mx-auto mb-6") %>
 
   <h3 class="text-xl font-medium text-primary mb-3">
     <%= t("reports.empty_state.title") %>

app/views/reports/_net_worth.html.erb

@@ -21,7 +21,7 @@
           <%= trend.value >= 0 ? "+" : "" %><%= trend.percent_formatted %>
         </p>
       <% else %>
-        <p class="text-2xl font-semibold mb-1 text-tertiary">--</p>
+        <p class="text-2xl font-semibold mb-1 text-subdued">--</p>
       <% end %>
     </div>
 
@@ -30,7 +30,7 @@
       <p class="text-sm text-secondary mb-2"><%= t("reports.net_worth.assets_vs_liabilities") %></p>
       <div class="flex items-baseline gap-2 flex-wrap">
         <span class="text-lg font-semibold text-success break-words"><%= net_worth_metrics[:total_assets].format %></span>
-        <span class="text-xs text-tertiary shrink-0">-</span>
+        <span class="text-xs text-subdued shrink-0">-</span>
         <span class="text-lg font-semibold text-destructive break-words"><%= net_worth_metrics[:total_liabilities].format %></span>
       </div>
     </div>
@@ -54,7 +54,7 @@
           <% end %>
         <% end %>
         <% if net_worth_metrics[:asset_groups].empty? %>
-          <p class="text-sm text-secondary p-2 text-center"><%= t("reports.net_worth.no_assets") %></p>
+          <p class="text-sm text-subdued py-3 px-4 lg:px-6"><%= t("reports.net_worth.no_assets") %></p>
         <% end %>
       </div>
     </div>
@@ -75,7 +75,7 @@
           <% end %>
         <% end %>
         <% if net_worth_metrics[:liability_groups].empty? %>
-          <p class="text-sm text-tertiary py-2"><%= t("reports.net_worth.no_liabilities") %></p>
+          <p class="text-sm text-subdued py-3 px-4 lg:px-6"><%= t("reports.net_worth.no_liabilities") %></p>
         <% end %>
       </div>
     </div>

app/views/reports/_summary_dashboard.html.erb

@@ -28,7 +28,7 @@
               <%= metrics[:income_change] %>%
             </span>
           <% end %>
-          <span class="text-sm text-tertiary">
+          <span class="text-sm text-subdued">
             <%= t("reports.summary.vs_previous") %>
           </span>
         </div>
@@ -65,7 +65,7 @@
               <%= metrics[:expense_change] %>%
             </span>
           <% end %>
-          <span class="text-sm text-tertiary">
+          <span class="text-sm text-subdued">
             <%= t("reports.summary.vs_previous") %>
           </span>
         </div>
@@ -89,7 +89,7 @@
         <%= metrics[:net_savings].format %>
       </p>
 
-      <p class="text-sm text-tertiary">
+      <p class="text-sm text-subdued">
         <%= t("reports.summary.income_minus_expenses") %>
       </p>
     </div>
@@ -118,12 +118,12 @@
                  style="width: <%= [metrics[:budget_percent], 100].min %>%"></div>
           </div>
 
-          <p class="text-sm text-tertiary">
+          <p class="text-sm text-subdued">
             <%= t("reports.summary.of_budget_used") %>
           </p>
         </div>
       <% else %>
-        <p class="text-base text-tertiary">
+        <p class="text-base text-subdued">
           <%= t("reports.summary.no_budget_data") %>
         </p>
       <% end %>

app/views/reports/_trends_insights.html.erb

@@ -21,7 +21,7 @@
                   <div class="flex items-center gap-2 <%= trend[:is_current_month] ? "font-medium" : "" %>">
                     <%= trend[:month] %>
                     <% if trend[:is_current_month] %>
-                      <span class="text-xs text-tertiary">(<%= t("reports.trends.current") %>)</span>
+                      <span class="text-xs text-subdued">(<%= t("reports.trends.current") %>)</span>
                     <% end %>
                   </div>
                   <div class="text-right">
@@ -74,7 +74,7 @@
           </div>
         </div>
       <% else %>
-        <div class="text-center py-8 text-tertiary">
+        <div class="text-center py-8 text-subdued">
           <%= t("reports.trends.no_data") %>
         </div>
       <% end %>

app/views/simplefin_items/_simplefin_item.html.erb

@@ -98,10 +98,10 @@
               <div class="flex items-center gap-1">
                 <%= icon "clock", size: "sm", color: "secondary" %>
                 <%= tag.span pending_status[:message], class: "text-sm" %>
-                <span class="text-xs text-tertiary"><%= t(".stale_pending_note") %></span>
+                <span class="text-xs text-subdued"><%= t(".stale_pending_note") %></span>
               </div>
               <% if pending_status[:accounts]&.any? %>
-                <div class="text-xs text-tertiary ml-5">
+                <div class="text-xs text-subdued ml-5">
                   <%= t(".stale_pending_accounts", accounts: pending_status[:accounts].join(", ")) %>
                 </div>
               <% end %>
@@ -110,7 +110,7 @@
             <div class="text-success flex items-center gap-1">
               <%= icon "check-circle", size: "sm", color: "success" %>
               <%= tag.span reconciled_status[:message], class: "text-sm" %>
-              <span class="text-xs text-tertiary"><%= t(".reconciled_details_note") %></span>
+              <span class="text-xs text-subdued"><%= t(".reconciled_details_note") %></span>
             </div>
           <% elsif simplefin_item.rate_limited_message.present? %>
             <div class="text-warning flex items-center gap-1">

test/controllers/reports_controller_test.rb

@@ -158,7 +158,7 @@ class ReportsControllerTest < ActionDispatch::IntegrationTest
     assert_response :ok
 
     # Verify spending patterns shows data (not the "no data" message)
-    assert_select ".text-center.py-8.text-tertiary", { text: /No spending data/, count: 0 }, "Should not show 'No spending data' message when transactions exist"
+    assert_select ".text-center.py-8.text-subdued", { text: /No spending data/, count: 0 }, "Should not show 'No spending data' message when transactions exist"
   end
 
   test "export transactions with API key authentication" do