dwd-projects
/
holywisdompublicschool.com
generated from dwd/boilarplate-astro-tailwind
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

s1

b4
Suvodip 2024-08-28 20:17:09 +05:30
parent 1dfb13a8a7
commit c7884c79ef
5 changed files with 127 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/components/SliderHomepage.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<div> <div>
<div class=""> <div class="">
<swiper class="max-w-2xl cursor-pointer shadow-xl rounded-2xl" draggable="false" <swiper class="max-w-2xl cursor-pointer shadow-xl rounded-2xl" draggable="false"
:modules="modules" :modules="modules"
:slides-per-view="1" :slides-per-view="1"
:space-between="50" :space-between="50"
@ -11,6 +11,8 @@
:autoplay=" { delay: 2500, disableOnInteraction: false}" :autoplay=" { delay: 2500, disableOnInteraction: false}"
@swiper="onSwiper" @swiper="onSwiper"
@slideChange="onSlideChange"> @slideChange="onSlideChange">
<swiper-slide v-for="(item, index) in img3DResInter" :key="index"> <img class="aspect-video" :src="item.image_src" alt="" /></swiper-slide>
<swiper-slide> <img class="" src="/img/school1.jpg" alt="" /></swiper-slide> <swiper-slide> <img class="" src="/img/school1.jpg" alt="" /></swiper-slide>
<swiper-slide> <img class="" src="/img/school2.jpg" alt="" /></swiper-slide> <swiper-slide> <img class="" src="/img/school2.jpg" alt="" /></swiper-slide>
<swiper-slide> <img class="" src="/img/school3.jpg" alt="" /></swiper-slide> <swiper-slide> <img class="" src="/img/school3.jpg" alt="" /></swiper-slide>
@ -65,6 +67,7 @@
page: null, page: null,
lessonplan:null, lessonplan:null,
isLoading: true, isLoading: true,
img3DResInter: [{ image_src: "/assets/school_image/hps-image1.jpg" },{ image_src: "/assets/school_image/hps-image2.jpg" },{ image_src: "/assets/school_image/hps-image3.jpg" },{ image_src: "/assets/school_image/hps-image4.jpg" },{ image_src: "/assets/school_image/hps-image5.jpg" },{ image_src: "/assets/school_image/hps-image6.jpg" },{ image_src: "/assets/school_image/hps-image7.jpg" },{ image_src: "/assets/school_image/hps-image8.jpg" },{ image_src: "/assets/school_image/hps-image9.jpg" },{ image_src: "/assets/school_image/hps-image10.jpg" },{ image_src: "/assets/school_image/hps-image11.jpg" },{ image_src: "/assets/school_image/hps-image12.jpg" },{ image_src: "/assets/school_image/hps-image13.jpg" },{ image_src: "/assets/school_image/hps-image14.jpg" },{ image_src: "/assets/school_image/hps-image16.jpg" },{ image_src: "/assets/school_image/hps-image17.jpg" },{ image_src: "/assets/school_image/hps-image18.jpg" },{ image_src: "/assets/school_image/hps-image19.jpg" },{ image_src: "/assets/school_image/hps-image20.jpg" },{ image_src: "/assets/school_image/hps-image21.jpg" },{ image_src: "/assets/school_image/hps-image22.jpg" },{ image_src: "/assets/school_image/hps-image23.jpg" },{ image_src: "/assets/school_image/hps-image24.jpg" },{ image_src: "/assets/school_image/hps-image25.jpg" },{ image_src: "/assets/school_image/hps-image26.jpg" },{ image_src: "/assets/school_image/hps-image27.jpg" },{ image_src: "/assets/school_image/hps-image28.jpg" },{ image_src: "/assets/school_image/hps-image29.jpg" },{ image_src: "/assets/school_image/hps-image30.jpg" },{ image_src: "/assets/school_image/hps-image31.jpg" }]
} }
}, },

10
src/pages/contact.astro
View File

