mirror of
https://github.com/invoiceninja/invoiceninja.git
synced 2024-11-18 09:04:35 +01:00
54 lines
2.4 KiB
PHP
54 lines
2.4 KiB
PHP
@extends('portal.ninja2020.layout.app')
|
|
@section('meta_title', ctrans('texts.subscriptions'))
|
|
|
|
@section('body')
|
|
<div class="container mx-auto">
|
|
<!-- Top section showing details between plans -->
|
|
<div class="grid grid-cols-12 gap-8">
|
|
<!-- 1) Subscription we're switching from -->
|
|
<div
|
|
class="col-span-12 md:col-start-2 md:col-span-4 bg-white rounded px-4 py-5 shadow hover:shadow-lg">
|
|
<span class="text-sm uppercase text-gray-900">Current plan:</span>
|
|
<p class="mt-4">Placeholder text for plan notes, some text.</p>
|
|
<div class="flex justify-end mt-2">
|
|
<span>$10</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-span-12 md:col-span-1 flex justify-center items-center">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
|
|
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
|
|
class="hidden md:block">
|
|
<line x1="5" y1="12" x2="19" y2="12"></line>
|
|
<polyline points="12 5 19 12 12 19"></polyline>
|
|
</svg>
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
|
|
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
|
|
class="md:hidden">
|
|
<line x1="12" y1="5" x2="12" y2="19"></line>
|
|
<polyline points="19 12 12 19 5 12"></polyline>
|
|
</svg>
|
|
</div>
|
|
|
|
<!-- 2) Subscription we're switching to -->
|
|
<div class="col-span-12 md:col-span-4 bg-white rounded px-4 py-5 shadow border hover:shadow-lg group-hover:border-transparent">
|
|
<span class="text-sm uppercase text-gray-900">Switching to:</span>
|
|
<p class="mt-4">Placeholder text for plan notes, some text.</p>
|
|
<div class="flex justify-end mt-2">
|
|
<span>$10</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Payment box -->
|
|
@livewire('subscription-plan-switch', compact('subscription', 'target', 'contact'))
|
|
</div>
|
|
@endsection
|
|
|
|
@push('footer')
|
|
<script>
|
|
Livewire.on('beforePaymentEventsCompleted', () => document.getElementById('payment-method-form').submit());
|
|
</script>
|
|
@endpush
|