Mindboost
/
dev-audioprocessing
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

ok

master
unknown 2022-12-17 04:17:37 +05:00
parent 7c2a0f15ad
commit 00a15f0540
20 changed files with 401 additions and 10747 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

51
assets/css/style.css Normal file
View File

@ -0,0 +1,51 @@
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@700&display=swap');
.bg-img{
background-position: center;
background-size: cover;
background-repeat: no-repeat;
/*background-image: url("../image/loginimg.png");*/
}
.form-control{
border-radius: 5px;
padding: 10px 10px;
}
.form-control:focus{
outline: none;
box-shadow: none;
border-color: orange;
}
.forgot-link{
/*text-decoration: none;*/
color: grey;
text-decoration: underline;
}
.login-btn{
background-color: #e9c046;
color: white;
font-size: 24px;
font-weight: bolder;
padding: 10px 10px;
border-radius: 10px;
border: none;
transition: .1s ease-in-out;
}
.login-ins-btn{
background-color: white;
color: black;
font-size: 24px;
font-weight: bolder;
padding: 10px 10px;
border-radius: 10px;
border: none;
border: 1px solid black;
transition: .1s ease-in-out;
}
.login-btn:hover{
background-color: #e9c059;
}
.signup-link{
color: #e9c046;
text-decoration: underline;
transition: .2s ease-in-out;
}

BIN
assets/image/Cloud software.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 28 KiB

BIN
assets/image/Delivery.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 18 KiB

BIN
assets/image/Logo.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.2 KiB

BIN
assets/image/login2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 50 KiB

BIN
assets/image/login3.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 52 KiB

BIN
assets/image/login4.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 53 KiB

BIN
assets/image/loginimg.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 50 KiB

BIN
assets/image/musicfile.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 53 KiB

39
layouts/default.vue
View File

@ -1,18 +1,35 @@
<template>
<div>
<header class="shadow-sm bg-white">
<nav class="container mx-auto p-4 justify-between flex">
<NuxtLink to="/" class="text-bold">Crave Teck</NuxtLink>
<ul class="flex gap-4">
<li><NuxtLink to="/">Home</NuxtLink></li>
<li><NuxtLink to="/about">About</NuxtLink></li>
<li><NuxtLink to="/products/1122">Product 1122</NuxtLink></li>
</ul>
</nav>
</header>
<div class="container p-4 mx-auto">
<div class="">
<slot/>
</div>
</div>
</template>
<script setup>
useHead({
title:'MindBoost',
link:[
{
href:'https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css',
rel:'stylesheet',
},
// { rel: 'stylesheet', href: '../assets/css/style.css' },
],
script:[
{
src:'https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.6/dist/umd/popper.min.js',
},
{
src:'https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.min.js',
}
]
})
</script>
<style>
/*@import "assets/css/style.css";*/
</style>

21
nuxt.config.ts
View File

@ -1,11 +1,18 @@
// https://nuxt.com/docs/api/configuration/nuxt-config
export default defineNuxtConfig({
modules: [
'@nuxtjs/tailwindcss',
'nuxt-headlessui'
],
headlessui: {
prefix: 'Headless'
}
css:[
'~/assets/css/style.css'
]
// modules: [
// '@nuxtjs/tailwindcss',
// 'nuxt-headlessui'
//
// ],
// headlessui: {
// prefix: 'Headless'
// },
})

10704
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

4
package.json
View File

@ -12,5 +12,9 @@
"@nuxtjs/tailwindcss": "^6.1.3",
"nuxt": "3.0.0",
"nuxt-headlessui": "^1.0.4"
},
"dependencies": {
"@heroicons/vue": "^2.0.13",
"bootstrap": "^5.2.3"
}
}

62
pages/about.vue
View File

