diff --git a/site/src/components/Welcome/Welcome.tsx b/site/src/components/Welcome/Welcome.tsx index 916ed2c43e36f..3996bf760c92a 100644 --- a/site/src/components/Welcome/Welcome.tsx +++ b/site/src/components/Welcome/Welcome.tsx @@ -37,7 +37,7 @@ export const Welcome: FC< font-size: ${theme.spacing(4)}; font-weight: 400; margin: 0; - margin-bottom: ${theme.spacing(2)}; + margin-bottom: ${theme.spacing(4)}; margin-top: ${theme.spacing(2)}; line-height: 1.25; diff --git a/site/src/pages/SetupPage/SetupPageView.tsx b/site/src/pages/SetupPage/SetupPageView.tsx index 43830ee701d77..a7939cf971f04 100644 --- a/site/src/pages/SetupPage/SetupPageView.tsx +++ b/site/src/pages/SetupPage/SetupPageView.tsx @@ -1,10 +1,6 @@ -import Box from "@mui/material/Box"; import Checkbox from "@mui/material/Checkbox"; import TextField from "@mui/material/TextField"; -import Typography from "@mui/material/Typography"; import { SignInLayout } from "components/SignInLayout/SignInLayout"; -import { Stack } from "components/Stack/Stack"; -import { Welcome } from "components/Welcome/Welcome"; import { type FormikContextType, useFormik } from "formik"; import { getFormHelpers, @@ -14,6 +10,10 @@ import { import * as Yup from "yup"; import type * as TypesGen from "api/typesGenerated"; import LoadingButton from "@mui/lab/LoadingButton"; +import { FormFields, VerticalForm } from "components/Form/Form"; +import { CoderIcon } from "components/Icons/CoderIcon"; +import Link from "@mui/material/Link"; +import { docs } from "utils/docs"; export const Language = { emailLabel: "Email", @@ -64,10 +64,40 @@ export const SetupPageView: React.FC = ({ return ( - -
- +
({ + textAlign: "center", + marginBottom: theme.spacing(4), + })} + > + ({ + color: theme.palette.text.primary, + fontSize: theme.spacing(8), + })} + /> +

({ + fontWeight: 400, + margin: 0, + marginTop: theme.spacing(2), + })} + > + Welcome to Coder +

+
({ + marginTop: theme.spacing(1.5), + color: theme.palette.text.secondary, + })} + > + Let‘s create your first admin user account +
+
+ + = ({ label={Language.passwordLabel} type="password" /> -
- -
- -
- - - Start a 30-day free trial of Enterprise - - - Get access to high availability, template RBAC, audit logging, - quotas, and more. - - -
-
+ + {Language.create} -
-
+ +
); };