diff --git a/resources/views/partials/paystack-sheet.blade.php b/resources/views/partials/paystack-sheet.blade.php
index 5486563..ce2f127 100644
--- a/resources/views/partials/paystack-sheet.blade.php
+++ b/resources/views/partials/paystack-sheet.blade.php
@@ -1,9 +1,9 @@
{{--
- Paystack checkout wrapper — bottom sheet on mobile, centered modal on desktop.
+ Paystack mobile bottom-sheet iframe.
Requires Alpine.js ancestor with: showSheet (bool), checkoutUrl (string).
+ On mobile (< md) the sheet slides up; on desktop nothing renders.
--}}
- {{-- Mobile bottom sheet --}}
-
- {{-- Desktop modal --}}
-
-
-
-
-
-
- @include('partials.mini-paystack-frame-header')
-
-
-
- @include('partials.mini-paystack-frame-footer')
-
-
diff --git a/resources/views/public/qr/payment-landing.blade.php b/resources/views/public/qr/payment-landing.blade.php
index 551294c..e789c30 100644
--- a/resources/views/public/qr/payment-landing.blade.php
+++ b/resources/views/public/qr/payment-landing.blade.php
@@ -19,6 +19,8 @@
amount: @js(old('amount')),
loading: false,
errorMsg: @js(session('error')),
+ showSheet: false,
+ checkoutUrl: '',
async submitPay() {
const value = parseFloat(this.amount);
if (!value || value <= 0) {
@@ -49,7 +51,13 @@
this.loading = false;
return;
}
- window.location.assign(data.checkout_url);
+ if (window.innerWidth < 768) {
+ this.checkoutUrl = data.checkout_url;
+ this.showSheet = true;
+ this.loading = false;
+ } else {
+ window.location.href = data.checkout_url;
+ }
} catch (e) {
this.errorMsg = 'Network error. Please try again.';
this.loading = false;
@@ -134,5 +142,7 @@
Secured by Paystack · Powered by Ladill Mini
+
+ @include('partials.paystack-sheet')