From 410056cf439b9bbc9d82ab1e20dee5734f84fa42 Mon Sep 17 00:00:00 2001
From: Arman <arman@appwrite.io>
Date: Tue, 4 Jun 2024 17:06:44 +0200
Subject: [PATCH] fix: empty payment state

---
 src/lib/components/billing/selectPaymentMethod.svelte | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/src/lib/components/billing/selectPaymentMethod.svelte b/src/lib/components/billing/selectPaymentMethod.svelte
index 0bed8d7e4..a35f81b6a 100644
--- a/src/lib/components/billing/selectPaymentMethod.svelte
+++ b/src/lib/components/billing/selectPaymentMethod.svelte
@@ -87,12 +87,14 @@
 {:else}
     <Card
         isDashed
-        style="--p-card-padding:1rem; --p-card-bg-color: transparent; --p-card-border-radius: 0.5rem"
+        style="--p-card-padding:0.75rem; --p-card-bg-color: transparent; --p-card-border-radius: 0.5rem"
         isTile>
         <div class="u-flex u-main-space-between u-cross-center">
-            <p>
-                <span class="icon-exclamation-circle"></span>
-                <span class="text">No saved payment methods</span>
+            <p class="u-flex u-gap-8 u-cross-center">
+                <span
+                    class="icon-exclamation u-color-text-warning"
+                    style:font-size="var(--icon-size-medium)"></span>
+                <span class="text">A payment method is required</span>
             </p>
             <Button secondary on:click={() => (showPaymentModal = true)}>
                 <span class="icon-plus"></span> <span class="text">Add</span>