master
unknown
parent
64796b65ae
commit
f946717dad
|
|
@ -79,7 +79,7 @@
|
||||||
<a class="nav-link fourth-icon px-2 py-2" href="#"></a>
|
<a class="nav-link fourth-icon px-2 py-2" href="#"></a>
|
||||||
</li>
|
</li>
|
||||||
<li class="nav-item">
|
<li class="nav-item">
|
||||||
<a class="nav-link fivith-icon px-2 py-2" href="#"></a>
|
<nuxt-link to="/setting" class="nav-link fivith-icon px-2 py-2"></nuxt-link>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -145,7 +145,7 @@ export default {
|
||||||
padding: 10px 10px;
|
padding: 10px 10px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
.fivith-icon:focus{
|
.fivith-icon.router-link-exact-active{
|
||||||
content: url('~/assets/image/Vector (4).png');
|
content: url('~/assets/image/Vector (4).png');
|
||||||
background-color: #e9c046;
|
background-color: #e9c046;
|
||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
|
|
|
||||||
|
|
@ -9,10 +9,5 @@
|
||||||
import HomeBar from "../components/homebar";
|
import HomeBar from "../components/homebar";
|
||||||
export default {
|
export default {
|
||||||
components: {HomeBar},
|
components: {HomeBar},
|
||||||
methods:{
|
|
||||||
focused(){
|
|
||||||
document.getElementById('foucused-icon').focus();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
@ -19,19 +19,19 @@
|
||||||
</nuxt-link>
|
</nuxt-link>
|
||||||
</li>
|
</li>
|
||||||
<li class="nav-item py-0 w-100 ">
|
<li class="nav-item py-0 w-100 ">
|
||||||
<a href="#" class="nav-link px-3 py-3 list-active align-middle px-0 text-muted fw-bold">
|
<nuxt-link to="/setting/soundscap" class="nav-link px-3 py-3 list-active align-middle px-0 text-muted fw-bold">
|
||||||
<i class="fa-solid d-sm-none d-block fa-user"></i><span class="ms-1 d-none d-sm-inline">Soundscape Settings</span>
|
<i class="fa-solid d-sm-none d-block fa-user"></i><span class="ms-1 d-none d-sm-inline">Soundscape Settings</span>
|
||||||
</a>
|
</nuxt-link>
|
||||||
</li>
|
</li>
|
||||||
<li class="nav-item py-0 w-100 ">
|
<li class="nav-item py-0 w-100 ">
|
||||||
<a href="#" class="nav-link px-3 py-3 list-active align-middle px-0 text-muted fw-bold">
|
<nuxt-link to="/setting/faq" class="nav-link px-3 py-3 list-active align-middle px-0 text-muted fw-bold">
|
||||||
<i class="fa-solid d-sm-none d-block fa-user"></i><span class="ms-1 d-none d-sm-inline">FAQ</span>
|
<i class="fa-solid d-sm-none d-block fa-user"></i><span class="ms-1 d-none d-sm-inline">FAQ</span>
|
||||||
</a>
|
</nuxt-link>
|
||||||
</li>
|
</li>
|
||||||
<li class="nav-item py-0 w-100 ">
|
<li class="nav-item py-0 w-100 ">
|
||||||
<a href="#" class="nav-link px-3 py-3 list-active align-middle px-0 text-muted fw-bold">
|
<nuxt-link to="/setting/about" class="nav-link px-3 py-3 list-active align-middle px-0 text-muted fw-bold">
|
||||||
<i class="fa-solid d-sm-none d-block fa-user"></i><span class="ms-1 d-none d-sm-inline">About Mindboost</span>
|
<i class="fa-solid d-sm-none d-block fa-user"></i><span class="ms-1 d-none d-sm-inline">About Mindboost</span>
|
||||||
</a>
|
</nuxt-link>
|
||||||
</li>
|
</li>
|
||||||
<li class="nav-item py-0 w-100 ">
|
<li class="nav-item py-0 w-100 ">
|
||||||
<a href="#" class="nav-link px-3 py-3 list-active align-middle px-0 text-muted fw-bold">
|
<a href="#" class="nav-link px-3 py-3 list-active align-middle px-0 text-muted fw-bold">
|
||||||
|
|
@ -118,7 +118,7 @@
|
||||||
<a class="nav-link fourth-icon px-2 py-2" href="#"></a>
|
<a class="nav-link fourth-icon px-2 py-2" href="#"></a>
|
||||||
</li>
|
</li>
|
||||||
<li class="nav-item">
|
<li class="nav-item">
|
||||||
<a class="nav-link fivith-icon px-2 py-2" href="#"></a>
|
<router-link to="/setting" class="nav-link fivith-icon px-2 py-2"></router-link>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,35 @@
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<div class="row justify-content-center">
|
||||||
|
<div class="col-12 col-sm-8">
|
||||||
|
<h4 class="fw-bold text-center pt-5">About Mindboost</h4>
|
||||||
|
<div class="row pt-4">
|
||||||
|
<div class="col-12">
|
||||||
|
<h6 class="text-muted fw-bold">WAS IST MINDBOOST?</h6>
|
||||||
|
<p class="text-muted ">Mindboost erzeugt Klanglandschaften für Deine Kopfhörer, die Dir helfen Dich bis zu 35 % besser zu konzentrieren. Mindboost kombiniert dabei Sprachmaskierung, Binaural Beats und Alpha Waves.</p>
|
||||||
|
</div>
|
||||||
|
<div class="col-12 pt-3">
|
||||||
|
<h6 class="text-muted fw-bold">WIE FUNKTIONIERT MINDBOOST?</h6>
|
||||||
|
<p class="text-muted ">
|
||||||
|
Unser Algorithmus misst die Akustik durch Dein Handy oder ein anderes Endgerät im Raum in Echtzeit und generiert eine Klanglandschaft, die störende Hintergrundgeräusche wie telefonierende Kolleg*innen optimal ausblendet.</p>
|
||||||
|
</div>
|
||||||
|
<div class="col-12 pt-3">
|
||||||
|
<h6 class="text-muted fw-bold">WARUM WIRKT MINDBOOST?</h6>
|
||||||
|
<p class="text-muted ">
|
||||||
|
Alle Klanglandschaften in Mindboost wurden in Hörversuchen in Zusammenarbeit mit dem Fraunhofer IBP getestet und optimiert. So kannst Du sicher sein, dass Mindboost Dich optimal bei Deiner Konzentration unterstützt.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name:'SettingPage',
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,101 @@
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<div class="row justify-content-center">
|
||||||
|
<div class="col-12 col-sm-8">
|
||||||
|
<h4 class="fw-bold text-center pt-5">FAQs</h4>
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-12">
|
||||||
|
<div class="accordion" id="accordionExample">
|
||||||
|
<div class="accordion-item">
|
||||||
|
<h2 class="accordion-header" id="headingOne">
|
||||||
|
<button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
|
||||||
|
What are Active Noise Cancelling Headphones?
|
||||||
|
</button>
|
||||||
|
</h2>
|
||||||
|
<div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
|
||||||
|
<div class="accordion-body">
|
||||||
|
Active Noise Canceling (ANC) is a technology that suppresses unwanted noise using coumter sound. Make sure check the description of your headphomes to find out if they are equipped with ANC function. Make sure that the function is activated. </div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="accordion-item">
|
||||||
|
<h2 class="accordion-header" id="headingTwo">
|
||||||
|
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
|
||||||
|
Question 01
|
||||||
|
</button>
|
||||||
|
</h2>
|
||||||
|
<div id="collapseTwo" class="accordion-collapse collapse" aria-labelledby="headingTwo" data-bs-parent="#accordionExample">
|
||||||
|
<div class="accordion-body">
|
||||||
|
Question 01
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="accordion-item">
|
||||||
|
<h2 class="accordion-header" id="headingThree">
|
||||||
|
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
|
||||||
|
Question 02
|
||||||
|
</button>
|
||||||
|
</h2>
|
||||||
|
<div id="collapseThree" class="accordion-collapse collapse" aria-labelledby="headingThree" data-bs-parent="#accordionExample">
|
||||||
|
<div class="accordion-body">
|
||||||
|
This is the third item's accordion body.
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="accordion-item">
|
||||||
|
<h2 class="accordion-header" id="headingFour">
|
||||||
|
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseFour" aria-expanded="false" aria-controls="collapseThree">
|
||||||
|
Question 03
|
||||||
|
</button>
|
||||||
|
</h2>
|
||||||
|
<div id="collapseFour" class="accordion-collapse collapse" aria-labelledby="headingThree" data-bs-parent="#accordionExample">
|
||||||
|
<div class="accordion-body">
|
||||||
|
This is the Question 03.
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="accordion-item">
|
||||||
|
<h2 class="accordion-header" id="headingFive">
|
||||||
|
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseFive" aria-expanded="false" aria-controls="collapseThree">
|
||||||
|
Question 04
|
||||||
|
</button>
|
||||||
|
</h2>
|
||||||
|
<div id="collapseFive" class="accordion-collapse collapse" aria-labelledby="headingThree" data-bs-parent="#accordionExample">
|
||||||
|
<div class="accordion-body">
|
||||||
|
This is the Question 04.
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script >
|
||||||
|
export default {
|
||||||
|
name:'Subscription',
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.accordion-item {
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
.accordion-button:not(.collapsed) {
|
||||||
|
color: black;
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
.accordion-button:focus {
|
||||||
|
z-index: 3;
|
||||||
|
border:none;
|
||||||
|
outline: 0;
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
.accordion-button:not(.collapsed) {
|
||||||
|
background-color: white;
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -20,10 +20,10 @@
|
||||||
<h5 class="fw-bold text-end">Jack</h5> </div>
|
<h5 class="fw-bold text-end">Jack</h5> </div>
|
||||||
</div>
|
</div>
|
||||||
<div class="row pt-4">
|
<div class="row pt-4">
|
||||||
<div class="col-6">
|
<div class="col-4">
|
||||||
<h5 class="fw-bold text-muted">Email</h5>
|
<h5 class="fw-bold text-muted">Email</h5>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-6">
|
<div class="col-8">
|
||||||
<h5 class="fw-bold text-end">michaeljack@gmail.com</h5> </div>
|
<h5 class="fw-bold text-end">michaeljack@gmail.com</h5> </div>
|
||||||
</div>
|
</div>
|
||||||
<div class="row pt-4">
|
<div class="row pt-4">
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,110 @@
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<div class="row justify-content-center">
|
||||||
|
<div class="col-12 col-sm-8">
|
||||||
|
<h4 class="fw-bold text-center pt-5">Soundscape Settings</h4>
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-12">
|
||||||
|
<div class="accordion accordion-flush" id="accordionPanelsStayOpenExample">
|
||||||
|
<div class="accordion-item">
|
||||||
|
<h2 class="accordion-header" id="panelsStayOpen-headingOne">
|
||||||
|
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-collapseOne" aria-expanded="true" aria-controls="panelsStayOpen-collapseOne">
|
||||||
|
Soundscape
|
||||||
|
</button>
|
||||||
|
</h2>
|
||||||
|
<div id="panelsStayOpen-collapseOne" class="accordion-collapse collapse show" aria-labelledby="panelsStayOpen-headingOne">
|
||||||
|
<div class="accordion-body">
|
||||||
|
This is the first item's accordion body
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="accordion-item">
|
||||||
|
<h2 class="accordion-header" id="panelsStayOpen-headingTwo">
|
||||||
|
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-collapseTwo" aria-expanded="false" aria-controls="panelsStayOpen-collapseTwo">
|
||||||
|
Current activity
|
||||||
|
</button>
|
||||||
|
</h2>
|
||||||
|
<div id="panelsStayOpen-collapseTwo" class="accordion-collapse collapse" aria-labelledby="panelsStayOpen-headingTwo">
|
||||||
|
<div class="accordion-body">
|
||||||
|
This is the second item's accordion body.
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="accordion-item">
|
||||||
|
<h2 class="accordion-header" id="panelsStayOpen-headingThree">
|
||||||
|
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-collapseThree" aria-expanded="false" aria-controls="panelsStayOpen-collapseThree">
|
||||||
|
Workplace
|
||||||
|
</button>
|
||||||
|
</h2>
|
||||||
|
<div id="panelsStayOpen-collapseThree" class="accordion-collapse collapse" aria-labelledby="panelsStayOpen-headingThree">
|
||||||
|
<div class="accordion-body">
|
||||||
|
This is the third item's accordion body.
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="accordion-item">
|
||||||
|
<h2 class="accordion-header" id="panelsStayOpen-headingThree">
|
||||||
|
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-collapseThree" aria-expanded="false" aria-controls="panelsStayOpen-collapseThree">
|
||||||
|
Headphones
|
||||||
|
</button>
|
||||||
|
</h2>
|
||||||
|
<div id="panelsStayOpen-collapseThree" class="accordion-collapse collapse" aria-labelledby="panelsStayOpen-headingThree">
|
||||||
|
<div class="accordion-body">
|
||||||
|
This is the third item's accordion body.
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-12">
|
||||||
|
<div class="row pt-3">
|
||||||
|
<div class="col-7 ps-4 ">
|
||||||
|
<p class="fs-6 ms-2">Adaptive soundcape</p>
|
||||||
|
</div>
|
||||||
|
<div class="col-5 pe-4">
|
||||||
|
<div class="form-check form-switch float-end">
|
||||||
|
<input class="form-check-input" type="checkbox" role="switch" id="flexSwitchCheckDefault">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script >
|
||||||
|
export default {
|
||||||
|
name:'Subscription',
|
||||||
|
}
|
||||||
|
</script >
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.accordion-item {
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
.accordion-button:not(.collapsed) {
|
||||||
|
color: black;
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
.accordion-button:focus {
|
||||||
|
z-index: 3;
|
||||||
|
border:none;
|
||||||
|
outline: 0;
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
.accordion-button:not(.collapsed) {
|
||||||
|
background-color: white;
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
.form-switch .form-check-input {
|
||||||
|
padding: 10px 16px;
|
||||||
|
background-color: black;
|
||||||
|
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");
|
||||||
|
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Loading…
Reference in New Issue