From 74209110b5b202402f323acb13d65fecdf02a470 Mon Sep 17 00:00:00 2001
From: Abhinav <abhinavk.grd@gmail.com>
Date: Thu, 19 May 2022 22:17:13 +0530
Subject: [PATCH] more pixel perfect

---
 src/components/Form/FormPaper/index.tsx | 4 ++++
 src/components/SignUp.tsx               | 2 ++
 src/components/SubmitButton.tsx         | 1 -
 src/pages/signup/index.tsx              | 2 +-
 src/themes/darkThemeOptions.tsx         | 7 +++++++
 src/utils/strings/englishConstants.tsx  | 9 +++++++--
 6 files changed, 21 insertions(+), 4 deletions(-)

diff --git a/src/components/Form/FormPaper/index.tsx b/src/components/Form/FormPaper/index.tsx
index 8f76413ee..a49bfe5c2 100644
--- a/src/components/Form/FormPaper/index.tsx
+++ b/src/components/Form/FormPaper/index.tsx
@@ -2,9 +2,13 @@ import { Paper, styled } from '@mui/material';
 
 const FormPaper = styled(Paper)(({ theme }) => ({
     padding: theme.spacing(4, 2),
+    width: '360px',
     marginRight: theme.spacing(10),
     [theme.breakpoints.down('md')]: {
         marginRight: theme.spacing(5),
     },
+    '.MuiButton-root': {
+        margin: '32px 0',
+    },
 }));
 export default FormPaper;
diff --git a/src/components/SignUp.tsx b/src/components/SignUp.tsx
index 4e72f010f..b87295902 100644
--- a/src/components/SignUp.tsx
+++ b/src/components/SignUp.tsx
@@ -161,10 +161,12 @@ export default function SignUp(props: SignUpProps) {
                                 <FormControlLabel
                                     sx={{
                                         color: 'text.secondary',
+                                        ml: -1,
                                         mt: 2,
                                     }}
                                     control={
                                         <Checkbox
+                                            size="small"
                                             disabled={loading}
                                             checked={acceptTerms}
                                             onChange={(e) =>
diff --git a/src/components/SubmitButton.tsx b/src/components/SubmitButton.tsx
index b221a9800..ddd4e7d53 100644
--- a/src/components/SubmitButton.tsx
+++ b/src/components/SubmitButton.tsx
@@ -16,7 +16,6 @@ const SubmitButton: FC<ButtonProps<'button', Props>> = ({
     return (
         <Button
             size="large"
-            sx={{ my: 4, p: '12.25px', fontSize: '18px' }}
             variant="contained"
             color="accent"
             type="submit"
diff --git a/src/pages/signup/index.tsx b/src/pages/signup/index.tsx
index 5cddc015a..172bd365b 100644
--- a/src/pages/signup/index.tsx
+++ b/src/pages/signup/index.tsx
@@ -33,7 +33,7 @@ export default function SignUpPage() {
             {loading ? (
                 <EnteSpinner />
             ) : (
-                <FormPaper sx={{ minWidth: '360px' }}>
+                <FormPaper>
                     <SignUp login={login} />
                 </FormPaper>
             )}
diff --git a/src/themes/darkThemeOptions.tsx b/src/themes/darkThemeOptions.tsx
index 9e753161f..7e5a9f33b 100644
--- a/src/themes/darkThemeOptions.tsx
+++ b/src/themes/darkThemeOptions.tsx
@@ -33,6 +33,13 @@ const darkThemeOptions = createTheme({
         MuiPaper: {
             styleOverrides: { root: { backgroundImage: 'none' } },
         },
+        MuiCssBaseline: {
+            styleOverrides: {
+                body: {
+                    letterSpacing: '0em',
+                },
+            },
+        },
         MuiLink: {
             defaultProps: {
                 underline: 'always',
diff --git a/src/utils/strings/englishConstants.tsx b/src/utils/strings/englishConstants.tsx
index 561e2a18b..b6465e56d 100644
--- a/src/utils/strings/englishConstants.tsx
+++ b/src/utils/strings/englishConstants.tsx
@@ -397,7 +397,12 @@ const englishConstants = {
         <span>try searching for New York, April 14, Christmas...</span>
     ),
     TERMS_AND_CONDITIONS: () => (
-        <>
+        <Typography
+            css={`
+                font-size: 14px;
+                font-weight: 500;
+                line-height: 20px;
+            `}>
             I agree to the{' '}
             <Link href="https://ente.io/terms" target="_blank" rel="noreferrer">
                 terms
@@ -409,7 +414,7 @@ const englishConstants = {
                 rel="noreferrer">
                 privacy policy
             </Link>{' '}
-        </>
+        </Typography>
     ),
     CONFIRM_PASSWORD_NOT_SAVED: () => (
         <p>