From 8f48fc1b123129429484cd176a691bcd79336b38 Mon Sep 17 00:00:00 2001 From: ankushKun Date: Tue, 19 Mar 2024 10:30:06 +0530 Subject: [PATCH] team section --- src/App.tsx | 778 ++++++++++++++++++++------------------ src/components/header.tsx | 2 +- 2 files changed, 421 insertions(+), 359 deletions(-) diff --git a/src/App.tsx b/src/App.tsx index 2127c83..8549539 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -6,404 +6,466 @@ import { Header } from "./components/header"; import { Footer } from "./components/footer"; import { Heading, Title, CodeComment } from "./components/typograpgy"; +const teamData: { + name: string; + position: string; + twitter: string; + photo: string; + top: number; +}[] = [ + { + name: "Farat Kadiwala", + position: "Principal Designer", + twitter: "https://twitter.com/farhatkadiwala_", + photo: "/team/farat.png", + top: 60, + }, + { + name: "Ankush Singh", + position: "Backend and Architect", + twitter: "https://twitter.com/ankushKun_", + photo: "/team/ankush.png", + top: 100, + }, + { + name: "Prathamesh Mutkure", + position: "Frontend", + twitter: "https://twitter.com/prathamesh_io", + photo: "/team/prathamesh.png", + top: 60, + }, + ]; + + + function Card({ - label, - Icon, - text, - gradient = "", - gradientTemp = "text-white", + label, + Icon, + text, + gradient = "", + gradientTemp = "text-white", }: { - label: string; - Icon: LucideIcon; - text: string; - gradient?: string; - gradientTemp?: string; + label: string; + Icon: LucideIcon; + text: string; + gradient?: string; + gradientTemp?: string; }) { - return ( -
-

- {label} -

- -
- -
+ return ( +
+

+ {label} +

+ +
+ +
-

{text}

-
- ); +

{text}

+
+ ); } export function SocialLink({ - href, - label, - Icon, + href, + label, + Icon, }: { - label: string; - href: string; - Icon: LucideIcon | ((props: LucideProps) => JSX.Element); + label: string; + href: string; + Icon: LucideIcon | ((props: LucideProps) => JSX.Element); }) { - return ( - -
-
- -
- -

{label}

-
- - ); + return ( + +
+
+ +
+ +

{label}

+
+ + ); } export function ActionButton( - props: React.DetailedHTMLProps< - React.AnchorHTMLAttributes, - HTMLAnchorElement - > -) { - return ( - , + HTMLAnchorElement > - {props.children} - - ); +) { + return ( + + {props.children} + + ); } export function Hr(props: React.HTMLAttributes) { - return ( -
- ); + return ( +
+ ); } export function Chip({ label }: { label: string }) { - return ( -
- {label} -
- ); + return ( +
+ {label} +
+ ); } const socialItems: { - href: string; - label: string; - Icon: LucideIcon | ((props: LucideProps) => JSX.Element); + href: string; + label: string; + Icon: LucideIcon | ((props: LucideProps) => JSX.Element); }[] = [ - { - href: "https://twitter.com/betteridea_dev", - label: "Follow on twitter", - Icon: Icons.twitter, - }, - { - href: "https://discord.gg/nm6VKUQBrA", - label: "Join our Discord", - Icon: Icons.discord, - }, - { - href: "mailto:hello@betteridea.dev", - label: "Write to us", - Icon: Icons.mail, - }, - { - href: "https://github.com/ankushKun/betteride", - label: "Make a PR", - Icon: Icons.github, - }, - ]; + { + href: "https://twitter.com/betteridea_dev", + label: "Follow on twitter", + Icon: Icons.twitter, + }, + { + href: "https://discord.gg/nm6VKUQBrA", + label: "Join our Discord", + Icon: Icons.discord, + }, + { + href: "mailto:hello@betteridea.dev", + label: "Write to us", + Icon: Icons.mail, + }, + { + href: "https://github.com/ankushKun/betteride", + label: "Make a PR", + Icon: Icons.github, + }, + ]; function App() { - const nameRef = useRef(null); - const queryRef = useRef(null); - - // TODO: Integrate API and toast - async function onQuerySubmit() { - const name = nameRef.current?.value; - const query = nameRef.current?.value; - - // startWindToast( - // "Success", - // "You'll hear from us soon", - // "success", - // 3, - // "bottom" - // ); - - if (!name || !query) { - return; + const nameRef = useRef(null); + const queryRef = useRef(null); + + // TODO: Integrate API and toast + async function onQuerySubmit() { + const name = nameRef.current?.value; + const query = nameRef.current?.value; + + // startWindToast( + // "Success", + // "You'll hear from us soon", + // "success", + // 3, + // "bottom" + // ); + + if (!name || !query) { + return; + } + + console.log({ name, query }); } - console.log({ name, query }); - } - - return ( -
-
-
+ return ( +
+
+
-
- {/* Create a grid that has two rows on mobile and converts to single row on larger devices */} -
- - One stop env <br /> - for devs - <br /> on <span className="text-[var(--green)]">Arweave</span> - - -
- -
-
- - - - - - Start Building - -
- -
- + {/* Create a grid that has two rows on mobile and converts to single row on larger devices */} +
+ + One stop env <br /> + for devs + <br /> on <span className="text-[var(--green)]">Arweave</span> + + +
+ +
+
+ + + + + + Start Building + +
+ +
+ // build without setting up
extensive dev env from - scratch - - - - you focus on writing good code, -
we worry about execution, deal? - -
+ scratch + + + + you focus on writing good code, +
we worry about execution, deal? + +
+
+
+
-
- -
-
-
-
- Getting started is as easy as +
+
+
+ Getting started is as easy as -
+
- + // BetterIDEa provides a powerful, -
- and seamless developer experience -
- that lets you focus, on writing good code -
without worrying about execution. - - -
- - Get Started -
- -
-
- -
- -
- -
- -
- -
-
-
-
- -
- - Introducing AONotebook - +
+ and seamless developer experience +
+ that lets you focus, on writing good code +
without worrying about execution. + + +
+ + Get Started +
+ +
+
+ +
+ +
+ +
+ +
+ +
+
+
+
+ +
+ + Introducing AONotebook + - + // colab-like ease for Actor-Oriented smart contracts. -
- build powerful dApps faster, with Lua. - - -

Try a snippet here!

- -
- -
- -
-
- - - -
- -
- -
- - -
- -
- - - -
-
-
- -
-
-
- IDE Preview -
- -
-
- How it works - -
- -
- - // here's a tinyyy demo of what you can do
on - BetterIDEa, the more the better +
+ build powerful dApps faster, with Lua. -
-
- -
- - Start Building - -
-
-
- -
-
-
- - - -
- - Reach out to us - -
- Try a snippet here!

+ +
+ +
+ +
+
+ + + +
+ +
+ +
+ + +
+ +
+ + + +
+
+
+ +
+
+
+ IDE Preview +
+ +
+
+ How it works + +
+ +
+ + // here's a tinyyy demo of what you can do
on + BetterIDEa, the more the better + +
+
+ +
+ + + Start Building + +
+
+
+ +
+
+ Our team +
+ +
+ +
+ {teamData.map(({ name, position, twitter, photo, top }) => ( +
+
+ +
+ +
+

{name}

+

{position}

+
+ + +
+ ))} +
+
+ + +
- - -
- - -
- {socialItems.map(({ href, label, Icon }, i) => ( - - ))} -
- - -