first commit
This commit is contained in:
@@ -0,0 +1,151 @@
|
||||
@extends('theme::user.layouts.app')
|
||||
|
||||
|
||||
@section('content')
|
||||
|
||||
<div class="bk-checkout-page">
|
||||
<div class="card-wrapper">
|
||||
<div class="card-title-wrapper">
|
||||
<h2 class="card-main-title">Checkout</h2>
|
||||
</div>
|
||||
|
||||
<div class="card-body mx-auto">
|
||||
<form action="/" method="POST" class="theme-form">
|
||||
<p class="card-body-title">Cart Summary</p>
|
||||
<div class="cart-summary-wrapper mx-auto">
|
||||
<div class="summary-computations-wrapper">
|
||||
<div class="summary-row">
|
||||
<span class="summary-row-title">Bookkeeping Service subscription packages</span>
|
||||
</div>
|
||||
<div class="summary-row">
|
||||
<span class="summary-row-title fs-20">{{ $subscription->name_english }}</span>
|
||||
</div>
|
||||
<div class="summary-row">
|
||||
<ul>
|
||||
<li class="summary-row-title fs-20">Annually</li>
|
||||
</ul>
|
||||
<span class="summary-row-desc fs-20 sky-blue-text">HK${{ number_format($subscription->price, 2) }}</span>
|
||||
</div>
|
||||
<hr class="summary-row-separator">
|
||||
<div class="summary-row mb-0">
|
||||
<span class="summary-row-title fs-32 fw-600">Total</span>
|
||||
<span class="summary-row-desc fs-20 sky-blue-text">HK${{ number_format($subscription->price, 2) }}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="summary-form-box">
|
||||
<h3 class="summary-form-box-title">Your contact details</h3>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<div class="row mb-30 align-items-center">
|
||||
<div class="col-auto">
|
||||
<label class="col-form-label">First name</label>
|
||||
</div>
|
||||
<div class="col">
|
||||
<input type="text" class="form-control" value="" required>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="row mb-30 align-items-center">
|
||||
<div class="col-auto">
|
||||
<label class="col-form-label">Last name</label>
|
||||
</div>
|
||||
<div class="col">
|
||||
<input type="text" class="form-control" value="" required>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<div class="row mb-30 align-items-center">
|
||||
<div class="col-auto">
|
||||
<label class="col-form-label">Email</label>
|
||||
</div>
|
||||
<div class="col">
|
||||
<input type="email" class="form-control" value="" required>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="row mb-30 align-items-center">
|
||||
<div class="col-auto">
|
||||
<label class="col-form-label">Phone</label>
|
||||
</div>
|
||||
<div class="col">
|
||||
<input type="number" class="form-control" value="" required>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="summary-form-box">
|
||||
<h3 class="summary-form-box-title">Payment details</h3>
|
||||
<h3 class="summary-form-box-title d-flex align-items-center">
|
||||
<span class="mr-3">Credit Card</span>
|
||||
<div class="d-flex">
|
||||
<img class="img-fluid" src="{{ asset('themes/tailwind/images/mastercard.png') }}">
|
||||
<img class="img-fluid" src="{{ asset('themes/tailwind/images/visacard.png') }}">
|
||||
</div>
|
||||
</h3>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<div class="row mb-30 align-items-center">
|
||||
<div class="col-auto">
|
||||
<label class="col-form-label">Cardholders name</label>
|
||||
</div>
|
||||
<div class="col">
|
||||
<input type="text" class="form-control" value="" required>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="row mb-30 align-items-center">
|
||||
<div class="col-auto">
|
||||
<label class="col-form-label">Card number</label>
|
||||
</div>
|
||||
<div class="col">
|
||||
<input type="text" class="form-control" value="" required>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<div class="row mb-30 align-items-center">
|
||||
<div class="col-auto">
|
||||
<label class="col-form-label">Expiration</label>
|
||||
</div>
|
||||
<div class="col">
|
||||
<input type="text" class="form-control" value="" placeholder="00/00" required>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="row mb-30 align-items-center">
|
||||
<div class="col-auto">
|
||||
<label class="col-form-label">CVC</label>
|
||||
</div>
|
||||
<div class="col">
|
||||
<input type="number" class="form-control" value="" required>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex align-items-center justify-content-end">
|
||||
<a href="{{ route('wave.user.book-keeping.account-overview') }}" class="btn red-btn py-20 mr-5">Cancel</a>
|
||||
<a href="{{ route('wave.user.book-keeping.checkout-payment-success') }}" class="btn yellow-btn py-20">Pay</a>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@endsection
|
||||
Reference in New Issue
Block a user