master
unknown 2022-12-21 04:01:19 +05:00
parent 85ccd21677
commit ab687e940f
5 changed files with 52 additions and 101 deletions

View File

@ -7,18 +7,20 @@
</div>
<div class="col-12 text-center justify-content-center col-lg-9 pt-1">
<div class="progress mx-auto ms-lg-3 mt-2 " style="width: 70%;height: 12px">
<div class="progress-bar bar" role="progressbar" style="width: 25%" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100"></div>
<div class="progress-bar bar" role="progressbar" :style="{ 'width': bar_val + '%' }" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
</div>
<NuxtPage page-key="child" />
<div class="row pt-5 mt-2">
<div class="col-12 text-center pt-5 mt-3">
<NuxtLink class="btn btn-warning px-4 " to="onbording1"></NuxtLink>
<NuxtLink class="btn btn-warning px-2 mx-2 " to="onbording2"></NuxtLink>
<NuxtLink class="btn btn-warning px-2 " to="onbording3"></NuxtLink>
<NuxtLink class="btn btn-warning px-2 mx-2 " to="onbording4"></NuxtLink>
<NuxtLink class="btn btn-warning px-4 " to="/onbording"></NuxtLink>
<NuxtLink class="btn btn-warning px-2 mx-2 " to="/onbording/onbording2"></NuxtLink>
<NuxtLink class="btn btn-warning px-2 " to="/onbording/onbording3"></NuxtLink>
<NuxtLink class="btn btn-warning px-2 mx-2 " to="/onbording/onbording4"></NuxtLink>
</div>
<div class="col-12">
<h6 class="text-muted text-center pt-3">You can customize your selection later</h6>
@ -27,10 +29,15 @@
</div>
</div>
</template>
<script>
export default {
data(){
return{
bar_val:25,
}
}
}
</script>

View File

