185 lines
8.8 KiB
PHP
185 lines
8.8 KiB
PHP
<!DOCTYPE html>
|
|
<html lang="en-US">
|
|
<head>
|
|
<title>Checkout - Golf Evolution</title>
|
|
<meta charset="UTF-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<link rel="icon" href="<?= base_url()."/public"; ?>/assets/member_images/favicon.png" sizes="192x192" />
|
|
<link rel="apple-touch-icon" href="<?= base_url()."/public"; ?>/assets/member_images/favicon.png" />
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
<link href="https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;700&display=swap" rel="stylesheet">
|
|
<link rel="stylesheet" href="<?= base_url()."/public"; ?>/assets/member_css/front-style.css">
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
|
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
|
|
<script src="<?= base_url()."/public"; ?>/assets/member_js/ajax.js"></script>
|
|
</head>
|
|
<body class="checkout">
|
|
|
|
<?php include 'member_layout/header.php' ?>
|
|
|
|
<section class="pt-5 pb-3">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-lg-12">
|
|
<h1 class="heading-border">Check Out</h1>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row back-card">
|
|
<div class="col-lg-12">
|
|
<a href="#"><i class="arrow-left"></i> Back to Cart</a>
|
|
<h4>Billing Address</h4>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="checkout-inner mt-3">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-lg-8">
|
|
<div class="row edit-address">
|
|
<div class="col-lg-3">
|
|
<input type="radio" class="select-address">
|
|
<span>Tom Holland</span>
|
|
</div>
|
|
<div class="col-lg-7">
|
|
<div class="billing-address">2544 Enterprise Way kelowna,V1X7X5</div>
|
|
</div>
|
|
<div class="col-lg-2 text-end">
|
|
<a href="#" class="billing-edit">Edit</a>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="address-form">
|
|
<form action="">
|
|
<div class="row">
|
|
<div class="col-lg-12 d-flex align-items-center mb-3">
|
|
<input type="radio" class="add_address"><span>Add New Address</span>
|
|
</div>
|
|
<div class="col-lg-6 mb-3">
|
|
<label for="first_name">First Name</label>
|
|
<input type="text" name="first_name" id="first_name">
|
|
</div>
|
|
<div class="col-lg-6 mb-3">
|
|
<label for="last_name">Last Name</label>
|
|
<input type="text" name="last_name" id="last_name">
|
|
</div>
|
|
|
|
<div class="col-lg-12 mb-3">
|
|
<label for="address">Street Address</label>
|
|
<input type="text" name="address" id="address">
|
|
</div>
|
|
<div class="col-lg-4 mb-3">
|
|
<label for="apartment_number">Apartment Number</label>
|
|
<input type="text" name="apartment_number" id="apartment_number">
|
|
</div>
|
|
<div class="col-lg-4 mb-3">
|
|
<label for="state">State</label>
|
|
<select id="state" name="state">
|
|
<option value="">Select state</option>
|
|
<option value="AN">Andaman and Nicobar Islands</option>
|
|
</select>
|
|
</div>
|
|
<div class="col-lg-4 mb-3">
|
|
<label for="zipcode">Zip Code</label>
|
|
<input type="text" name="zipcode" id="zipcode">
|
|
</div>
|
|
</div>
|
|
<div class="row form-button">
|
|
<div class="col-lg-2 col-4">
|
|
<button>Cancel</button>
|
|
</div>
|
|
<div class="col-lg-3 col-4">
|
|
<input type="submit" value="Save">
|
|
</div>
|
|
<div class="col-lg-7 col-4"></div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
<h4 class="payment-title">Payment Method</h4>
|
|
|
|
<div class="credit-card">
|
|
<div class="row">
|
|
<div class="col-lg-12 ">
|
|
<!-- Add Payment Method Code-->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="google-pay">
|
|
<div class="row google-pay-content align-items-center">
|
|
<div class="col-lg-10 d-flex align-items-center">
|
|
<input type="radio">
|
|
<span>Google Pay</span>
|
|
</div>
|
|
<div class="col-lg-2 text-end">
|
|
<img src="<?= base_url()."/public"; ?>/assets/member_images/g-pay.png" alt="" width="64" height="58"/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-lg-4">
|
|
<div class="order-summary">
|
|
<div class="row order1">
|
|
<div class="col-lg-12 col-12">
|
|
<h4>Order Summary</h4>
|
|
</div>
|
|
</div>
|
|
<div class="row evo">
|
|
<div class="col-lg-6 col-6"><div class="product-name">Evo Pack 1</div></div>
|
|
<div class="col-lg-6 col-6 text-end"><div class="product-price"><span class="price-symbol">$</span>550.00</div></div>
|
|
</div>
|
|
<div class="row evo">
|
|
<div class="col-lg-6 col-6"><div class="product-name">Evo Pack2</div></div>
|
|
<div class="col-lg-6 col-6 text-end"><div class="product-price"><span class="price-symbol">$</span>1000.00</div></div>
|
|
</div>
|
|
<div class="row item1">
|
|
<div class="col-lg-6 col-6"><p>Items (2):</p></div>
|
|
<div class="col-lg-6 col-6 text-end"><p><span class="price-symbol">$</span>1550.00</p></div>
|
|
</div>
|
|
<div class="row item2">
|
|
<div class="col-lg-6 col-6"><p>PST (7%):</p></div>
|
|
<div class="col-lg-6 col-6 text-end"><p><span class="price-symbol">$</span>108.50</p></div>
|
|
</div>
|
|
<div class="row item3">
|
|
<div class="col-lg-6 col-6"><p>GST (5%):</p></div>
|
|
<div class="col-lg-6 col-6 text-end"><p><span class="price-symbol">$</span>77.50</p></div>
|
|
</div>
|
|
<div class="row order2">
|
|
<div class="col-lg-6 col-6"><h5>Order Total:</h5></div>
|
|
<div class="col-lg-6 col-6 text-end"><div class="product-total"><span class="price-symbol">$</span>1736.00</div></div>
|
|
</div>
|
|
<div class="row order-button">
|
|
<div class="col-lg-12">
|
|
<p>By placing your order, you agree to our company privacy policy and condition of use.</p>
|
|
<input type="submit" value="Proceed to Pay">
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
</section>
|
|
|
|
<section class="google-pay">
|
|
<div class="container">
|
|
|
|
</div>
|
|
</section>
|
|
|
|
<?php include 'member_layout/footer.php' ?>
|
|
|
|
</body>
|
|
</html>
|