Files
numstation-web/resources/views/themes/tailwind/user/payment-flow/index.blade.php
2023-12-22 12:35:55 +08:00

95 lines
4.6 KiB
PHP
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
@extends('theme::user.layouts.app') @section('content')
<div class="bk-checkout-page">
<div class="card-wrapper">
<div class="card-title-wrapper d-flex justify-content-end align-items-center">
<div>
<svg width="100" height="26" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="13" cy="13" r="12" fill="#F3CF5D" stroke="#F3CF5D" stroke-width="1.5"/>
<circle cx="13" cy="13" r="7" fill="white"/>
<circle cx="87" cy="13" r="12" fill="#F4F7FA" stroke="#F4F7FA" stroke-width="1.5"/>
<path d="M35 13H64" stroke="#F4F7FA" stroke-width="2" stroke-linecap="round"/>
</svg>
</div>
</div>
<div class="card-body mx-auto">
<form action="#" class="theme-form">
<p class="card-body-title">Company Secretary subscription packages</p>
<div class="bk-packages-page" style="width: 100%; margin: 0 auto;">
<div class="row package-list">
<div class="col-md-12 flex justify-center">
<div class="package-box" style="width: 70%;">
<div class="package-box-header">
<h3 class="header-title">Company Secretary service</h3>
<label class="toggle-switch">
<input type="checkbox" id="subscriptionType" />
<span class="slider"></span>
<span class="labels" data-on="Monthly" data-off="Annually"></span>
</label>
<div class="package-box-price" style="width: 40%; margin-left: 30%;">
<div class="package-box-price-inner" data-price-type="annually">HK<span class="bigger-text">$4,600</span></div>
<div class="package-box-price-inner" data-price-type="monthly" style="display: none;">HK<span class="bigger-text">$422</span></div>
</div>
</div>
<div class="package-box-body" style="text-align: center; align-self: center;">
<span class="package-box-body-title">Service include</span>
<ul class="package-box-body-list">
<li>Corporate Secretary essentials</li>
<li>Personal support by your Corporate Secretary via chat</li>
<li>Annual General Meeting papers</li>
<li>Annual Returns Filing</li>
<li>Forever free documents estorage</li>
<li>Automated and timely reminders on filing deadlines</li>
<li>Online shares distribution management & capital table</li>
</ul>
<span class="package-box-body-title">Government & Tax Filings</span>
<ul class="package-box-body-list">
<li>Unaudited Financial Statements</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div class="d-flex justify-content-between align-items-center">
<a href="{{ route('wave.user.payment-flow.index') }}" class="btn gray-btn py-20">Previous</a>
<div class="d-flex justify-content-center align-items-center">
<a href="{{ route('wave.user.payment-flow.index') }}" class="btn blue-btn py-20 mr-5">Save and Leave</a>
<a href="{{ route('wave.user.payment-flow.cart-summary') }}" class="btn blue-btn py-20">Checkout</a>
</div>
</div>
</form>
</div>
</div>
</div>
@endsection
@section('script')
<script>
$(function() {
setPrice();
$('#subscriptionType').click(function() {
setPrice();
});
function setPrice() {
$('.package-list .package-box-price-inner').hide();
if ($('#subscriptionType').is(':checked')) {
$('.package-list .package-box-price-inner[data-price-type="monthly"]').show();
}
else {
$('.package-list .package-box-price-inner[data-price-type="annually"]').show();
}
}
});
</script>
@endsection