From fdf41c016a335bafd53b5077d5d14bff3fb50313 Mon Sep 17 00:00:00 2001
From: padreug <padreug@aiolabs.dev>
Date: Sun, 22 Jun 2025 16:08:22 +0200
Subject: [PATCH] Update dashboard card styles: Change background colors and
 text classes for current value and unrealized gain/loss sections to enhance
 visual clarity and user experience.

---
 templates/satmachineclient/index.html | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/templates/satmachineclient/index.html b/templates/satmachineclient/index.html
index e3256a2..b0d9cd9 100644
--- a/templates/satmachineclient/index.html
+++ b/templates/satmachineclient/index.html
@@ -60,22 +60,22 @@
           <!-- Current Value Row -->
           <div class="row q-col-gutter-md q-mt-sm">
             <div class="col-12 col-md-6">
-              <q-card flat class="bg-green-1">
+              <q-card flat class="bg-orange-1">
                 <q-card-section class="text-center">
-                  <div class="text-h5 text-green-8">${formatCurrencyWithCode(dashboardData.current_sats_fiat_value, dashboardData.currency)}</div>
-                  <div class="text-caption text-green-7">Current Value of Bitcoin Holdings</div>
+                  <div class="text-h5 text-orange-8">${formatCurrencyWithCode(dashboardData.current_sats_fiat_value, dashboardData.currency)}</div>
+                  <div class="text-caption text-orange-7">Current Value of Bitcoin Holdings</div>
                   <div class="text-caption text-grey">at today's ${dashboardData.currency} exchange rate</div>
                 </q-card-section>
               </q-card>
             </div>
             <div class="col-12 col-md-6">
-              <q-card flat class="bg-blue-1">
+              <q-card flat :class="(dashboardData.current_sats_fiat_value + dashboardData.current_fiat_balance) > dashboardData.total_fiat_invested ? 'bg-green-1' : 'bg-red-1'">
                 <q-card-section class="text-center">
-                  <div class="text-h6 text-blue-8">
+                  <div class="text-h6" :class="(dashboardData.current_sats_fiat_value + dashboardData.current_fiat_balance) > dashboardData.total_fiat_invested ? 'text-green-8' : 'text-red-8'">
                     ${(dashboardData.current_sats_fiat_value + dashboardData.current_fiat_balance) > dashboardData.total_fiat_invested ? '+' : ''}
                     ${formatCurrencyWithCode((dashboardData.current_sats_fiat_value + dashboardData.current_fiat_balance) - dashboardData.total_fiat_invested, dashboardData.currency)}
                   </div>
-                  <div class="text-caption text-blue-7">
+                  <div class="text-caption" :class="(dashboardData.current_sats_fiat_value + dashboardData.current_fiat_balance) > dashboardData.total_fiat_invested ? 'text-green-7' : 'text-red-7'">
                     ${(dashboardData.current_sats_fiat_value + dashboardData.current_fiat_balance) > dashboardData.total_fiat_invested ? 'Unrealized Gain' : 'Unrealized Loss'}
                   </div>
                   <div class="text-caption text-grey">vs total invested</div>