CS_learn/tech-interview-handbook
1
0
Fork 0
mirror of https://github.com/yangshun/tech-interview-handbook.git synced 2026-04-10 06:18:58 +08:00
Code Issues Packages Projects Releases Wiki Activity

[portal][misc] tweak homepage hero

Browse Source
This commit is contained in:
Yangshun Tay
2022-11-07 18:29:22 +08:00
parent 57489d62e4
commit 5b2f06fadc
1 changed files with 51 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files

91
apps/portal/src/pages/index.tsx
View File

@@ -1,3 +1,4 @@
import Head from 'next/head';
import { Button } from '@tih/ui';
import Container from '~/components/shared/Container';
@@ -28,48 +29,58 @@ const features = [
export default function HomePage() {
return (
<div className="bg-white py-12">
<Container className="space-y-24">
<div className="text-center">
<h1 className="text-4xl font-bold tracking-tight text-slate-900 sm:text-5xl md:text-6xl">
<span className="block">Tech Interview Handbook</span>
<span className="text-primary-600 block">Portal</span>
</h1>
<p className="mx-auto mt-3 max-w-md text-base text-slate-500 sm:text-lg md:mt-5 md:max-w-3xl md:text-xl">
Suite of products to help you get better at technical interviews.
</p>
</div>
<div>
<h2 className="sr-only">Products.</h2>
<dl className="space-y-10 lg:grid lg:grid-cols-3 lg:gap-12 lg:space-y-0">
{features.map((feature) => (
<div key={feature.name}>
<dt>
<div className="flex justify-center">
<img
alt={feature.name}
className="h-48"
src={feature.img}
<>
<Head>
<title>Tech Interview Handbook Portal</title>
</Head>
<div className="bg-white pb-24">
<div className="space-y-12">
<div className="bg-slate-100 py-8 text-center sm:py-16">
<Container>
<h1 className="text-4xl font-bold tracking-tight text-slate-900 sm:text-5xl md:text-6xl">
<span className="block">Tech Interview Handbook</span>
<span className="text-primary-600 block">Portal</span>
</h1>
<p className="mx-auto mt-3 max-w-md text-base text-slate-500 sm:text-lg md:mt-5 md:max-w-3xl md:text-xl">
Suite of products to help you get better at technical
interviews.
</p>
</Container>
</div>
<Container>
<div>
<h2 className="sr-only">Products.</h2>
<dl className="space-y-10 lg:grid lg:grid-cols-3 lg:gap-12 lg:space-y-0">
{features.map((feature) => (
<div key={feature.name}>
<dt>
<div className="flex justify-center">
<img
alt={feature.name}
className="h-48"
src={feature.img}
/>
</div>
<p className="mt-8 text-xl font-medium leading-6 text-slate-900">
{feature.name}
</p>
</dt>
<dd className="mt-2 text-base text-slate-500">
{feature.description}
</dd>
<Button
className="mt-4"
href={feature.href}
label="Try it out"
variant="tertiary"
/>
</div>
<p className="mt-8 text-xl font-medium leading-6 text-slate-900">
{feature.name}
</p>
</dt>
<dd className="mt-2 text-base text-slate-500">
{feature.description}
</dd>
<Button
className="mt-4"
href={feature.href}
label="Try it out"
variant="tertiary"
/>
</div>
))}
</dl>
))}
</dl>
</div>
</Container>
</div>
</Container>
</div>
</div>
</>
);
}