dwd-projects
/
teenybeanspreschoolcurriculum.com
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

update

master
Suvodip Ghosh 2023-02-17 13:47:24 +05:30
parent 36435bbfa3
commit 7d4b68b55b
10 changed files with 572 additions and 55 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/components/Blog.vue
View File

@ -1,6 +1,6 @@
<template> <template>
<div> <div>
<div class="container-fluid z-0" style="background: linear-gradient(360deg, rgba(18, 75, 189, 0.08) 0%, rgba(18, 75, 189, 0) 100%);"> <!-- <div class="container-fluid z-0" style="background: linear-gradient(360deg, rgba(18, 75, 189, 0.08) 0%, rgba(18, 75, 189, 0) 100%);">
<div class="flex justify-center"> <div class="flex justify-center">
<div class="mt-9 inline-flex p-2"> <div class="mt-9 inline-flex p-2">
@ -30,9 +30,10 @@
</div> </div>
</div> </div>
</div> </div> -->
<section class="container mx-auto"> <section class="container mx-auto">
<div class="flex justify-center pt-2 pb-2 m-5 overflow-x-auto"> <!-- <section class="container mx-auto">
<div class="flex justify-center pt-2 pb-2 m-5 overflow-x-auto">
<div class="ml-12 mr-9 pl-9 pr-9 md:hidden"> &nbsp;</div> <div class="ml-12 mr-9 pl-9 pr-9 md:hidden"> &nbsp;</div>
<div class="ml-9 mr-9 pl-9 pr-9 md:hidden"> &nbsp;</div> <div class="ml-9 mr-9 pl-9 pr-9 md:hidden"> &nbsp;</div>
<div class="ml-9 mr-9 pl-9 pr-9 md:hidden"> &nbsp;</div> <div class="ml-9 mr-9 pl-9 pr-9 md:hidden"> &nbsp;</div>
@ -47,6 +48,8 @@
<a href="/blog/?category=video-articles" class="h-12 flex-none p-3 text-blue-700 hover:text-white hover:bg-blue-700 border-2 border-blue-700 border-r-0"> Video Articles </a> <a href="/blog/?category=video-articles" class="h-12 flex-none p-3 text-blue-700 hover:text-white hover:bg-blue-700 border-2 border-blue-700 border-r-0"> Video Articles </a>
<a href="/blog/?category=occassion" class="h-12 flex-none p-3 text-blue-700 hover:text-white hover:bg-blue-700 border-2 border-blue-700 "> Occassion </a> <a href="/blog/?category=occassion" class="h-12 flex-none p-3 text-blue-700 hover:text-white hover:bg-blue-700 border-2 border-blue-700 "> Occassion </a>
</div> </div>
</section> -->
<div class="xl:px-24"> <div class="xl:px-24">
<div class="grid grid-cols-1 lg:grid-cols-2 xl:grid-cols-3"> <div class="grid grid-cols-1 lg:grid-cols-2 xl:grid-cols-3">
<div v-for="(item, index) in tbBlog" class="shadow-md rounded p-2 m-2"> <div v-for="(item, index) in tbBlog" class="shadow-md rounded p-2 m-2">

19
src/components/BlogFilter.vue Normal file
View File