@ -10,9 +10,9 @@ import Layout from "../layouts/Layout.astro";
<img class="lg:max-w-2xl" src="/img/rec_girl.png" alt=""> <img class="lg:max-w-2xl" src="/img/rec_girl.png" alt="">
</div> </div>
<div class="flex flex-col w-full"> <div class="flex flex-col w-full">
<h1 class="text-3xl md:text-4xl lg:text-5xl text-[#47ae6a]">Get in Touch with Holywisdom Preschool!</h1> <h1 class="text-3xl md:text-4xl lg:text-5xl text-[#47ae6a]">Get in Touch with Holywisdom Public School!</h1>
<h2 class="text-2xl md:text-3xl text-[#3084b5] py-4">Contact us for a brighter start at Holywisdom Preschool!</h2> <h2 class="text-2xl md:text-3xl text-[#3084b5] py-4">Contact us for a brighter start at Holywisdom Public School!</h2>
<h3 class="text-xl text-justify pb-4">Drop us a line at Holywisdom Preschool – your gateway to educational excellence!</h3> <h3 class="text-xl text-justify pb-4">Drop us a line at Holywisdom Public School – your gateway to educational excellence!</h3>
<!-- <div class="flex flex-row place-content-between"> <!-- <div class="flex flex-row place-content-between">
<a href="#" class="text-sm xl:text-lg rounded-lg shadow-2xl text-[#3084b5] px-4 md:px-8 p-3 border-2 border-[#3084b5] transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-300">Get in Touch</a> <a href="#" class="text-sm xl:text-lg rounded-lg shadow-2xl text-[#3084b5] px-4 md:px-8 p-3 border-2 border-[#3084b5] transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-300">Get in Touch</a>
</div> --> </div> -->
@ -21,8 +21,8 @@ import Layout from "../layouts/Layout.astro";
</section> </section>
<section class="container mx-auto px-4 my-10"> <section class="container mx-auto px-4 my-10">
<div class=""> <div class="">
<h1 class="text-2xl">Reach Out to Holywisdom Preschool</h1> <h1 class="text-2xl">Reach Out to Holywisdom Public School</h1>
<p class="">Contacting Holywisdom Preschool is your first step toward a seamless connection with our dedicated team. Whether you have inquiries about our programs, enrollment details, or simply want to learn more about our unique approach to early childhood education, we're here to help. Your child's journey with us begins with a conversation. Reach out through the provided contact information, and let's embark on the path of educational discovery together. We look forward to hearing from you and welcoming your family into the Holywisdom community.</p> <p class="">Contacting Holywisdom Public School is your first step toward a seamless connection with our dedicated team. Whether you have inquiries about our programs, enrollment details, or simply want to learn more about our unique approach to early childhood education, we're here to help. Your child's journey with us begins with a conversation. Reach out through the provided contact information, and let's embark on the path of educational discovery together. We look forward to hearing from you and welcoming your family into the Holywisdom community.</p>
</div> </div>
</section> </section>
<section class="container mx-auto px-4 my-16"> <section class="container mx-auto px-4 my-16">

40
src/pages/form.astro Normal file
View File

@ -0,0 +1,40 @@
<div>
<input type="text" name="name" id="name" style="border: 1px solid #000"><br>
<input type="text" name="mobile" id="mobile" style="border: 1px solid #000"><br>
<input type="text" name="email" id="email" style="border: 1px solid #000"><br>
<textarea name="message" id="message" style="border: 1px solid #000"></textarea><br>
<button onclick="saveForm(event)" type="submit" style="border: 1px solid #000">Submit</button>
</div>
<script is:inline>
function saveForm(event){
event.preventDefault();
let userName = document.getElementById('name').value;
let userMobile = document.getElementById('mobile').value;
let userEmail = document.getElementById('email').value;
let userMessage = document.getElementById('message').value;
let userData = {
name : userName,
mobile: userMobile,
email: userEmail,
message: userMessage
}
fetch(`https://game-du.teachertrainingkolkata.in/items/contact`, {
method: 'POST',
headers:{
'Content-Type' : 'application/json'
},
body: JSON.stringify(userData)
})
.then(response => response.json())
.then(data => {
console.log(data)
})
.then(error => {
console.error(error)
})
}
</script>

