From 5ccae73f8a5ebeaf9220fdd9fad9eebbcff3013d Mon Sep 17 00:00:00 2001
From: Shivam Mishra <scm.mymail@gmail.com>
Date: Wed, 29 Jan 2025 03:20:50 +0530
Subject: [PATCH] fix: Update captain billing colors (#10782)

---
 .../dashboard/routes/dashboard/settings/billing/Index.vue       | 2 +-
 .../dashboard/settings/billing/components/BillingCard.vue       | 2 +-
 .../dashboard/settings/billing/components/BillingMeter.vue      | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/app/javascript/dashboard/routes/dashboard/settings/billing/Index.vue b/app/javascript/dashboard/routes/dashboard/settings/billing/Index.vue
index 8f829ed0c..fc3905014 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/billing/Index.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/billing/Index.vue
@@ -131,7 +131,7 @@ onMounted(fetchAccountDetails);
           :description="$t('BILLING_SETTINGS.CAPTAIN.DESCRIPTION')"
         >
           <template #action>
-            <ButtonV4 sm solid slate disabled>
+            <ButtonV4 sm faded slate disabled>
               {{ $t('BILLING_SETTINGS.CAPTAIN.BUTTON_TXT') }}
             </ButtonV4>
           </template>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/billing/components/BillingCard.vue b/app/javascript/dashboard/routes/dashboard/settings/billing/components/BillingCard.vue
index d9179b76c..932f6b5b4 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/billing/components/BillingCard.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/billing/components/BillingCard.vue
@@ -15,7 +15,7 @@ defineProps({
 
 <template>
   <div
-    class="rounded-xl shadow-sm border border-n-weak bg-n-solid-3 py-5 space-y-5"
+    class="rounded-xl shadow-sm border border-n-weak bg-n-solid-2 py-5 space-y-5"
   >
     <BillingHeader :title :description class="px-5">
       <slot name="action" />
diff --git a/app/javascript/dashboard/routes/dashboard/settings/billing/components/BillingMeter.vue b/app/javascript/dashboard/routes/dashboard/settings/billing/components/BillingMeter.vue
index fb057b44a..5af2fcb35 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/billing/components/BillingMeter.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/billing/components/BillingMeter.vue
@@ -39,7 +39,7 @@ const colorClass = computed(() => {
     </div>
     <div class="tabular-nums">{{ consumed }} / {{ totalCount }}</div>
   </div>
-  <div class="rounded-full overflow-hidden h-2 w-full bg-n-container mt-2">
+  <div class="rounded-full overflow-hidden h-2 w-full bg-n-slate-4 mt-2">
     <div class="h-2" :class="colorClass" :style="{ width: `${percent}%` }" />
   </div>
 </template>