@ -1,64 +1,16 @@
<template>
<div>
<!--
This example requires some changes to your config:
```
// tailwind.config.js
module.exports = {
// ...
plugins: [
// ...
require('@tailwindcss/aspect-ratio'),
],
}
```
-->
<div class="bg-white">
<div class="mx-auto max-w-2xl py-16 px-4 sm:py-24 sm:px-6 lg:max-w-7xl lg:px-8">
<h2 class="sr-only">Products</h2>
<div class="grid grid-cols-1 gap-y-10 gap-x-6 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 xl:gap-x-8">
<a href="#" class="group">
<div class="aspect-w-1 aspect-h-1 w-full overflow-hidden rounded-lg bg-gray-200 xl:aspect-w-7 xl:aspect-h-8">
<img src="https://tailwindui.com/img/ecommerce-images/category-page-04-image-card-01.jpg" alt="Tall slender porcelain bottle with natural clay textured body and cork stopper." class="h-full w-full object-cover object-center group-hover:opacity-75">
</div>
<h3 class="mt-4 text-sm text-gray-700">Earthen Bottle</h3>
<p class="mt-1 text-lg font-medium text-gray-900">$48</p>
</a>
<a href="#" class="group">
<div class="aspect-w-1 aspect-h-1 w-full overflow-hidden rounded-lg bg-gray-200 xl:aspect-w-7 xl:aspect-h-8">
<img src="https://tailwindui.com/img/ecommerce-images/category-page-04-image-card-02.jpg" alt="Olive drab green insulated bottle with flared screw lid and flat top." class="h-full w-full object-cover object-center group-hover:opacity-75">
</div>
<h3 class="mt-4 text-sm text-gray-700">Nomad Tumbler</h3>
<p class="mt-1 text-lg font-medium text-gray-900">$35</p>
</a>
<a href="#" class="group">
<div class="aspect-w-1 aspect-h-1 w-full overflow-hidden rounded-lg bg-gray-200 xl:aspect-w-7 xl:aspect-h-8">
<img src="https://tailwindui.com/img/ecommerce-images/category-page-04-image-card-03.jpg" alt="Person using a pen to cross a task off a productivity paper card." class="h-full w-full object-cover object-center group-hover:opacity-75">
</div>
<h3 class="mt-4 text-sm text-gray-700">Focus Paper Refill</h3>
<p class="mt-1 text-lg font-medium text-gray-900">$89</p>
</a>
<a href="#" class="group">
<div class="aspect-w-1 aspect-h-1 w-full overflow-hidden rounded-lg bg-gray-200 xl:aspect-w-7 xl:aspect-h-8">
<img src="https://tailwindui.com/img/ecommerce-images/category-page-04-image-card-04.jpg" alt="Hand holding black machined steel mechanical pencil with brass tip and top." class="h-full w-full object-cover object-center group-hover:opacity-75">
</div>
<h3 class="mt-4 text-sm text-gray-700">Machined Mechanical Pencil</h3>
<p class="mt-1 text-lg font-medium text-gray-900">$35</p>
</a>
<!-- More products... -->
<div class="container">
<h1 class="display-4">{{ text }}</h1>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
data(){
return{
text : "Helo World",
}
}
}
</script>

58
pages/auth/insitutionlogin.vue Normal file
View File

@ -0,0 +1,58 @@
<template>
<div>
<div class="container-fluid">
<div class="row">
<div class="col-12 col-md-5 col-lg-4 bg-img" :style="{ backgroundImage: `url(${backgroundImagePath})` }" >
</div>
<div class="col-12 col-md-7 col-lg-8 pt-5 ">
<div class="pb-3 text-center">
<img src="~/assets/image/Logo.png" style="width: 200px" />
</div>
<div class="text-center pt-1">
<h2 class="fw-bolder display-6 text-center" >Log In</h2>
<span class="fs-5 pt-1 text-muted">Welcome back, <span class="fw-bolder text-dark">Morris!</span></span>
</div>
<div class="row pt-4 pb-5">
<div class="col-12">
<form class=" ">
<div class="row pt-3 justify-content-center">
<div class="col-12 col-sm-8 col-md-8 col-lg-5">
<label class="form-label">Email</label>
<input type="email" placeholder="JohnDoe@gmail.com" class="form-control" >
</div>
</div>
<div class="row justify-content-center pt-3">
<div class="col-12 col-sm-8 col-md-8 col-lg-5">
<label class="form-label">Password</label>
<input type="password" placeholder="Password" class="form-control" >
<span class="float-end pt-2"><a class="forgot-link" href="#">Forgot Password</a></span>
</div>
</div>
<div class="row justify-content-center pb-5">
<div class="col-12 col-sm-8 col-md-8 col-lg-5 pt-4 text-center">
<button type="submit" class=" login-btn col-12" >Sign Up</button>
<h4 class="text-center">or</h4>
<button type="submit" class=" login-ins-btn col-12" >Institution Login</button>
<h5 class="text-center pt-3">Don’t have an Account? <a class="signup-link" href="#">Sign Up</a></h5>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import backgroundImagePath from '~/assets/image/login4.png'
export default {
name:'LoGin',
data(){
return{
backgroundImagePath:backgroundImagePath,
}
}
}
</script>