28
src/pages/login.astro
View File

@ -5,15 +5,37 @@
<div class="flex flex-col w-full justify-center place-items-center border-[1px] border-[#0e0f0420] rounded-[20px] shadow-2xl py-10"> <div class="flex flex-col w-full justify-center place-items-center border-[1px] border-[#0e0f0420] rounded-[20px] shadow-2xl py-10">
<img class="max-w-[150px] shadow-lg p-2 py-6 border-[1px] rounded-full" src="/img/hps_logo.png" alt=""> <img class="max-w-[150px] shadow-lg p-2 py-6 border-[1px] rounded-full" src="/img/hps_logo.png" alt="">
<form action="" class="p-6"> <form action="" class="p-6">
<input v-model="name" id="name" name="name" type="text" placeholder="User ID" class="border-2 focus:border-[#47ae6a] border-[#3084b5] focus:outline-none rounded-lg w-full p-2" required/> <input id="email" name="email" type="text" placeholder="User ID" class="border-2 focus:border-[#47ae6a] border-[#3084b5] focus:outline-none rounded-lg w-full p-2" required/>
<input v-model="name" id="name" name="name" type="password" placeholder="Passsord" class="border-2 focus:border-[#47ae6a] border-[#3084b5] focus:outline-none rounded-lg w-full p-2 mt-6" required/> <input id="password" name="password" type="password" placeholder="Passsord" class="border-2 focus:border-[#47ae6a] border-[#3084b5] focus:outline-none rounded-lg w-full p-2 mt-6" required/>
<button class="border-2 border-[#3084b5] text-white bg-[#3084b5] focus:outline-none rounded-lg w-full p-2 mt-4">Login</button> <button onclick="myFunction(event)" class="border-2 border-[#3084b5] text-white bg-[#3084b5] focus:outline-none rounded-lg w-full p-2 mt-4">Login</button>
</form> </form>
<p class="">Not Registerd? <a href="/sign-up" class="text-[#FFFFFF] font-bold">Register Now</a></p> <p class="">Not Registerd? <a href="/sign-up" class="text-[#FFFFFF] font-bold">Register Now</a></p>
</div> </div>
</section> </section>
</div> </div>
</main> </main>
<script is:inline>
function myFunction(event){
event.preventDefault();
let emailId = document.getElementById('email').value;
let password = document.getElementById('password').value;
let userData = {
email : emailId,
password : password
}
fetch(`https://game-du.teachertrainingkolkata.in/auth/login`, {
method: 'POST',
headers: {
'Content-Type' : 'application/json'
},
body: JSON.stringify(userData)
})
.then(res => res.json())
.then(data => {
console.log(data)
})
}
</script>
<style> <style>
.content { .content {
position: absolute; position: absolute;

65
src/pages/sign-up.astro
View File

@ -2,23 +2,64 @@
<div class="content"> <div class="content">
<section class="container mx-auto max-w-lg bg-[url(/img/hps_logo.png)] rounded-2xl"> <section class="container mx-auto max-w-lg bg-[url(/img/hps_logo.png)] rounded-2xl">
<div class="flex flex-col w-full justify-center place-items-center border-[1px] border-[#0e0f0420] rounded-[20px] shadow-2xl py-10"> <div class="flex flex-col w-full justify-center place-items-center border-[1px] border-[#0e0f0420] rounded-[20px] shadow-2xl py-10">
<img class="max-w-[150px] shadow-lg p-2 py-6 border-[1px] rounded-full" src="/img/hps_logo.png" alt=""> <img class="max-w-[150px] shadow-lg p-2 py-6 border-[1px] rounded-full" src="/img/hps_logo.png" alt="Logo">
<form action="" class="p-6 space-y-4"> <form action="" class="p-6 space-y-4" onsubmit="signUp(event)">
<input v-model="name" id="name" name="name" type="text" placeholder="Name" class="border-2 focus:border-[#47ae6a] border-[#3084b5] focus:outline-none rounded-lg w-full p-2" required/> <input id="name" name="name" type="text" placeholder="Name" class="border-2 focus:border-[#47ae6a] border-[#3084b5] focus:outline-none rounded-lg w-full p-2" required />
<input v-model="name" id="name" name="name" type="text" placeholder="Email ID" class="border-2 focus:border-[#47ae6a] border-[#3084b5] focus:outline-none rounded-lg w-full p-2" required/> <input id="email" name="email" type="email" placeholder="Email ID" class="border-2 focus:border-[#47ae6a] border-[#3084b5] focus:outline-none rounded-lg w-full p-2" required />
<input v-model="name" id="name" name="name" type="text" placeholder="Mobile Number" class="border-2 focus:border-[#47ae6a] border-[#3084b5] focus:outline-none rounded-lg w-full p-2" required/> <input id="mobile" name="mobile" type="text" placeholder="Mobile Number" class="border-2 focus:border-[#47ae6a] border-[#3084b5] focus:outline-none rounded-lg w-full p-2" required />
<input v-model="name" id="name" name="name" type="password" placeholder="New Passsord" class="border-2 focus:border-[#47ae6a] border-[#3084b5] focus:outline-none rounded-lg w-full p-2" required/> <input id="password" name="password" type="password" placeholder="New Password" class="border-2 focus:border-[#47ae6a] border-[#3084b5] focus:outline-none rounded-lg w-full p-2" required />
<input v-model="name" id="name" name="name" type="password" placeholder="Confirm Passsord" class="border-2 focus:border-[#47ae6a] border-[#3084b5] focus:outline-none rounded-lg w-full p-2" required/> <input id="con_password" name="con_password" type="password" placeholder="Confirm Password" class="border-2 focus:border-[#47ae6a] border-[#3084b5] focus:outline-none rounded-lg w-full p-2" required />
<button class="border-2 border-[#3084b5] text-white bg-[#3084b5] focus:outline-none rounded-lg w-full p-2 mt-4">Register</button> <button type="submit" class="border-2 border-[#3084b5] text-white bg-[#3084b5] focus:outline-none rounded-lg w-full p-2 mt-4">Register</button>
</form> </form>
<div class="flex flex-col place-content-between float-left"> <div class="flex flex-col">
<p class="">Back to <a href="/login" class="text-[#3084b5] font-bold">Login</a></p> <p>Back to <a href="/login" class="text-[#3084b5] font-bold">Login</a></p>
<p class="">Continue Without <a href="/" class="text-[#3084b5] font-bold">Login</a></p> <p><a href="/" class="text-[#3084b5] font-bold">Continue</a> Without Login</p>
</div> </div>
</div> </div>
</section> </section>
</div> </div>
</main> </main>
<script is:inline>
function signUp(event) {
event.preventDefault(); // Prevent form submission
let password = document.getElementById('password').value;
let conPassword = document.getElementById('con_password').value;
if (password !== conPassword) {
alert('Passwords do not match. Please try again.');
return;
}
let userName = document.getElementById('name').value;
let userEmail = document.getElementById('email').value;
let userMobile = document.getElementById('mobile').value;
let userSignData = {
name: userName,
email: userEmail,
mobile: userMobile,
password: password
};
console.log(userSignData)
fetch('https://game-du.teachertrainingkolkata.in/users', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify(userSignData)
})
.then(res => res.json())
.then(data => {
console.log(data)
})
.catch(error => {
console.error('Error:', error);
});
}
</script>
<style> <style>
.content { .content {
position: absolute; position: absolute;
@ -26,4 +67,4 @@
left: 50%; left: 50%;
transform: translate(-50%, -50%); transform: translate(-50%, -50%);
} }
</style> </style>