Skip to content

Commit 22cfe4a

Browse files
committed
feat: add fonts & hero imgs
1 parent 2b5adbe commit 22cfe4a

File tree

3 files changed

+36
-8
lines changed

3 files changed

+36
-8
lines changed

app/layout.tsx

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,14 @@
1+
import "@/app/ui/global.css";
2+
import { inter } from "@/app/ui/fonts";
3+
14
export default function RootLayout({
25
children,
36
}: {
47
children: React.ReactNode;
58
}) {
69
return (
710
<html lang="en">
8-
<body>{children}</body>
11+
<body className={`${inter.className} antialiased`}>{children}</body>
912
</html>
1013
);
1114
}

app/page.tsx

Lines changed: 24 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,21 @@
1-
import AcmeLogo from '@/app/ui/acme-logo';
2-
import { ArrowRightIcon } from '@heroicons/react/24/outline';
3-
import Link from 'next/link';
1+
import AcmeLogo from "@/app/ui/acme-logo";
2+
import { ArrowRightIcon } from "@heroicons/react/24/outline";
3+
import Link from "next/link";
4+
import { lusitana } from "./ui/fonts";
5+
import Image from "next/image";
46

57
export default function Page() {
68
return (
79
<main className="flex min-h-screen flex-col p-6">
810
<div className="flex h-20 shrink-0 items-end rounded-lg bg-blue-500 p-4 md:h-52">
9-
{/* <AcmeLogo /> */}
11+
<AcmeLogo />
1012
</div>
1113
<div className="mt-4 flex grow flex-col gap-4 md:flex-row">
1214
<div className="flex flex-col justify-center gap-6 rounded-lg bg-gray-50 px-6 py-10 md:w-2/5 md:px-20">
13-
<p className={`text-xl text-gray-800 md:text-3xl md:leading-normal`}>
14-
<strong>Welcome to Acme.</strong> This is the example for the{' '}
15+
<p
16+
className={`text-xl text-gray-800 md:text-3xl md:leading-normal ${lusitana.className}`}
17+
>
18+
<strong>Welcome to Acme.</strong> This is the example for the{" "}
1519
<a href="https://nextjs.org/learn/" className="text-blue-500">
1620
Next.js Learn Course
1721
</a>
@@ -25,7 +29,20 @@ export default function Page() {
2529
</Link>
2630
</div>
2731
<div className="flex items-center justify-center p-6 md:w-3/5 md:px-28 md:py-12">
28-
{/* Add Hero Images Here */}
32+
<Image
33+
src="/hero-desktop.png"
34+
width={1000}
35+
height={700}
36+
className="hidden md:block"
37+
alt="Screenshots of the dashboard project showing desktop version"
38+
/>
39+
<Image
40+
src="/hero-mobile.png"
41+
width={560}
42+
height={620}
43+
className="hidden max-md:block"
44+
alt="Screenshots of the dashboard project showing mobile version"
45+
/>
2946
</div>
3047
</div>
3148
</main>

app/ui/fonts.ts

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
import { Inter, Lusitana } from "next/font/google";
2+
3+
export const inter = Inter({ subsets: ["latin"] });
4+
5+
export const lusitana = Lusitana({
6+
subsets: ["latin"],
7+
weight: ["400", "700"],
8+
});

0 commit comments

Comments
 (0)