From 6f2bcd8b33edd35558c1c49e0904b3cb7c02e320 Mon Sep 17 00:00:00 2001
From: David Bomba <turbo124@gmail.com>
Date: Mon, 7 Oct 2024 13:51:45 +1100
Subject: [PATCH] Fixes for stripe tokens

---
 modules_statuses.json                         |  2 +-
 .../gateways/stripe/credit_card/pay.blade.php |  4 +-
 .../stripe/credit_card/pay_livewire.blade.php | 39 +++++++++----------
 3 files changed, 22 insertions(+), 23 deletions(-)

diff --git a/modules_statuses.json b/modules_statuses.json
index 2bb10713c7..1f5f99114c 100644
--- a/modules_statuses.json
+++ b/modules_statuses.json
@@ -1,3 +1,3 @@
 {
     "Admin": true
-}
+}
\ No newline at end of file
diff --git a/resources/views/portal/ninja2020/gateways/stripe/credit_card/pay.blade.php b/resources/views/portal/ninja2020/gateways/stripe/credit_card/pay.blade.php
index 0d0290ff39..6b75ae1e8e 100644
--- a/resources/views/portal/ninja2020/gateways/stripe/credit_card/pay.blade.php
+++ b/resources/views/portal/ninja2020/gateways/stripe/credit_card/pay.blade.php
@@ -53,7 +53,7 @@
     @include('portal.ninja2020.gateways.includes.payment_details')
 
     @component('portal.ninja2020.components.general.card-element', ['title' => ctrans('texts.pay_with')])
-        <ul class="list-none">
+    <ul class="list-none">
         @if(count($tokens) > 0)
             @foreach($tokens as $token)
             <li class="py-2 cursor-pointer">
@@ -62,7 +62,7 @@
                         type="radio"
                         data-token="{{ $token->token }}"
                         name="payment-type"
-                        class="form-check-input text-indigo-600 rounded-full cursor-pointer toggle-payment-with-token toggle-payment-with-token"/>
+                        class="form-check-input text-indigo-600 rounded-full cursor-pointer toggle-payment-with-token"/>
                     <span class="ml-1 cursor-pointer">**** {{ $token->meta?->last4 }}</span>
                 </label>
             </li>
diff --git a/resources/views/portal/ninja2020/gateways/stripe/credit_card/pay_livewire.blade.php b/resources/views/portal/ninja2020/gateways/stripe/credit_card/pay_livewire.blade.php
index 5c7a021b70..e110eb89b0 100644
--- a/resources/views/portal/ninja2020/gateways/stripe/credit_card/pay_livewire.blade.php
+++ b/resources/views/portal/ninja2020/gateways/stripe/credit_card/pay_livewire.blade.php
@@ -32,35 +32,34 @@
     @include('portal.ninja2020.gateways.includes.payment_details')
 
     @component('portal.ninja2020.components.general.card-element', ['title' => ctrans('texts.pay_with')])
-        <ul class="list-none">
-        @if(count($tokens) > 0)
-            @foreach($tokens as $token)
-            <li class="py-2 hover:text-white hover:bg-blue-600">
-                <label class="mr-4">
-                    <input
-                        type="radio"
-                        data-token="{{ $token->token }}"
-                        name="payment-type"
-                        class="form-check-input text-indigo-600 rounded-full cursor-pointer toggle-payment-with-token toggle-payment-with-token"/>
-                    <span class="ml-1 cursor-pointer">**** {{ $token->meta?->last4 }}</span>
-                </label>
-            </li>
-            @endforeach
-        @endisset
+        <ul class="list-none space-y-2">
+            @if(count($tokens) > 0)
+                @foreach($tokens as $token)
+                <li class="py-2 hover:bg-gray-100 rounded transition-colors duration-150">
+                    <label class="flex items-center cursor-pointer px-2">
+                        <input
+                            type="radio"
+                            data-token="{{ $token->token }}"
+                            name="payment-type"
+                            class="form-radio text-indigo-600 rounded-full cursor-pointer toggle-payment-with-token"/>
+                        <span class="ml-2 cursor-pointer">**** {{ $token->meta?->last4 }}</span>
+                    </label>
+                </li>
+                @endforeach
+            @endif
 
-            <li class="py-2 hover:text-white hover:bg-blue-600">
-                <label>
+            <li class="py-2 hover:bg-gray-100 rounded transition-colors duration-150">
+                <label class="flex items-center cursor-pointer px-2">
                     <input
                         type="radio"
                         id="toggle-payment-with-credit-card"
-                        class="form-check-input text-indigo-600 rounded-full cursor-pointer"
+                        class="form-radio text-indigo-600 rounded-full cursor-pointer"
                         name="payment-type"
                         checked/>
-                    <span class="ml-1 cursor-pointer">{{ __('texts.new_card') }}</span>
+                    <span class="ml-2 cursor-pointer">{{ __('texts.new_card') }}</span>
                 </label>
             </li>    
         </ul>
-        
     @endcomponent
 
     @include('portal.ninja2020.gateways.stripe.includes.card_widget')