60 lines
2.6 KiB
Vue
Executable File
60 lines
2.6 KiB
Vue
Executable File
<template>
|
|
<div>
|
|
<div class="row justify-content-center">
|
|
<div class="col-12 col-sm-8">
|
|
<h4 class="fw-bold text-center me-5 pt-5"><span class="float-start" style="cursor: pointer" @click="this.$router.go(-1)"><i class="fa-solid fa-arrow-left-long"></i></span> Subscription</h4>
|
|
<div class="row">
|
|
<div class="col-12">
|
|
<h4 class="fw-bold text-center pt-3">Subscribe to increase your productivity with Mindboost</h4>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-12 pt-3 col-sm-4">
|
|
<div class="card" style="background: #E9C046;box-shadow: 0px 0px 16px 1px rgba(108, 97, 97, 0.05);border-radius: 12px;" >
|
|
<div class="card-body py-4">
|
|
<h5 class="text-center fw-bolder text-white " style="font-weight: 600;font-size: 32px">$2.99</h5>
|
|
<p class="text-white text-center">1 month</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-12 pt-3 col-sm-4">
|
|
<div class="card" style="background: #FFFFFF;box-shadow: 0px 0px 16px 1px rgba(108, 97, 97, 0.05);border-radius: 12px;">
|
|
<div class="card-body py-4">
|
|
<h5 class="text-center fw-bolder " style="font-weight: 600;font-size: 32px">$9.99</h5>
|
|
<p class=" text-center">6 month</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-12 pt-3 col-sm-4">
|
|
<div class="card" style="background: #FFFFFF;border: 1px solid #E9C046;border-radius: 12px;">
|
|
<div class="card-body py-4">
|
|
<h5 class="text-center fw-bolder " style="font-weight: 600;font-size: 32px">$14.99</h5>
|
|
<p class=" text-center">1 year</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row pt-5">
|
|
<div class="col-12 px-md-5 px-0">
|
|
<h6 class="text-center text-muted" style="font-style: normal;font-weight: 500;font-size: 14px;line-height: 20px;">You can cancel Mindboost at any time. The subscription will start automatically after the end of the trial period unless it is canceled before the end of the trial period. The total price is charged per period, price includes VAT.</h6>
|
|
</div>
|
|
</div>
|
|
<div class="row pt-5 justify-content-center ">
|
|
<div class="col-6 text-center">
|
|
<button type="button" class="btn text-white fs-5 col-12 fw-bold py-2 " style="background-color: #e9c046">Save Changes</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name:'Subscription',
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
|
|
</style> |