@ -0,0 +1,19 @@
<template>
<section class="container mx-auto">
<div class="flex justify-center pt-2 pb-2 m-5 overflow-x-auto">
<div class="ml-12 mr-9 pl-9 pr-9 md:hidden"> &nbsp;</div>
<div class="ml-9 mr-9 pl-9 pr-9 md:hidden"> &nbsp;</div>
<div class="ml-9 mr-9 pl-9 pr-9 md:hidden"> &nbsp;</div>
<div class="ml-9 mr-9 pl-9 pr-9 md:hidden"> &nbsp;</div>
<div class="ml-9 mr-9 md:hidden"> &nbsp;</div>
<a href="/blog/?category=classroom-solution" class="h-12 flex-none p-3 text-blue-700 hover:text-white hover:bg-blue-700 border-2 border-blue-700 border-r-0"> Classroom Solution </a >
<a href="/blog/?category=preschool-solution" class="h-12 flex-none p-3 text-blue-700 hover:text-white hover:bg-blue-700 border-2 border-blue-700 border-r-0"> Preschool Solution </a>
<a href="/blog/?category=technology" class="h-12 flex-none p-3 text-blue-700 hover:text-white hover:bg-blue-700 border-2 border-blue-700 border-r-0"> Technology </a>
<a href="/blog/?category=curriculum" class="h-12 flex-none p-3 text-blue-700 hover:text-white hover:bg-blue-700 border-2 border-blue-700 border-r-0"> Curriculum </a>
<a href="/blog/?category=marketting" class="h-12 flex-none p-3 text-blue-700 hover:text-white hover:bg-blue-700 border-2 border-blue-700 border-r-0"> Marketing </a>
<a href="/blog/?category=lesson-plans" class="h-12 flex-none p-3 text-blue-700 hover:text-white hover:bg-blue-700 border-2 border-blue-700 border-r-0"> Lesson Plans </a>
<a href="/blog/?category=video-articles" class="h-12 flex-none p-3 text-blue-700 hover:text-white hover:bg-blue-700 border-2 border-blue-700 border-r-0"> Video Articles </a>
<a href="/blog/?category=occassion" class="h-12 flex-none p-3 text-blue-700 hover:text-white hover:bg-blue-700 border-2 border-blue-700 "> Occassion </a>
</div>
</section>
</template>

40
src/components/BlogHeroSearch.vue Normal file
View File

@ -0,0 +1,40 @@
<template>
<div>
<div class="container-fluid z-0" style="background: linear-gradient(360deg, rgba(18, 75, 189, 0.08) 0%, rgba(18, 75, 189, 0) 100%);">
<div class="flex justify-center">
<div class="mt-9 inline-flex p-2">
</div>
</div>
<div class="flex justify-center">
<div class="mt-9 inline-flex p-2 font-serif text-2xl italic text-red-800 font-semibold">
<span class="text-blue-600" >Teeny Beans Curriculum </span> &nbsp; <span class=" text-yellow-900" > Blog </span>
</div>
</div>
<div class="flex justify-center">
<div class="mb-9 inline-flex p-1">
<form>
<label for="default-search" class="mb-2 text-sm font-medium text-gray-900 sr-only ">Search</label>
<div class="relative w-96">
<div class="flex absolute inset-y-0 left-0 items-center pl-3 pointer-events-none">
<svg aria-hidden="true" class="w-5 h-5 text-gray-500 " fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"></path></svg>
</div>
<input type="search" id="default-search" class="block p-4 pl-10 w-full text-sm text-gray-900 bg-gray-50 rounded-lg border border-gray-300 focus:ring-blue-500 focus:border-blue-500 " placeholder="Search our articles" required>
<button type="submit" class="text-white absolute right-2.5 bottom-2.5 bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-4 py-2 ">Search</button>
</div>
</form>
</div>
</div>
<div class="flex justify-center">
<div class="mt-9 inline-flex p-2">
</div>
</div>
</div>
</div>
</template>
<style>
.text-color-1 {
color: #7C4C23;
}
</style>

119
src/components/Menu.astro
View File