57
pages/auth/login.vue Normal file
View File

@ -0,0 +1,57 @@
<template>
<div>
<div class="container-fluid">
<div class="row">
<div class="col-12 col-md-5 col-lg-4 bg-img" :style="{ backgroundImage: `url(${backgroundImagePath})` }" >
</div>
<div class="col-12 col-md-7 col-lg-8 pt-5 ">
<div class="py-3 text-center">
<img src="~/assets/image/Logo.png" style="width: 200px" />
</div>
<div class="text-center pt-1">
<h2 class="fw-bolder display-6 text-center" >Log In</h2>
<span class="fs-5 pt-1 text-muted">Welcome back, <span class="fw-bolder text-dark">Morris!</span></span>
</div>
<div class="row pt-4 pb-5">
<div class="col-12 pb-5">
<form class=" pb-5 ">
<div class="row pt-3 justify-content-center">
<div class="col-12 col-sm-8 col-md-8 col-lg-5">
<label class="form-label">Email</label>
<input type="email" placeholder="JohnDoe@gmail.com" class="form-control" >
</div>
</div>
<div class="row justify-content-center pt-3">
<div class="col-12 col-sm-8 col-md-8 col-lg-5">
<label class="form-label">Password</label>
<input type="password" placeholder="Password" class="form-control" >
<span class="float-end pt-2"><a class="forgot-link" href="#">Forgot Password</a></span>
</div>
</div>
<div class="row justify-content-center pb-5">
<div class="col-12 col-sm-8 col-md-8 col-lg-5 pt-4 text-center">
<button type="submit" class=" login-btn col-12" >Sign Up</button>
<h5 class="text-center pt-3">Don’t have an Account? <NuxtLink class="signup-link" href="signup">Sign Up</NuxtLink></h5>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import backgroundImagePath from '~/assets/image/login4.png'
export default {
name:'LoGin',
data(){
return{
backgroundImagePath:backgroundImagePath,
}
}
}
</script>

74
pages/auth/signup.vue Normal file
View File

