Wodey/wodey-prototype
6
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Task completed

Browse Source
This commit is contained in:
saani 2025-04-27 14:17:31 +00:00
parent 344ee6caf4
commit fabc97da5d
5 changed files with 65 additions and 49 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
app/components/Home_Banner.tsx
View File

@ -1,18 +1,21 @@
import React from 'react'
import React from "react";
export const Home_Banner = () => {
export const Home_Banner: React.FC = () => {
return (
<div className='hero_img'>
<div className='hero_text'>
<h3>Bring Your Story to Life</h3>
<p>Start creating your own ebook today — share your voice, inspire readers, and publish to the world in just a few clicks.</p>
<button>Create an ebook</button>
</div>
<div className='hero_cards'>
<div className='card_1'></div>
<div className='card_2'></div>
<div className='card_3'></div>
</div>
<div className="hero_img">
<div className="hero_text">
<h3>Bring Your Story to Life</h3>
<p>
Start creating your own ebook today — share your voice, inspire readers,
and publish to the world in just a few clicks.
</p>
<button>Create an ebook</button>
</div>
<div className="hero_cards">
<div className="card_1"></div>
<div className="card_2"></div>
<div className="card_3"></div>
</div>
</div>
)
}
);
};

15
app/components/Recent_Card.tsx
View File

@ -1,21 +1,28 @@
import Image from "next/image";
import React from "react";
const Recent_Card = (props: any) => {
interface RecentCardProps {
image: string;
title: string;
tag: string;
description: string;
}
const Recent_Card: React.FC<RecentCardProps> = ({ image, title, tag, description }) => {
return (
<div className="flex flex-col justify-start items-start">
<div className="recent_card flex justify-center items-center">
<Image
src={props.image}
src={image}
alt="image"
className="card_img"
width={100}
height={100}
/>
</div>
<h3 className="text-[14px] font-[400] text-slate-900 ">{props.title}</h3>
<h3 className="text-[14px] font-[400] text-slate-900">{title}</h3>
<p className="text-[10px] font-[400] text-slate-400">
{props.tag} {" "} <span> {props.description}</span>
{tag} <span> {description}</span>
</p>
</div>
);

43
app/components/Recent_Creation.tsx
View File

@ -2,9 +2,8 @@ import Image from "next/image";
import React from "react";
import { FaSlidersH } from "react-icons/fa";
import Recent_Card from "./Recent_Card";
import { title } from "process";
const Recent_Creation = () => {
const Recent_Creation: React.FC = () => {
return (
<div className="recent_container">
<div className="recent_title">
@ -13,34 +12,34 @@ const Recent_Creation = () => {
</div>
<div className="grid sm:grid-cols-2 md:grid-cols-5 gap-4 mt-2">
<Recent_Card
image={"/assets/aa31529b95af9b43380b88b11692b0a6f7999878.png"}
title={"Good morning Gabe Hager!"}
tag={"Ebook"}
description={"Edited 13 mins ago"}
image="/assets/aa31529b95af9b43380b88b11692b0a6f7999878.png"
title="Good morning Gabe Hager!"
tag="Ebook"
description="Edited 13 mins ago"
/>
<Recent_Card
image={"/assets/d5d8f9fe19a7aed7bf6545a64634eeb37a6b895a.png"}
title={"Story of my life (Story by Lak..."}
tag={"Ebook"}
description={"Edited 5 hours ago"}
image="/assets/d5d8f9fe19a7aed7bf6545a64634eeb37a6b895a.png"
title="Story of my life (Story by Lak..."
tag="Ebook"
description="Edited 5 hours ago"
/>
<Recent_Card
image={"/assets/d3cf3b09c1fd3dc0d6a997a7a479337fdf8caa69.png"}
title={"Good morning Gabe Hager!"}
tag={"Ebook"}
description={"Edited 10 mins ago"}
image="/assets/d3cf3b09c1fd3dc0d6a997a7a479337fdf8caa69.png"
title="Good morning Gabe Hager!"
tag="Ebook"
description="Edited 10 mins ago"
/>
<Recent_Card
image={"/assets/96c1b745b59fe1512c73f653d7b5e7be3ee54e58.png"}
title={"A fantastic saga, the super..."}
tag={"Ebook"}
description={"Edited 1 month ago"}
image="/assets/96c1b745b59fe1512c73f653d7b5e7be3ee54e58.png"
title="A fantastic saga, the super..."
tag="Ebook"
description="Edited 1 month ago"
/>
<Recent_Card
image={"/assets/292c2c8f2ea3276c44dc6ade84e687b9cae3d267.png"}
title={"Good morning Gabe Hager!"}
tag={"Ebook"}
description={"Edited 20 hours ago"}
image="/assets/292c2c8f2ea3276c44dc6ade84e687b9cae3d267.png"
title="Good morning Gabe Hager!"
tag="Ebook"
description="Edited 20 hours ago"
/>
</div>
</div>

10
app/creator/page.tsx
View File

@ -1,11 +1,13 @@
import { Home_Banner } from "../components/Home_Banner";
import Recent_Creation from "../components/Recent_Creation";
export default function CreatorPage() {
return (
const CreatorPage: React.FC = () => {
return (
<div className="w-full h-[80vh] flex flex-col items-center justify-start bg-[#F3F3F3]">
<Home_Banner />
<Recent_Creation />
</div>
)
}
);
};
export default CreatorPage;

13
app/page.tsx
View File

@ -1,11 +1,16 @@
import React from "react";
export default function Home() {
const Home: React.FC = () => {
return (
<div className="w-[100%] h-[96vh] px-4 flex flex-col items-center justify-center" style={{ backgroundColor: "#F2F4F8" }}>
<div
className="w-[100%] h-[96vh] px-4 flex flex-col items-center justify-center"
style={{ backgroundColor: "#F2F4F8" }}
>
<div>
Home Page
</div>
</div>
);
}
};
export default Home;