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 (
-
-
-
- );
+ return (
+
+
+
+ );
}
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
- for devs
-
on Arweave
-
-
-
-
-
-
-
-
-
+ {/* Create a grid that has two rows on mobile and converts to single row on larger devices */}
+
+
+ One stop env
+ for devs
+
on Arweave
+
+
+
+
+
+
+
+
+
// 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!
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
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
+
+
+
+
+
+ {socialItems.map(({ href, label, Icon }, i) => (
+
+ ))}
+
+
+
+
+
+ );
}
export default App;
diff --git a/src/components/header.tsx b/src/components/header.tsx
index f22ed10..4a1cde7 100644
--- a/src/components/header.tsx
+++ b/src/components/header.tsx
@@ -69,7 +69,7 @@ export function Header() {
IDE
-
+
Team