Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Improved Jippy AI section on landing page #432

Merged
merged 4 commits into from
Nov 13, 2024
Merged

Improved Jippy AI section on landing page #432

Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
72bd02f
Improve landing page more
haoyangw Nov 13, 2024
ddec5c6
Fix icon alignment
haoyangw Nov 13, 2024
0739f34
Format frontend with eslint
haoyangw Nov 13, 2024
072b2d9
Standardise h2/h3 for heading/subtitle
haoyangw Nov 13, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
65 changes: 39 additions & 26 deletions frontend/app/landing.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -286,38 +286,51 @@ const Landing = () => {
</div>
</div>

<div className="flex flex-col md:flex-row bg-background w-full px-8 py-12 md:px-12 lg:py-24 lg:px-24 md:gap-x-24">
<div className="flex flex-col flex-1 gap-y-8 md:basis-5/12 w-full md:w-fit items-center md:items-start">
<h1 className="text-5xl tracking-tight leading-tight text-primary font-bold text-center md:text-left">
Why you can trust Jippy
</h1>
<span className="text-xl md:text-2xl lg:text-3xl flex items-center">
<Wand2 className="inline-flex mr-3 hover:animate-wiggle-more text-text-muted" />
Learn how Jippy AI works
</span>
<div className="flex flex-col bg-background w-full px-8 py-12 md:px-12 lg:py-24 lg:px-24 md:gap-x-24">
<div className="flex flex-col flex-1 gap-y-8 w-full items-center">
<h2 className="text-3xl md:text-5xl tracking-tight leading-tight text-primary font-bold text-center">
Why you can trust Jippy AI
<span className="relative inline-block ml-1 lg:ml-2">
<Wand2 className="w-5 h-5 md:w-8 md:h-8 ml-2 hover:animate-wiggle-more text-text-muted" />
</span>
</h2>
<h3 className="text-xl md:text-2xl lg:text-3xl text-center w-9/12">
Jippy is just an AI frog after all and can make mistakes, but
measures are in place to minimise mistakes or alert you to issues
as much as possible
</h3>
</div>

<div className="flex-1 md:basis-7/12 p-12 mt-10 md:mt-0 bg-background border rounded-lg shadow-lg">
<p className="text-xl md:text-2xl lg:text-3xl text-text">
Jippy is after all just an AI frog, and can make mistakes, but
here are some things made sure to train Jippy on to avoid mistakes
(or alert you to them) as much as possible:
</p>
<ul className="flex flex-col gap-y-4 mt-4 text-lg md:text-xl">
<li>
Jippy will alert you when Jippy is unsure of something and
provide fall-backs instead during essay generation.
</li>
<li>
Jippy is trained on a set of real current affairs news data set.
We currently have 18k articles in our dataset.
</li>
</ul>
<div className="grid grid-cols-[repeat(auto-fit,minmax(300px,1fr))] w-full h-fit items-stretch gap-x-5 gap-y-3 mt-10">
<Card className="m-1 drop-shadow-sm shadow-background-50 px-4 py-3">
<CardHeader>
<CardTitle className="text-primary-800 text-xl md:text-2xl lg:text-3xl">
Alerts
</CardTitle>
<CardDescription className="md:text-xl text-text-muted pt-3">
Jippy will alert you when Jippy is unsure of something and
provide fall-backs instead during essay generation.
</CardDescription>
</CardHeader>
</Card>
<Card className="m-1 drop-shadow-sm shadow-background-50 px-4 py-3">
<CardHeader>
<CardTitle className="text-primary-800 text-xl md:text-2xl lg:text-3xl">
Credible news
</CardTitle>
<CardDescription className="md:text-xl text-text-muted pt-3">
Jippy is trained on real current affairs news from a reliable
source, with more than 18k articles and counting.
</CardDescription>
</CardHeader>
</Card>
</div>
</div>

<div className="flex flex-col items-center justify-center bg-background w-full py-16 md:py-24 px-8 md:px-24 place-items-start">
<h1 className="text-5xl font-bold text-primary">Plans & pricing</h1>
<h1 className="text-3xl md:text-5xl font-bold text-primary">
Plans & pricing
</h1>
<h2 className="text-xl md:text-2xl lg:text-3xl text-text-muted mt-8">
We strive to keep Jippy accessible for everyone.
</h2>
Expand Down
Loading