feat: teachers page (#275)

* feat: add a teacher route

* refactor

* PR Fixes

* text-md fix

* remove root

* fixes

* update content

* Update Register behavior

---------

Co-authored-by: Rotimi Best <[email protected]>
This commit is contained in:
Adeyemi Adetunji
2024-04-22 22:17:33 +01:00
committed by GitHub
co-authored by Rotimi Best
parent 295116773d
commit 32e10302cb
22 changed files with 429 additions and 68 deletions
+2 -2
View File
@@ -21,11 +21,11 @@
<div class="mt-[20%] grid grid-cols-1 gap-10 lg:m-0 lg:grid-cols-3 lg:gap-20 lg:px-[13%]">
{#each faqs as faq}
<div class="max-w-[100%] px-6 lg:p-0">
<h1 class="text:md lg:text-md font-semibold leading-8 text-gray-800">
<h1 class="text:md lg:text-base font-semibold leading-8 text-gray-800">
{faq.question}
</h1>
<p
class="text:md lg:text-md mt-2 font-light leading-7 tracking-wide text-gray-600 lg:leading-9"
class="text:md lg:text-base mt-2 font-light leading-7 tracking-wide text-gray-600 lg:leading-9"
>
{faq.answer}
</p>
@@ -14,7 +14,7 @@
alt="classroomio logo"
class="mb-5"
/>
<p class="lg:text-md mb-5 mr-2 text-sm leading-7 tracking-wide text-gray-600 lg:leading-7">
<p class="lg:text-base mb-5 mr-2 text-sm leading-7 tracking-wide text-gray-600 lg:leading-7">
Launch Your Online Bootcamp In Minutes
<br />
The easiest way to launch and scale your online bootcamp
@@ -61,61 +61,83 @@
class="mt-16 flex w-full flex-col items-start justify-between gap-3 space-y-6 lg:mt-0 lg:w-2/4 lg:flex-row lg:space-y-0"
>
<div>
<p class="lg:text-md mb-3 text-base font-semibold leading-6 text-gray-900 lg:mb-10">
<p class="lg:text-base mb-3 text-base font-semibold leading-6 text-gray-900 lg:mb-10">
Product
</p>
<ul class="space-y-2 lg:space-y-4">
<li class="lg:text-md text-sm leading-6 tracking-wide text-gray-600 hover:text-gray-900">
<li
class="lg:text-base text-sm leading-6 tracking-wide text-gray-600 hover:text-gray-900"
>
<a href="/#coursemanagement"> Course Management </a>
</li>
<li class="lg:text-md text-sm leading-6 tracking-wide text-gray-600 hover:text-gray-900">
<li
class="lg:text-base text-sm leading-6 tracking-wide text-gray-600 hover:text-gray-900"
>
<a href="/#customization"> Customizations </a>
</li>
<li class="lg:text-md text-sm leading-6 tracking-wide text-gray-600 hover:text-gray-900">
<li
class="lg:text-base text-sm leading-6 tracking-wide text-gray-600 hover:text-gray-900"
>
<a href="/#collaboration"> Forum </a>
</li>
<li class="lg:text-md text-sm leading-6 tracking-wide text-gray-600 hover:text-gray-900">
<li
class="lg:text-base text-sm leading-6 tracking-wide text-gray-600 hover:text-gray-900"
>
<a href="/#ai"> AI Lesson Planner </a>
</li>
</ul>
</div>
<div>
<p class="lg:text-md mb-3 text-base font-semibold leading-6 text-gray-900 lg:mb-10">
<p class="lg:text-base mb-3 text-base font-semibold leading-6 text-gray-900 lg:mb-10">
Resources
</p>
<ul class="space-y-2 lg:space-y-4">
<li class="lg:text-md text-sm leading-6 tracking-wide text-gray-600 hover:text-gray-900">
<a href="/blog"> Blog </a>
<li
class="lg:text-base text-sm leading-6 tracking-wide text-gray-600 hover:text-gray-900"
>
<a href="/teach">Teach with us</a>
</li>
<li class="lg:text-md text-sm leading-6 tracking-wide text-gray-600 hover:text-gray-900">
<li
class="lg:text-base text-sm leading-6 tracking-wide text-gray-600 hover:text-gray-900"
>
<a target="_blank" href="https://classroomio.com/docs/"> Help center </a>
</li>
<li class="lg:text-md text-sm leading-6 tracking-wide text-gray-600 hover:text-gray-900">
<li
class="lg:text-base text-sm leading-6 tracking-wide text-gray-600 hover:text-gray-900"
>
<a target="_blank" href="https://classroomio.com/docs/what-is-classroomio">
What is ClassroomIO?
</a>
</li>
<li class="lg:text-md text-sm leading-6 tracking-wide text-gray-600 hover:text-gray-900">
<li
class="lg:text-base text-sm leading-6 tracking-wide text-gray-600 hover:text-gray-900"
>
<a target="_blank" href="https://classroomio.com/docs/quickstart/signup">
Getting Started
</a>
</li>
<li class="lg:text-md text-sm leading-6 tracking-wide text-gray-600 hover:text-gray-900">
<li
class="lg:text-base text-sm leading-6 tracking-wide text-gray-600 hover:text-gray-900"
>
<a href="/oss-friends"> OSS Friends </a>
</li>
</ul>
</div>
<div>
<p class="lg:text-md mb-3 text-base font-semibold leading-6 text-gray-900 lg:mb-10">
<p class="lg:text-base mb-3 text-base font-semibold leading-6 text-gray-900 lg:mb-10">
Company
</p>
<ul class="space-y-2 lg:space-y-4">
<li class="lg:text-md text-sm leading-6 tracking-wide text-gray-600 hover:text-gray-900">
<li
class="lg:text-base text-sm leading-6 tracking-wide text-gray-600 hover:text-gray-900"
>
<a href="mailto:[email protected]" target="_blank"> Contact us </a>
</li>
<li class="lg:text-md text-sm leading-6 tracking-wide text-gray-600 hover:text-gray-900">
<li
class="lg:text-base text-sm leading-6 tracking-wide text-gray-600 hover:text-gray-900"
>
<a
href="https://app.enzuzo.com/policies/privacy/958fc978-5477-11ee-a03b-7b111830c594"
target="_blank"
@@ -123,12 +145,16 @@
Privacy policy
</a>
</li>
<li class="lg:text-md text-sm leading-6 tracking-wide text-gray-600 hover:text-gray-900">
<li
class="lg:text-base text-sm leading-6 tracking-wide text-gray-600 hover:text-gray-900"
>
<a target="_blank" href="https://classroomio.com/docs/quickstart/signup">
Getting Started
</a>
</li>
<li class="lg:text-md text-sm leading-6 tracking-wide text-gray-600 hover:text-gray-900">
<li
class="lg:text-base text-sm leading-6 tracking-wide text-gray-600 hover:text-gray-900"
>
<a
href="https://app.enzuzo.com/policies/tos/958fc978-5477-11ee-a03b-7b111830c594"
target="_blank"
@@ -141,7 +167,7 @@
</nav>
</div>
<footer
class="lg:text-md border-t-[1px] py-[3%] text-center text-xs font-light leading-5 text-gray-500 lg:text-left"
class="lg:text-base border-t-[1px] py-[3%] text-center text-xs font-light leading-5 text-gray-500 lg:text-left"
>
<p>All rights reserved.</p>
<p class="flex items-center">
@@ -113,7 +113,7 @@
</div>
</div>
<p class="text-md mx-auto mt-10 px-4 text-slate-700 md:text-lg lg:mt-6 lg:w-[42%] lg:p-0">
<p class="text-base mx-auto mt-10 px-4 text-slate-700 md:text-lg lg:mt-6 lg:w-[42%] lg:p-0">
Meet a better learning management system (LMS) for teachers and students. ClassroomIO allows
you to launch and scale your online bootcamp with ease.
</p>
@@ -182,7 +182,7 @@
Sign Up for Free
</a>
<!-- <a
class="font-medium lg:font-semibold text-sm md:text-md w-11/12 md:w-fit border px-6 py-3 lg:px-10 lg:py-5 rounded-md"
class="font-medium lg:font-semibold text-sm md:text-base w-11/12 md:w-fit border px-6 py-3 lg:px-10 lg:py-5 rounded-md"
href="/github"
target="_blank"
rel="noopener noreferrer nofollow"
@@ -0,0 +1,9 @@
<script>
export let className = '';
</script>
<header
class="hero-bg lg:min-h-[30rem] mt-[10%] md:mt-16 pt-24 pb-16 w-full border-b border-slate-100 {className}"
>
<slot />
</header>
@@ -20,7 +20,7 @@
{#if demo}
<button
class="text-md mt-10 rounded-md bg-white px-6 py-4 font-semibold text-gray-900 lg:px-7 lg:py-3 lg:text-lg"
class="text-base mt-10 rounded-md bg-white px-6 py-4 font-semibold text-gray-900 lg:px-7 lg:py-3 lg:text-lg"
data-cal-config="'layout':'month_view'"
data-cal-link="classroomio/demo"
>
@@ -28,7 +28,7 @@
</button>
{:else}
<a
class="text-md mt-10 rounded-md bg-white px-6 py-4 font-semibold text-gray-900 lg:px-7 lg:py-3 lg:text-lg"
class="text-base mt-10 rounded-md bg-white px-6 py-4 font-semibold text-gray-900 lg:px-7 lg:py-3 lg:text-lg"
href={link}
target="_blank"
rel="noopener noreferrer nofollow"
@@ -12,7 +12,7 @@
<section id="pricing" class="py-[12%]">
<div class="flex flex-col items-center justify-center px-[6%]">
<div class="mb-[3%] text-center">
<h1 id="pricing" class="text-md font-semibold tracking-wide text-blue-700">Pricing</h1>
<h1 id="pricing" class="text-base font-semibold tracking-wide text-blue-700">Pricing</h1>
<h2 class="my-5 text-3xl font-semibold tracking-tight text-gray-900 lg:my-4 lg:text-4xl">
For teams and individuals
</h2>
@@ -51,7 +51,7 @@
<p class="text-lg font-semibold leading-8 text-gray-900 lg:text-xl">
{PLANS.BASIC.NAME}
</p>
<p class="lg:text-md mt-4 text-sm font-light leading-6 text-gray-500 lg:leading-6">
<p class="lg:text-base mt-4 text-sm font-light leading-6 text-gray-500 lg:leading-6">
{PLANS.BASIC.DESCRIPTION}
</p>
<p class="mt-6 flex items-baseline gap-x-1 text-4xl font-medium lg:text-4xl">
@@ -59,7 +59,7 @@
<!-- <sub class="text-base">/mo</sub> -->
</p>
<a
class="text-md mt-10 block w-full rounded-md bg-slate-900 py-3 text-center font-medium text-white hover:bg-slate-700 lg:rounded-md lg:py-3 lg:text-lg lg:font-semibold"
class="text-base mt-10 block w-full rounded-md bg-slate-900 py-3 text-center font-medium text-white hover:bg-slate-700 lg:rounded-md lg:py-3 lg:text-lg lg:font-semibold"
href={PLANS.BASIC.CTA.LINK}
target="_blank"
>
@@ -84,7 +84,7 @@
<p class="text-lg font-semibold leading-8 text-white lg:text-xl">
{PLANS.EARLY_ADOPTER.NAME}
</p>
<p class="lg:text-md mt-4 text-sm font-light leading-6 text-white lg:leading-6">
<p class="lg:text-base mt-4 text-sm font-light leading-6 text-white lg:leading-6">
{PLANS.EARLY_ADOPTER.DESCRIPTION}
</p>
<p class="mt-6 flex items-baseline gap-x-1 text-4xl font-medium text-white lg:text-4xl">
@@ -92,7 +92,7 @@
<!-- <sub class="text-base">/mo</sub> -->
</p>
<a
class="text-md mt-10 block w-full rounded-md bg-white py-3 text-center font-medium text-slate-900 hover:bg-indigo-50 lg:rounded-md lg:py-3 lg:text-lg lg:font-semibold"
class="text-base mt-10 block w-full rounded-md bg-white py-3 text-center font-medium text-slate-900 hover:bg-indigo-50 lg:rounded-md lg:py-3 lg:text-lg lg:font-semibold"
href={PLANS.EARLY_ADOPTER.CTA.LINK}
target="_blank"
>
@@ -113,14 +113,14 @@
<p class="text-lg font-semibold leading-8 text-gray-900 lg:text-xl">
{PLANS.ENTERPRISE.NAME}
</p>
<p class="lg:text-md mt-4 text-sm font-light leading-6 text-gray-500 lg:leading-6">
<p class="lg:text-base mt-4 text-sm font-light leading-6 text-gray-500 lg:leading-6">
{PLANS.ENTERPRISE.DESCRIPTION}
</p>
<p class="mt-6 flex items-baseline gap-x-1 text-xl font-medium lg:mt-6 lg:text-xl">
Request Pricing
</p>
<button
class="text-md mt-10 w-full rounded-md bg-slate-900 py-3 font-medium text-white hover:bg-slate-700 lg:rounded-md lg:py-3 lg:text-lg lg:font-semibold"
class="text-base mt-10 w-full rounded-md bg-slate-900 py-3 font-medium text-white hover:bg-slate-700 lg:rounded-md lg:py-3 lg:text-lg lg:font-semibold"
data-cal-config={"{'layout':'month_view'}"}
data-cal-link="classroomio/enterprise"
>
@@ -147,19 +147,19 @@
>
<div class="mr-5 pl-5">
<h2
class="text-md lg:text-xl font-semibold font-display leading-8 tracking-wide lg:tracking-tight text-blue-700 mb-0 lg:mb-4"
class="text-base lg:text-xl font-semibold font-display leading-8 tracking-wide lg:tracking-tight text-blue-700 mb-0 lg:mb-4"
>
Hobby
</h2>
<p
class="m-0 lg:mt-1 text-md leading-7 lg:leading-6 text-gray-600"
class="m-0 lg:mt-1 text-base leading-7 lg:leading-6 text-gray-600"
>
For personal use. Hobby plan is free for up to 5 courses forever, no
credit Card required.
</p>
</div>
<button
class="font-semibold text-base lg:text-md text-white leading-5 mt-5 lg:m-0 p-4 lg:py-5 ml-5 bg-blue-700 rounded-lg lg:rounded-md w-[70%] lg:w-full"
class="font-semibold text-base lg:text-base text-white leading-5 mt-5 lg:m-0 p-4 lg:py-5 ml-5 bg-blue-700 rounded-lg lg:rounded-md w-[70%] lg:w-full"
>
Create a free account
</button>
@@ -13,7 +13,7 @@
</h1>
<p
class="mx-auto mt-10 lg:mt-6 px-4 lg:p-0 text-md tracking-wide leading-6 text-gray-400 lg:w-2/4"
class="mx-auto mt-10 lg:mt-6 px-4 lg:p-0 text-base tracking-wide leading-6 text-gray-400 lg:w-2/4"
>
Once you create an account, you get a dedicated dashboard where your students can access all
their courses, assignments, and more.
@@ -10,12 +10,12 @@
</h1>
<p
class="mx-auto text-center my-5 lg:mt-6 px-4 lg:p-0 text-md tracking-wide leading-6 text-gray-400 lg:w-2/4"
class="mx-auto text-center my-5 lg:mt-6 px-4 lg:p-0 text-base tracking-wide leading-6 text-gray-400 lg:w-2/4"
>
See what excites them about building and managing bootcamps with ClassroomIO.
</p>
<a
class="md:text-md w-11/12 rounded-md bg-blue-700 px-6 py-3 text-sm font-medium text-white text-center transition-all delay-100 hover:bg-blue-800 hover:shadow-xl hover:scale-95 md:w-fit lg:px-6 lg:py-5 lg:font-semibold"
class="md:text-base w-11/12 rounded-md bg-blue-700 px-6 py-3 text-sm font-medium text-white text-center transition-all delay-100 hover:bg-blue-800 hover:shadow-xl hover:scale-95 md:w-fit lg:px-6 lg:py-5 lg:font-semibold"
href="/signup"
rel="noopener noreferrer nofollow"
>