aboutsummaryrefslogtreecommitdiff
path: root/src/app/page.jsx
blob: 7c8b2092d660b63b6135f7906e71fb4bbcff79f5 (plain) (blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
import {
	Card,
	CardBody,
	CardFooter,
	Button,
	CardHeader,
	Divider,
} from "@nextui-org/react";
import Image from "next/image";
import Link from "next/link";

export default async function Home() {
	const homePageCards = (title, image) => {
		return (
			<Link href={`/${title}`} className="lg:mx-1 mt-2">
				<Card
					className="w-40 bg-stone-900"
					isPressable
					isHoverable
					shadow="sm"
				>
					<CardHeader>
						<Image
							src={`/${image}`}
							alt="anime image"
							width={200}
							height={200}
							className="rounded-t-md w-full h-36"
						/>
					</CardHeader>
					<Divider />
					<CardBody>
						<p className="text-center">{title}</p>
					</CardBody>
				</Card>
			</Link>
		);
	};

	return (
		<main className="lg:w-7/12 m-auto">
			<div className="text-center mt-2">
				<p className="text-md text-gray-500">Welcome to</p>
				<br />
				<p className="mt-[-1.8rem] text-4xl">Dramalama</p>
				<p className="mt-1 text-sm text-neutral-500">
					Dramalama is a platform which lets you stream your favourite
					content for free.
				</p>
			</div>

			{/* <div>
				<section className="mt-2 bg-neutral-800 w-40 rounded-md p-1">
					<Image
						src="/todoroki.jpg"
						alt="anime image"
						width={200}
						height={200}
						className="rounded-t-md"
					/>
					<p className="text-center">Anime</p>
				</section>
			</div> */}
			<div className="flex items-center flex-col justify-center lg:flex-row">
				{homePageCards("anime", "todoroki.jpg")}
				{homePageCards("manga", "manga.jpg")}
			</div>

			<div className="flex items-center justify-center mt-2">
				<Button
					as={Link}
					color="default"
					href="/kdrama"
					className="mx-1"
				>
					Kdramas
				</Button>{" "}
				<Button
					as={Link}
					color="default"
					href="/movies"
					className="mx-1"
				>
					Movies
				</Button>
				<Button
					as={Link}
					color="default"
					href="/web-series"
					className="mx-1"
				>
					Web-Series
				</Button>
			</div>
		</main>
	);
}

// Test push