more pixel perfect

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;

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) =>

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"

src/pages/signup/index.tsx

@@ -33,7 +33,7 @@ export default function SignUpPage() {
             {loading ? (
                 <EnteSpinner />
             ) : (
-                <FormPaper sx={{ minWidth: '360px' }}>
+                <FormPaper>
                     <SignUp login={login} />
                 </FormPaper>
             )}

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',

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>