@ -1,31 +1,30 @@
<template>
<div>
<div class="container-fluid pt-3 ps-4">
<div class="row">
<div class="col-3">
<a class="navbar-brand" href="#"><img src="~/assets/image/Logo.png"></a>
</div>
<div class="col-12 text-center justify-content-center col-lg-9 pt-1">
<div class="progress mx-auto ms-lg-3 mt-2 " style="width: 70%;height: 12px">
<div class="progress-bar bar" role="progressbar" style="width: 25%" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
</div>
<div class="row pt-5 mt-2">
<div class="col-12 text-center pt-5 mt-3">
<NuxtLink class="btn btn-warning px-4 " to="onbording1"></NuxtLink>
<NuxtLink class="btn btn-warning px-2 mx-2 " to="onbording2"></NuxtLink>
<NuxtLink class="btn btn-warning px-2 " to="onbording3"></NuxtLink>
<NuxtLink class="btn btn-warning px-2 mx-2 " to="onbording4"></NuxtLink>
<div class="col-12 pt-3">
<h6 class="text-muted text-center">We are analyzing your background noise...</h6>
</div>
<div class="col-12">
<h6 class="text-muted text-center pt-3">You can customize your selection later</h6>
</div>
<h4 class="text-center fw-bold pt-5">What headphones do you use?</h4>
<h6 class="text-center text-muted">Make sure that your headphones are properly connected. </h6>
<h6 class="text-center text-muted">To use Mindboost, headphones are required. </h6>
</div>
<div class=" pt-5 text-center">
<input type="radio" class="btn-check" name="options-outlined" id="success-outlined" autocomplete="off" checked>
<label class="btn btn-outline-warning py-3 px-5" for="success-outlined">
<img src="~/assets/image/AirPodsPro.png" style="height: 60px">
<p class="text-white text-center">In-Ear</p>
</label>
<input type="radio" class="btn-check " name="options-outlined" id="danger-outlined" autocomplete="off">
<label class="btn btn-outline-warning ms-3 py-3 px-5" for="danger-outlined">
<img src="~/assets/image/AirPodsProMax.png" style="height: 60px">
<p class="text-white text-center">In-Ear</p>
</label>
</div>
</div>
</div>
</template>
<script>
export default {
@ -34,5 +33,7 @@ export default {
</script>
<style>
.bar{
background-color: #e9c046;
}
</style>

View File

@ -1,16 +1,5 @@
<template>
<div>
<div class="container-fluid pt-3 ps-4">
<div class="row">
<div class="col-3">
<a class="navbar-brand" href="#"><img src="~/assets/image/Logo.png"></a>
</div>
<div class="col-12 text-center justify-content-center col-lg-9 pt-1">
<div class="progress mx-auto ms-lg-3 mt-2 " style="width: 70%;height: 12px">
<div class="progress-bar bar" role="progressbar" style="width: 50%" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
</div>
<div class="row">
<div class="col-12 pt-3">
<h6 class="text-muted text-center">We are analyzing your background noise...</h6>
@ -33,24 +22,16 @@
</label>
</div>
</div>
<div class="row pt-5 mt-2">
<div class="col-12 text-center pt-5 mt-3">
<NuxtLink class="btn btn-warning px-2 " to="onbording1"></NuxtLink>
<NuxtLink class="btn btn-warning px-4 mx-2 " to="onbording2"></NuxtLink>
<NuxtLink class="btn btn-warning px-2 " to="onbording3"></NuxtLink>
<NuxtLink class="btn btn-warning px-2 mx-2 " to="onbording4"></NuxtLink>
</div>
<div class="col-12">
<h6 class="text-muted text-center pt-3">You can customize your selection later</h6>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
name:'OnBording',
data(){
return{
bar_val:25,
}
}
}
</script>

View File

@ -1,16 +1,5 @@
<template>
<div>
<div class="container-fluid pt-3 ps-4">
<div class="row">
<div class="col-3">
<a class="navbar-brand" href="#"><img src="~/assets/image/Logo.png"></a>
</div>
<div class="col-12 text-center justify-content-center col-lg-9 pt-1">
<div class="progress mx-auto ms-lg-3 mt-2 " style="width: 75%;height: 12px">
<div class="progress-bar bar" role="progressbar" style="width: 75%" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
</div>
<div class="row">
<div class="col-12 pt-3">
<h6 class="text-muted text-center">We are analyzing your background noise...</h6>
@ -32,24 +21,16 @@
</label>
</div>
</div>
<div class="row pt-5 mt-2">
<div class="col-12 text-center pt-5 mt-3">
<NuxtLink class="btn btn-warning px-2 " to="onbording1"></NuxtLink>
<NuxtLink class="btn btn-warning px-2 mx-2 " to="onbording2"></NuxtLink>
<NuxtLink class="btn btn-warning px-4 " to="onbording3"></NuxtLink>
<NuxtLink class="btn btn-warning px-2 mx-2" to="onbording4"></NuxtLink>
</div>
<div class="col-12">
<h6 class="text-muted text-center pt-3">You can customize your selection later</h6>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
name:'OnBording',
data(){
return{
bar_val:25,
}
}
}
</script>

View File

@ -1,16 +1,5 @@
<template>
<div>
<div class="container-fluid pt-3 ps-4">
<div class="row">
<div class="col-3">
<a class="navbar-brand" href="#"><img src="~/assets/image/Logo.png"></a>
</div>
<div class="col-12 text-center justify-content-center col-lg-9 pt-1">
<div class="progress mx-auto ms-lg-3 mt-2 " style="width: 70%;height: 12px">
<div class="progress-bar bar" role="progressbar" style="width: 100%" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
</div>
<div class="row">
<div class="col-12 pt-3">
<h6 class="text-muted text-center">We are analyzing your background noise...</h6>
@ -45,24 +34,16 @@
</label>
</div>
</div>
<div class="row pt-5 mt-2">
<div class="col-12 text-center pt-5 mt-3">
<NuxtLink class="btn btn-warning px-2 " to="onbording1"></NuxtLink>
<NuxtLink class="btn btn-warning px-2 mx-2 " to="onbording2"></NuxtLink>
<NuxtLink class="btn btn-warning px-2 " to="onbording3"></NuxtLink>
<NuxtLink class="btn btn-warning px-4 mx-2" to="onbording4"></NuxtLink>
</div>
<div class="col-12">
<h6 class="text-muted text-center pt-3">You can customize your selection later</h6>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
name:'OnBording',
data(){
return{
bar_val:100,
}
}
}
</script>