diff --git a/site/components/SignIn/SignInForm.stories.tsx b/site/components/SignIn/SignInForm.stories.tsx new file mode 100644 index 0000000000..5556cf38b6 --- /dev/null +++ b/site/components/SignIn/SignInForm.stories.tsx @@ -0,0 +1,16 @@ +import { Story } from "@storybook/react" +import React from "react" +import { SignInForm, SignInProps } from "./SignInForm" + +export default { + title: "SignIn/SignInForm", + component: SignInForm, + argTypes: { + loginHandler: { action: "Login" }, + }, +} + +const Template: Story = (args) => + +export const Example = Template.bind({}) +Example.args = {} diff --git a/site/components/SignIn/SignInForm.tsx b/site/components/SignIn/SignInForm.tsx index b0fefdc45d..a456cf57ed 100644 --- a/site/components/SignIn/SignInForm.tsx +++ b/site/components/SignIn/SignInForm.tsx @@ -31,33 +31,8 @@ const useStyles = makeStyles((theme) => ({ borderTop: `1px solid ${theme.palette.action.disabled}`, paddingTop: theme.spacing(3), }, - loginTypeToggleWrapper: { + loginTextField: { marginTop: theme.spacing(2), - display: "flex", - justifyContent: "center", - }, - loginTypeToggleBtn: { - color: theme.palette.text.primary, - // We want opacity so that this isn't super highlighted for the user. - // In most cases, they shouldn't want to switch login types. - opacity: 0.5, - "&:hover": { - cursor: "pointer", - opacity: 1, - textDecoration: "underline", - }, - }, - loginTypeToggleBtnFocusVisible: { - opacity: 1, - textDecoration: "underline", - }, - loginTypeBtn: { - backgroundColor: "#2A2B45", - textTransform: "none", - - "&:not(:first-child)": { - marginTop: theme.spacing(2), - }, }, submitBtn: { marginTop: theme.spacing(2), @@ -101,6 +76,7 @@ export const SignInForm: React.FC = ({ email.trim()} form={form} formFieldName="email" @@ -108,12 +84,12 @@ export const SignInForm: React.FC = ({ inputProps={{ id: "signin-form-inpt-email", }} - margin="none" placeholder="Email" variant="outlined" /> = ({ id: "signin-form-inpt-password", }} isPassword - margin="none" placeholder="Password" variant="outlined" />