@ -1,48 +1,52 @@
<main class="container-fluid navbar"> <main class="container-fluid bg-base-100 shadow-md">
<!-- Desktop Menu --> <!-- Desktop Menu -->
<div class="container mx-auto flex justify-center"> <div class="container mx-auto xl:px-24 hidden md:flex place-content-between w-full">
<div class="hidden md:block py-4"> <div class="flex place-items-center w-fit">
<div class="navbar"> <a href="/"><img class="w-36 h-12 lg:w-fit lg:h-fit hover:bg-none" src="/img/tb-logo.png" alt="Teeny Beans Logo"/></a>
<a href="#home">Educators</a> </div>
<a href="#news">Administrators</a> <div class="flex flex-col"></div>
<div class="flex place-items-center py-4">
<div class="navbar w-full">
<a href="/educators">Educators</a>
<a href="/administrators">Administrators</a>
<div class="dropdownDesktop"> <div class="dropdownDesktop">
<button class="dropbtnDesktop">Recources <button class="dropbtnDesktop">Recources ▼
<i class="fa fa-caret-downDesktop"></i> <i class="fa fa-caret-downDesktop"></i>
</button> </button>
<div class="dropdown-contentDesktop"> <div class="dropdown-contentDesktop">
<a href="#">Worksheets</a> <a class="" href="/worksheets">Worksheets</a>
<a href="#">Videos</a> <a href="/videos">Videos</a>
<a href="#">Audio Books</a> <a href="/audio-books">Audio Books</a>
<a href="#">Lesson Plan</a> <a href="/lesson-plan/dailyplan">Lesson Plan</a>
</div> </div>
</div> </div>
<a href="occassion">Occassion</a> <a href="/occassion">Occassion</a>
<a href="themes">Themes</a> <a href="/themes">Themes</a>
<a href="blog">Blog</a> <a href="/blog">Blog</a>
</div> </div>
</div> </div>
</div> </div>
<!-- Mobile Menu --> <!-- Mobile Menu -->
<div class="mobileTopMenu block md:hidden"> <div class="mobileTopMenu block md:hidden">
<div class="topnavMobile"> <div class="topnavMobile">
<a href="#home" class="active">Logo</a> <a href="/" class=""><img src="/img/tb-logo.png" alt="Teeny Beans Logo"></a>
<div id="mobileMenu" class="hidden"> <div id="mobileMenu" class="hidden active">
<a href="#news">Educators</a> <a class="hover:bg-gray-200" href="/educators">Educators</a>
<a href="#contact">Administrators</a> <a class="hover:bg-gray-200" href="/administrators">Administrators</a>
<div class="dropdown"> <div class="dropdown">
<button class="dropbtn">Dropdown &#11183</button> <button class="dropbtn">Recources ▼</button>
<div class="dropdown-content"> <div class="dropdown-content">
<a href="#">Link 1</a> <a href="/worksheets" style="color: white;">Worksheets</a>
<a href="#">Link 2Link 2Link 2</a> <a href="/videos" style="color: white;">Videos</a>
<a href="#">Link 3</a> <a href="/audio-books" style="color: white;">Audio Books</a>
<a href="/lesson-plan/dailyplan" style="color: white;">Lesson Plan</a>
</div> </div>
</div> </div>
<a href="#about">About</a> <a class="hover:bg-gray-200" href="/occassion">Occassion</a>
<a href="#about">About</a> <a class="hover:bg-gray-200" href="/themes">Themes</a>
<a href="#about">About</a> <a class="hover:bg-gray-200" href="/blog">Blog</a>
<a href="#about">About</a>
</div> </div>
<a class="icon" onclick="openMobileMenu()"> <a class="icon" onclick="openMobileMenu()">
&#9776; &#9776;
@ -63,7 +67,7 @@ element.classList.toggle("hidden");
<style> <style>
.navbar { .navbar {
overflow: hidden; overflow: hidden;
background-color: rgb(150, 39, 39); /* background-color: rgb(150, 39, 39); */
/* position: absolute; /* position: absolute;
width: 100%; width: 100%;
left: 0; left: 0;
@ -71,12 +75,14 @@ top: 0; */
} }
.navbar a { .navbar a {
float: left; float: left;
font-size: 16px; font-size: 16px;
color: white; color: #7c4c23;
text-align: center; font-weight: bold;
padding: 14px 16px; text-align: center;
text-decoration: none; padding: 14px 12px;
font-family: quicksand;
text-decoration: none;
} }
.dropdownDesktop { .dropdownDesktop {
@ -89,29 +95,32 @@ overflow: hidden;
font-size: 16px; font-size: 16px;
border: none; border: none;
outline: none; outline: none;
color: white; color: #7c2d23;
padding: 14px 16px; font-weight: bold;
padding: 14px 10px;
background-color: inherit; background-color: inherit;
font-family: inherit; font-family: inherit;
margin: 0; margin: 0;
} }
.navbar a:hover, .dropdownDesktop:hover .dropbtnDesktop { .navbar a:hover, .dropdownDesktop:hover .dropbtnDesktop {
background-color: red; background-color: #f1f5f9;
border-radius: 8px;
} }
.dropdown-contentDesktop { .dropdown-contentDesktop {
display: none; display: none;
position: absolute; position: absolute;
background-color: #f9f9f9; /* background-color: #f9f9f9; */
min-width: 160px; /* min-width: 160px; */
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
z-index: 1; z-index: 1;
background-color: #1d4ed8;
} }
.dropdown-contentDesktop a { .dropdown-contentDesktop a {
float: none; float: none;
color: black; color: rgb(255, 255, 255);
padding: 12px 16px; padding: 12px 16px;
text-decoration: none; text-decoration: none;
display: block; display: block;
@ -119,7 +128,7 @@ text-align: left;
} }
.dropdown-contentDesktop a:hover { .dropdown-contentDesktop a:hover {
background-color: #ddd; background-color: #1e40af;
} }
.dropdownDesktop:hover .dropdown-contentDesktop { .dropdownDesktop:hover .dropdown-contentDesktop {
@ -137,10 +146,12 @@ width:100%;
} */ } */
.dropdown:hover .dropdown-content { .dropdown:hover .dropdown-content {
display: block; display: block;
background-color: #ddd; background-color: #1d4ed8;
color: white;
} }
.dropdown-content a:hover { .dropdown-content a:hover {
background-color: #ddd; background-color: #1e40af;
color: white;
} }
.dropdown-content { .dropdown-content {
display: none; display: none;
@ -160,35 +171,39 @@ text-align: left;
.topnavMobile { .topnavMobile {
overflow: hidden; overflow: visible;
background-color: #333; background-color: rgb(255, 255, 255);
position: relative; position: relative;
} }
.topnavMobile a, .topnavMobile >div > div { .topnavMobile a, .topnavMobile >div > div {
color: white; color: #7c4c23;
padding: 14px 16px; font-weight: bold;
padding: 10px 16px;
text-decoration: none; text-decoration: none;
font-size: 17px; font-size: 16px;
display: block; display: block;
} }
.topnavMobile a.icon { .topnavMobile a.icon {
background: black; color: white;
background: #1d4ed8;
display: block; display: block;
position: absolute; position: absolute;
right: 0; right: 0;
top: 0; top: 0;
cursor: pointer;
} }
.topnavMobile a:hover { .topnavMobile a:hover {
background-color: #ddd; /* background-color: #1e40af; */
color: black; /* color: hsl(0, 0%, 100%); */
background-color: ;
} }
.active { .active {
background-color: #aa6204; /* background-color: #1e40af; */
color: white; color: white;
} }

200
src/components/Menu2.astro Normal file
View File

@ -0,0 +1,200 @@
<main class="container-fluid navbar">
<!-- Desktop Menu -->
<div class="container mx-auto flex justify-center">
<div class="hidden md:block py-4">
<div class="navbar">
<a href="#home">Educators</a>
<a href="#news">Administrators</a>
<div class="dropdownDesktop">
<button class="dropbtnDesktop">Recources
<i class="fa fa-caret-downDesktop"></i>
</button>
<div class="dropdown-contentDesktop">
<a href="#">Worksheets</a>
<a href="#">Videos</a>
<a href="#">Audio Books</a>
<a href="#">Lesson Plan</a>
</div>
</div>
<a href="occassion">Occassion</a>
<a href="themes">Themes</a>
<a href="blog">Blog</a>
</div>
</div>
</div>
<!-- Mobile Menu -->
<div class="mobileTopMenu block md:hidden">
<div class="topnavMobile">
<a href="#home" class="active">Logo</a>
<div id="mobileMenu" class="hidden flex flex-col ">
<a href="#news">Educators</a>
<a href="#contact">Administrators</a>
<div class="dropdown ">
<h2 class="dropbtn text-center" >Dropdown &#11183</h2>
<div class="dropdown-content">
<a href="#">Link 1</a>
<a href="#">Link 2Link 2Link 2</a>
<a href="#">Link 3</a>
</div>
</div>
<a href="#about">About</a>
<a href="#about">About</a>
<a href="#about">About</a>
<a href="#about">About</a>
</div>
<a class="icon" onclick="openMobileMenu()">
&#9776;
</a>
</div>
</div>
</main>
<script is:inline>
function openMobileMenu() {
var element = document.getElementById("mobileMenu");
element.classList.toggle("hidden");
}
</script>
<style>
.dropbtn{
margin: 0 auto;
}
.navbar {
overflow: hidden;
background-color: rgb(150, 39, 39);
/* position: absolute;
width: 100%;
left: 0;
top: 0; */
}
.navbar a {
float: left;
font-size: 16px;
color: white;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
.dropdownDesktop {
float: left;
overflow: hidden;
}
.dropdownDesktop .dropbtnDesktop {
font-size: 16px;
border: none;
outline: none;
color: white;
padding: 14px 16px;
background-color: inherit;
font-family: inherit;
margin: 0;
}
.navbar a:hover, .dropdownDesktop:hover .dropbtnDesktop {
background-color: red;
}
.dropdown-contentDesktop {
display: none;
position: absolute;
background-color: #f9f9f9;
min-width: 160px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
z-index: 1;
}
.dropdown-contentDesktop a {
float: none;
color: black;
padding: 12px 16px;
text-decoration: none;
display: block;
text-align: left;
}
.dropdown-contentDesktop a:hover {
background-color: #ddd;
}
.dropdownDesktop:hover .dropdown-contentDesktop {
display: block;
}
/* .mobileTopMenu{
position: absolute;
top:0;
left:0;
width:100%;
} */
.dropdown:hover .dropdown-content {
display: block;
background-color: #ddd;
}
.dropdown-content a:hover {
background-color: #ddd;
}
.dropdown-content {
display: none;
position: absolute;
z-index: 1;
}
.dropdown-content a {
float: none;
text-decoration: none;
display: block;
text-align: left;
}
.topnavMobile {
overflow: hidden;
background-color: #333;
position: relative;
}
.topnavMobile a, .topnavMobile >div > div {
color: white;
padding: 14px 16px;
text-decoration: none;
font-size: 17px;
display: block;
}
.topnavMobile a.icon {
background: black;
display: block;
position: absolute;
right: 0;
top: 0;
}
.topnavMobile a:hover {
background-color: #ddd;
color: black;
}
.active {
background-color: #aa6204;
color: white;
}
</style>

211
src/components/WhatsNew.vue Normal file
View File

@ -0,0 +1,211 @@
<template>
<div>
<section class="bg-gradient-to-t bg3 shadow-2xl container-fluid">
<div class="flex flex-col xl:flex-row container mx-auto px-4 xl:px-24">
<div class="flex flex-col px-6 justify-center w-fit">
<h1 class="text-color-1 hero-text font-bold">What’s New In Preschool Education ?</h1>
<p class="font-20px text-justify">What’s more exciting and effective than young children’s introduction to technology and its wonders in the foundation laying stage of their lives? The escalating technological practices demand everyone to be advanced, even toddlers because that’s how their interests and skills grow! Instill new skills with the ‘What’s New’ feature by Teeny Beans Preschool Curriculum and bring in the newest teaching trend in preschool education to your little ones.</p>
</div>
<div class="flex w-full justify-center place-items-center">
<img class="w-full rounded-3xl" src="/img/whats_new1.png" alt="">
</div>
</div>
</section>
<!-- <section class="container-fluid">
<div class="bg-gradient-to-t from-blue-200 px-4">
<h1 class="text-center py-24 md:pt-24 text-color-1 hero-text font-bold">What’s New In Preschool Education ?</h1>
</div>
<div class="container-fluid shadow-xl">
<p class="container mx-auto font-20px text-justify p-4">What’s more exciting and effective than young children’s introduction to technology and its wonders in the foundation laying stage of their lives?
The escalating technological practices demand everyone to be advanced, even toddlers because that’s how their interests and skills grow! Instill new skills with the ‘What’s New’ feature by Teeny Beans Preschool Curriculum and bring in the newest teaching trend in preschool education to your little ones. </p>
</div>
</section> -->
<!-- <section class="container mx-auto px-4">
<div class="grid grid-rows-2">
<div class="flex flex-col lg:flex-row place-items-center gap-6 ">
<div @click="showDescription('tabDetails')" class="flex relative"><img draggable="false" src="/img/robot.png" alt="">
<h1 class="absolute inset-20 left-40 text-4xl text-white">Robotics</h1>
</div>
<div class="flex relative"><img draggable="false" src="/img/group.png" alt="">
<h1 class="absolute inset-20 left-40 text-4xl text-white">Coding</h1>
</div>
</div>
</div>
</section> -->
<section class="container mx-auto mt-16 px-4">
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
<div class="grid place-items-center"><img class="shadow-xl" src="/img/robot.png" alt="robot"></div>
<div class="grid h-fit">
<h2 class="hero-text text-color-1 font-semibold">Robotics</h2>
<p class="font-20px text-color-2 py-3 text-justify">Boost children’s interest and skills in robotics at the earliest stage of life and introduce them to a world of technology and opportunities. As a sub head of STEM, robotics induces creativity into children and makes their minds active.</p>
<p class="font-20px text-justify pl-6">
&#8226; With our platform for Robotics, add the subject to your curriculum and inject out of the box thoughts in your kids. <br>
&#8226; Begin the first step to the enlightenment journey in early childhood education. <br>
&#8226; The right way to instill skills is through the right practise of Robotics, with right revision and resources that we supply! <br>
&#8226; Teach while disguising it as a play. <br>
&#8226; Preparation of a better and technologically advanced future commences with Robotics and Teeny Beans Preschool Curriculum. </p>
<p class="font-20px py-4">Implant the seeds of innovation and ideas with the introduction of ‘Robotics’ to your preschool curriculum. </p>
</div>
</div>
</section>
<!-- <section class="conatiner-fluid shadow">1</section> -->
<hr>
<section class="container mx-auto mt-16 px-4">
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
<div class="grid place-items-center"><img class="shadow-xl" src="/img/group.png" alt="group"></div>
<div class="grid h-fit">
<h2 class="hero-text text-color-1 font-semibold">Coding</h2>
<p class="font-20px text-color-2 py-3 text-justify">A digital world with digitally advanced youngsters sounds like a great plan? Making toddlers acquainted with coding to make them think as a computer programmer is a kick start to their future. </p>
<p class="font-20px text-justify pl-6">
&#8226; Disguised Fun-activities and games that make children learn without their notice.<br>
&#8226; Generate logical thinking with problem solving skills at the accurate age for laying a better educational foundation. <br>
&#8226; Children develop resilience and get competitive with Coding. <br>
&#8226; With Teeny Beans Preschool Curriculum, access easy coding resources such as fun games, activities, worksheets, quizzes and much more to make them learn and grow simultaneously. <br>
</p>
<p class="font-20px py-4">Educate children with the newest preschool education trends and give a boost to their journey of a better version of themselves and open a door to wider opportunities of growth for them. </p>
</div>
</div>
</section>
<hr>
<section class="my-16"></section>
<!-- <section>
<div v-if="tab">
<div id="robottext" class="flex flex-col">
<h1 class="text-color-3 text-4xl font-semibold pt-12 pb-2">Why should you include Robotics in your Preschool Curriculum?</h1>
<p class="text-2xl text-justify text-color-2">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas magna non senectus orci ultrices. Neque, mollis mauris est blandit mi at tincidunt vehicula. Nunc, in egestas senectus pharetra massa dignissim massa. Eu mi a risus ullamcorper sed consectetur fermentum praesent egestas. Sit aliquet tellus gravida lorem scelerisque. Volutpat sit arcu orci, lorem vel. Cras pellentesque odio libero, sed pellentesque facilisis ut rhoncus. Pellentesque purus quam erat vulputate. Sit pulvinar tempus tortor ultrices. In nulla cras.</p>
</div>
</div>
<div v-if="robot">
<div id="robottext" class="flex flex-col">
<h1 class="text-color-3 text-4xl font-semibold pt-12 pb-2">Why should you include Robotics in your Preschool Curriculum?</h1>
<p class="text-2xl text-justify text-color-2">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas magna non senectus orci ultrices. Neque, mollis mauris est blandit mi at tincidunt vehicula. Nunc, in egestas senectus pharetra massa dignissim massa. Eu mi a risus ullamcorper sed consectetur fermentum praesent egestas. Sit aliquet tellus gravida lorem scelerisque. Volutpat sit arcu orci, lorem vel. Cras pellentesque odio libero, sed pellentesque facilisis ut rhoncus. Pellentesque purus quam erat vulputate. Sit pulvinar tempus tortor ultrices. In nulla cras.</p>
</div>
</div>
</section> -->
<section class="container mx-auto px-4">
<div class="grid csbg grid-cols-1 md:grid-cols-2 mt-32 mb-16 ">
<div class="grid place-items-center">
<div class="grid text-color-1 text-4xl pt-10 font-semibold">Case Study</div>
<div class="w-full max-w-lg pb-16">
<h3 class="text-center text-xl p-4">You can download the case study here</h3>
<div v-if="wnQry">
<div class="flex flex-wrap mb-6">
<div class="w-full md:w-3/3 px-3 mb-6 md:mb-0">
<input v-model="wnname" class="appearance-none block w-full bg-gray-200 text-gray-700 border border-gray-200 rounded py-3 px-4 mb-3 leading-tight focus:outline-none focus:bg-white" type="text" placeholder="Your Name">
</div>
</div>
<div class="flex flex-wrap mb-6">
<div class="w-full md:w-3/3 px-3 mb-6 md:mb-0">
<input v-model="wnemail" class="appearance-none block w-full bg-gray-200 text-gray-700 border border-gray-200 rounded py-3 px-4 mb-3 leading-tight focus:outline-none focus:bg-white" type="text" placeholder="Your E-mail Id">
</div>
</div>
<div class="flex justify-center -mt-4">
<button @click="saveWhatsnewQry" class="bg-blue-700 p-1 text-white pl-4 pr-4 rounded-tl-lg rounded-br-lg mb-8 h-9" >Download Now</button>
</div>
</div>
<div v-else="saveWhatsnewQry"> <h1 class="text-center text-xl">Thank You!</h1></div>
</div>
</div>
<div class="grid place-items-center">
<div class="grid bg-gray-200 ml-0 w-72 -rotate-12 rounded-tl-3xl rounded-br-3xl shadow-2xl">
<img class=" rotate-6 rounded-tl-3xl rounded-br-3xl" src="/img/case_study.png" alt="Case Study Image"></div>
</div>
</div>
</section>
</div>
</template>
<script>
export default {
data() {
return {
isLoading: true,
wnQry:true,
wnname: null,
wnemail: null,
robot:true,
tab:false
// contact_form:{}
}
},
mounted: function () {
// this.getItemByCategory()
// console.log(this.smProducts)
// console.log(this.$route.query.cat)
// console.log(this.fruits)
},
methods: {
saveWhatsnewQry() {
let formData = new FormData();
formData.append('Name', this.wnname);
formData.append('Phone', this.wnemail);
formData.append('formName', 'tb-whatsnew-case-study');
fetch('https://api.teenybeans.in/API/contactFormProcessor/v1/',
{
method: 'POST',
// headers: {
// 'Content-Type': 'multipart/form-data',
// // 'Authorization': 'Bearer my-token',
// // 'My-Custom-Header': 'foobar'
// },
body: formData,
}
)
.then(response => response.json())
.then(data => {
// console.log(this.scsOccetion)
// console.log(data)
});
// formData=""
this.wnQry=false
},
showDescription(div){
this.tab=false
this.robot=false
this.div
}
}
}
</script>
<style scoped>
.text-color-1 {
color: #7c4c23;
}
.bg3 {
background: linear-gradient(0deg, rgb(191, 219, 254, 1) 0%, rgba(255, 255, 255) 100%);
}
.font-20px {
font-size: 20px;
}
@media screen and (min-width: 801px) {
.hero-text {
font-size: 50px;
}
}
@media screen and (max-width: 800px) {
.hero-text {
font-size: 25px;
}
}
.text-color-3 {
color: #063F78;
}
.csbg {
background: rgba(18, 75, 189, 0.1);
}
</style>

4
src/pages/blog/index.astro
View File

@ -1,12 +1,16 @@
--- ---
import Layout from "../../layouts/Layout.astro"; import Layout from "../../layouts/Layout.astro";
import Menu from "../../components/Menu.astro"; import Menu from "../../components/Menu.astro";
import BlogHeroSearch from "../../components/BlogHeroSearch.vue";
import BlogFilter from "../../components/BlogFilter.vue";
import Blog from "../../components/Blog.vue"; import Blog from "../../components/Blog.vue";
import Footer from "../../components/Footer.vue"; import Footer from "../../components/Footer.vue";
--- ---
<Layout title="Welcome to Astro."> <Layout title="Welcome to Astro.">
<Menu/> <Menu/>
<BlogHeroSearch client:visible/>
<BlogFilter client:visible/>
<Blog client:visible/> <Blog client:visible/>
<Footer/> <Footer/>

2
src/pages/educators.astro
View File

@ -1,10 +1,12 @@
--- ---
import Layout from "../layouts/Layout.astro"; import Layout from "../layouts/Layout.astro";
import Header from "../components/Header.vue"; import Header from "../components/Header.vue";
import Menu from "../components/Menu.astro";
import Educators from "../components/Educators.vue"; import Educators from "../components/Educators.vue";
import Footer from "../components/Footer.vue"; import Footer from "../components/Footer.vue";
--- ---
<Layout title="Welcome"> <Layout title="Welcome">
<Menu clint:visible/>
<Educators client:visible/> <Educators client:visible/>
<Footer client:visible/> <Footer client:visible/>
</Layout> </Layout>

11
src/pages/sample-pae.astro Normal file
View File

@ -0,0 +1,11 @@
---
import Layout from "../layouts/Layout.astro";
import Menu from "../components/Menu2.astro";
import Footer from "../components/Footer.vue";
import Homepage from "../components/Homepage.vue";
---
<Layout title="Welcome to Teenybeans">
<Menu/>
<Homepage client:visible/>
<Footer/>
</Layout>

12
src/pages/whats-new.astro Normal file
View File

@ -0,0 +1,12 @@
---
import Layout from "../layouts/Layout.astro";
import Menu from "../components/Menu.astro";
import Header from "../components/Header.vue";
import WhatsNew from "../components/WhatsNew.vue";
import Footer from "../components/Footer.vue";
---
<Layout title="">
<Menu clint:visible/>
<WhatsNew client:visible/>
</Layout>