@ -0,0 +1,74 @@
<template>
<div>
<div class="container-fluid">
<div class="row">
<div class="col-12 col-lg-4 bg-img" :style="{ backgroundImage: `url(${backgroundImagePath})` }" >
</div>
<div class="col-12 col-lg-8 pt-4 px-3 px-sm-5 px-md-5 pb-5 ">
<div class="pb-2 text-center">
<img src="~/assets/image/Logo.png" style="width: 200px" />
</div>
<div class="text-center pt-1">
<h2 class="fw-bolder display-6 text-center" >Sign Up</h2>
<span class="fs-5 pt-2 text-muted">Helo , <span class="fw-bolder text-dark">Beautiful!</span></span>
<p class="text-muted pt-2 text-center fs-5 pb-0 mb-0">Mindboost helps you block out distracting noise with concentration-boosting music, increasing your productivity by up to 35%.</p>
</div>
<div class="row pt-3 pb-5">
<div class="col-12">
<form>
<div class="row px-0 px-md-4 pb-2">
<div class="col-12 pt-2 col-md-6 col-lg-6 ">
<label class="form-label">First Name</label>
<input type="text" placeholder="First Name" class="form-control">
</div>
<div class="col-12 pt-2 col-md-6 col-lg-6 ">
<label class="form-label">Surname</label>
<input type="text" placeholder="Surname" class="form-control">
</div>
</div>
<div class="row px-0 px-md-4 pb-2">
<div class="col-12 col-md-6 pt-2 col-lg-6 ">
<label class="form-label">Email</label>
<input type="text" placeholder="Email" class="form-control">
</div>
<div class="col-12 pt-2 col-md-6 col-lg-6 ">
<label class="form-label">Password</label>
<input type="password" placeholder="Password" class="form-control">
</div>
</div>
<div class="row px-4 pt-3 pb-2">
<div class="col-10">
<div class="form-check">
<input class="form-check-input" type="checkbox" value="" id="flexCheckIndeterminate">
<label class="form-check-label" for="flexCheckIndeterminate">
I agree to Mindboost's terms and conditions. You can read about how we use and protect your information in our Privacy Policy.
</label>
</div>
</div>
</div>
<div class="row px-4 pt-3">
<div class="col-12">
<button type="button" class="login-btn col-4">Signup</button>
<p class="pt-3">Already have an Account? <NuxtLink class="signup-link" href="login">Log In</NuxtLink></p>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import backgroundImagePath from '~/assets/image/login4.png'
export default {
name:'LoGin',
data(){
return{
backgroundImagePath:backgroundImagePath,
}
}
}
</script>

37
pages/getstarted.vue Normal file
View File

@ -0,0 +1,37 @@
<template>
<div>
<nav class="navbar">
<div class="container-fluid pt-3 ps-4">
<a class="navbar-brand" href="#"><img src="~/assets/image/Logo.png"></a>
</div>
</nav>
<div class="container-fluid">
<div class="row justify-content-center">
<div class="col-6 pt-2">
<h3 class="text-center fs-2">We’re About to Get Started</h3>
<p class="text-center text-muted fs-5 col-8 mx-auto">Please answer a few questions while we analyze the acoustics in your room.</p>
<div class="text-center">
<img src="~/assets/image/Delivery.png">
</div>
<form>
<div class="row pt-4 justify-content-center">
<div class="col-7 ">
<div class="form-check">
<input class="form-check-input" type="checkbox" value="" id="flexCheckIndeterminate">
<label class="form-check-label" for="flexCheckIndeterminate">
I give the app permission to use my microphone
</label>
</div>
</div>
</div>
<div class="row pt-3">
<div class="col-12 text-center pt-3">
<button type="button" class="login-btn col-4">Next</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</template>

30
pages/index.vue
View File

@ -1,35 +1,5 @@
<template>
<div>
<HeadlessCombobox v-model="selectedPerson">
<HeadlessComboboxInput class="w-full border-none py-2 pl-3 pr-10 text-sm leading-5 text-gray-900 focus:ring-0" @change="query = $event.target.value" />
<HeadlessComboboxOptions class="absolute mt-1 max-h-60 w-full overflow-auto rounded-md bg-white py-1 text-base shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none sm:text-sm">
<HeadlessComboboxOption class="mt-1 max-h-60 w-full overflow-auto rounded-md bg-white py-1 text-base shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none sm:text-sm" v-for="person in filteredPeople" :key="person" :value="person">
{{ person }}
</HeadlessComboboxOption>
</HeadlessComboboxOptions>
</HeadlessCombobox>
<h1>Home Page</h1>
</div>
</template>
<script setup>
import { ref, computed } from 'vue'
const people = [
'Wade Cooper',
'Arlene McCoy',
'Devon Webb',
'Tom Cook',
'Tanya Fox',
'Hellen Schmidt',
]
const selectedPerson = ref(people[0])
const query = ref('')
const filteredPeople = computed(() =>
query.value === ''
? people
: people.filter((person) => {
return person.toLowerCase().includes(query.value.toLowerCase())
})
)
</script>

9
pages/login.vue
View File

@ -1,9 +0,0 @@
<template>
<div>
<h1>Login Page</h1>
</div>
</template>
<script setup>
</script>