[wip] create account

src/app/(sidebar)/account/create/page.tsx

@@ -1,5 +1,29 @@
 "use client";
 
+import { Card, Link, Text, Button, Icon } from "@stellar/design-system";
+
+import { NextLink } from "@/components/NextLink";
+
 export default function CreateAccount() {
-  return <div>Create Account</div>;
+  return (
+    <Card>
+      <div className="CardText">
+        <Text size="lg" as="h1" weight="medium">
+          Keypair Generator
+        </Text>
+
+        <Text size="sm" as="p">
+          These keypairs can be used on the Stellar network where one is
+          required. For example, it can be used as an account master key,
+          account signer, and/or as a stellar-core node key.
+        </Text>
+      </div>
+
+      <div className="padding-top-30">
+        <Button size="md" variant="tertiary">
+          Generate keypair
+        </Button>
+      </div>
+    </Card>
+  );
 }

src/styles/globals.scss

@@ -299,3 +299,27 @@
     margin-bottom: 0 !important;
   }
 }
+
+.IntroCards {
+  display: grid;
+  gap: pxToRem(12px);
+  grid-template-columns: 1fr 1fr;
+
+  .Card {
+    display: flex;
+    flex-direction: column;
+    gap: pxToRem(8px);
+    justify-content: space-between;
+
+    :nth-child(2) {
+      flex: 1;
+    }
+  }
+}
+
+// =============================================================================
+// Margin | Padding
+// =============================================================================
+.padding-top-30 {
+  padding-top: pxToRem(30px);
+}