diff --git a/src/components/FirebaseUi.tsx b/src/components/FirebaseUi.tsx index ceda7035..08c26f92 100644 --- a/src/components/FirebaseUi.tsx +++ b/src/components/FirebaseUi.tsx @@ -29,9 +29,20 @@ const useStyles = makeStyles()((theme) => ({ color: theme.palette.text.secondary, fontFamily: theme.typography.fontFamily, }, - "& .firebaseui-tos": { + "& .firebaseui-provider-sign-in-footer > .firebaseui-tos": { ...(theme.typography.caption as any), color: theme.palette.text.disabled, + textAlign: "left", + marginTop: theme.spacing(1), + marginBottom: 0, + "& .firebaseui-link": { + textDecorationColor: theme.palette.divider, + "&:hover": { textDecorationColor: "currentcolor" }, + }, + }, + "& .firebaseui-link": { + color: "inherit", + textDecoration: "underline", }, "& .firebaseui-country-selector": { color: theme.palette.text.primary, @@ -259,9 +270,10 @@ export default function FirebaseUi(props: IFirebaseUiProps) { Continue with diff --git a/src/config/firebaseui.ts b/src/config/firebaseui.ts index e015e190..e2a28f22 100644 --- a/src/config/firebaseui.ts +++ b/src/config/firebaseui.ts @@ -65,8 +65,8 @@ export const defaultUiConfig: firebaseui.auth.Config = { signInFlow: "popup", signInSuccessUrl: "/", signInOptions: [authOptions.google], - // tosUrl: EXTERNAL_LINKS.terms, - // privacyPolicyUrl: EXTERNAL_LINKS.privacy, + tosUrl: EXTERNAL_LINKS.terms, + privacyPolicyUrl: EXTERNAL_LINKS.privacy, }; export const getSignInOptions = ( diff --git a/src/layouts/AuthLayout.tsx b/src/layouts/AuthLayout.tsx index 22a11d6e..9406e83d 100644 --- a/src/layouts/AuthLayout.tsx +++ b/src/layouts/AuthLayout.tsx @@ -105,7 +105,6 @@ export default function AuthLayout({ display: "flex", flexDirection: "column", - // textAlign: "center", "& > :not(style) + :not(style)": { mt: 4 }, } as any @@ -125,8 +124,8 @@ export default function AuthLayout({ {children} @@ -145,7 +144,7 @@ export default function AuthLayout({ Project: {projectId} diff --git a/src/pages/Auth/AuthPage.tsx b/src/pages/Auth/AuthPage.tsx index 8e2b2ca7..2ae2ec64 100644 --- a/src/pages/Auth/AuthPage.tsx +++ b/src/pages/Auth/AuthPage.tsx @@ -1,8 +1,12 @@ -import { useSearchParams } from "react-router-dom"; +import { useSearchParams, Link } from "react-router-dom"; + +import { Typography, Link as MuiLink } from "@mui/material"; import AuthLayout from "@src/layouts/AuthLayout"; import FirebaseUi from "@src/components/FirebaseUi"; +import { ROUTES } from "@src/constants/routes"; + export default function AuthPage() { const [searchParams] = useSearchParams(); @@ -13,7 +17,23 @@ export default function AuthPage() { } return ( - + + or{" "} + + sign up + + + } + > ); diff --git a/src/pages/Auth/SignUpPage.tsx b/src/pages/Auth/SignUpPage.tsx index b31f89e1..007e07a0 100644 --- a/src/pages/Auth/SignUpPage.tsx +++ b/src/pages/Auth/SignUpPage.tsx @@ -1,10 +1,11 @@ -import { useSearchParams } from "react-router-dom"; +import { useSearchParams, Link } from "react-router-dom"; -import { Typography, Link } from "@mui/material"; +import { Typography, Link as MuiLink } from "@mui/material"; import AuthLayout from "@src/layouts/AuthLayout"; import FirebaseUi from "@src/components/FirebaseUi"; -import { EXTERNAL_LINKS } from "@src/constants/externalLinks"; + +import { ROUTES } from "@src/constants/routes"; export default function SignUpPage() { const [searchParams] = useSearchParams(); @@ -20,6 +21,18 @@ export default function SignUpPage() { title="Sign up" description={ <> + + or{" "} + + sign in + + Welcome! To join this project, sign up with the email address {searchParams.get("email") ? ( <> @@ -32,31 +45,6 @@ export default function SignUpPage() { } > - - By signing up, you agree to our{" "} - - Terms and Conditions - {" "} - and{" "} - - Privacy Policy - - . - ); }