-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat(solidr-front-next): beautify home page
- Loading branch information
Showing
15 changed files
with
328 additions
and
78 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
21 changes: 21 additions & 0 deletions
21
packages/fronts/solidr-front-next/src/app/home/FeaturesSection.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,21 @@ | ||
import { useTranslations } from 'next-intl'; | ||
|
||
export default function FeaturesSection() { | ||
const t = useTranslations('home.features'); | ||
|
||
return ( | ||
<section id="features" className="py-20 bg-white dark:bg-zinc-900 text-zinc-900 dark:text-zinc-100"> | ||
<div className="container mx-auto px-6"> | ||
<h2 className="text-3xl md:text-4xl font-semibold text-center">{t('heading')}</h2> | ||
<div className="grid grid-cols-1 md:grid-cols-3 gap-8 mt-10"> | ||
{t.raw('items').map((item: any, index: number) => ( | ||
<div key={index} className="p-6 bg-zinc-100 dark:bg-zinc-800 rounded-lg shadow-lg"> | ||
<h3 className="text-2xl font-bold">{item.title}</h3> | ||
<p className="mt-4">{item.description}</p> | ||
</div> | ||
))} | ||
</div> | ||
</div> | ||
</section> | ||
); | ||
} |
22 changes: 22 additions & 0 deletions
22
packages/fronts/solidr-front-next/src/app/home/GetStartedSection.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,22 @@ | ||
import { useTranslations } from 'next-intl'; | ||
import Link from 'next/link'; | ||
|
||
export default function GetStartedSection() { | ||
const t = useTranslations('home.getStarted'); | ||
|
||
return ( | ||
<section id="get-started" className="py-20 bg-gradient-to-r from-solanaGreen to-solanaPurple text-white text-center"> | ||
<div className="container mx-auto px-6"> | ||
<h2 className="text-3xl md:text-4xl font-semibold">{t('heading')}</h2> | ||
<p className="mt-4 text-lg md:text-xl">{t('description')}</p> | ||
<div className="mt-8"> | ||
<Link href={`/sessions`} passHref> | ||
<button className="bg-white text-black py-2 px-4 rounded-md"> | ||
{t('button')} | ||
</button> | ||
</Link> | ||
</div> | ||
</div> | ||
</section> | ||
); | ||
} |
38 changes: 38 additions & 0 deletions
38
packages/fronts/solidr-front-next/src/app/home/HeroSection.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,38 @@ | ||
import { useTranslations } from 'next-intl'; | ||
import Image from 'next/image'; | ||
import Link from 'next/link'; | ||
|
||
export default function HeroSection() { | ||
const t = useTranslations('home.hero'); | ||
|
||
return ( | ||
<section className="bg-gradient-to-r from-solanaGreen to-solanaPurple text-white h-screen flex flex-col justify-center items-center text-center px-4"> | ||
<div className="max-w-4xl mx-auto"> | ||
<Image | ||
src="/logo.png" | ||
alt="SolidR Logo" | ||
className="h-24 md:h-32 lg:h-40 mx-auto mb-8" | ||
/> | ||
<h1 className="text-3xl sm:text-4xl md:text-5xl lg:text-6xl font-bold leading-tight"> | ||
{t('title')} | ||
</h1> | ||
<p className="mt-4 text-base sm:text-lg md:text-xl lg:text-2xl leading-relaxed"> | ||
{t('subtitle')} | ||
</p> | ||
<p className="mt-4 text-sm sm:text-md md:text-lg lg:text-xl italic opacity-75"> | ||
{t('solanaText')} | ||
</p> | ||
<div className="mt-8 space-x-4"> | ||
<Link href={`/sessions`} passHref> | ||
<button className="bg-white text-black py-2 px-4 rounded-md text-sm md:text-base lg:text-lg"> | ||
{t('getStarted')} | ||
</button> | ||
</Link> | ||
<button className="bg-transparent border border-white py-2 px-4 rounded-md text-sm md:text-base lg:text-lg"> | ||
{t('learnMore')} | ||
</button> | ||
</div> | ||
</div> | ||
</section> | ||
); | ||
} |
21 changes: 21 additions & 0 deletions
21
packages/fronts/solidr-front-next/src/app/home/HowItWorksSection.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,21 @@ | ||
import { useTranslations } from 'next-intl'; | ||
|
||
export default function HowItWorksSection() { | ||
const t = useTranslations('home.howItWorks'); | ||
|
||
return ( | ||
<section id="how-it-works" className="py-20 bg-zinc-100 dark:bg-zinc-800 text-zinc-900 dark:text-zinc-100"> | ||
<div className="container mx-auto px-6"> | ||
<h2 className="text-3xl md:text-4xl font-semibold text-center">{t('heading')}</h2> | ||
<div className="grid grid-cols-1 md:grid-cols-4 gap-8 mt-10"> | ||
{t.raw('steps').map((step: any, index: number) => ( | ||
<div key={index} className="p-6 bg-white dark:bg-zinc-700 rounded-lg shadow-lg"> | ||
<h3 className="text-xl font-bold">{step.title}</h3> | ||
<p className="mt-4">{step.description}</p> | ||
</div> | ||
))} | ||
</div> | ||
</div> | ||
</section> | ||
); | ||
} |
18 changes: 18 additions & 0 deletions
18
packages/fronts/solidr-front-next/src/app/home/TestimonialsSection.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,18 @@ | ||
import { useTranslations } from 'next-intl'; | ||
|
||
export default function TestimonialsSection() { | ||
const t = useTranslations('home.testimonials'); | ||
|
||
return ( | ||
<section id="testimonials" className="py-20 bg-white dark:bg-zinc-900 text-zinc-900 dark:text-zinc-100"> | ||
<div className="container mx-auto px-6"> | ||
<h2 className="text-3xl md:text-4xl font-semibold text-center">{t('heading')}</h2> | ||
<div className="mt-10 flex justify-center"> | ||
<p className="text-lg md:text-xl font-medium text-center"> | ||
{t('comingSoon')} | ||
</p> | ||
</div> | ||
</div> | ||
</section> | ||
); | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
53 changes: 47 additions & 6 deletions
53
packages/fronts/solidr-front-next/src/app/layout/Footer.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.