Prettify the code

CS3219-AY2425S1 · Oct 1, 2024 · d9beee8 · d9beee8
1 parent a8182f0
commit d9beee8
Show file tree

Hide file tree

Showing 5 changed files with 36 additions and 71 deletions.
diff --git a/frontend/src/components/Navbar/Navbar.tsx b/frontend/src/components/Navbar/Navbar.tsx
@@ -7,10 +7,10 @@ import { useMainDialog } from "../../contexts/MainDialogContext";
 
 const Navbar = (): ReactElement => {
   const { openMainDialog, setMainDialogTitle, setMainDialogContent } = useMainDialog();
-  const navigate = useNavigate(); 
+  const navigate = useNavigate();
 
   const redirectToSignUp = () => {
-    navigate("/signup"); 
+    navigate("/signup");
   };
 
   const redirectToLogin = () => {

diff --git a/frontend/src/pages/Login/Login.scss b/frontend/src/pages/Login/Login.scss
@@ -44,12 +44,12 @@
 
     .MuiTextField-root {
       background-color: #333;
-      border-radius: 50px; 
+      border-radius: 50px;
       padding: 10px 15px;
 
       .MuiOutlinedInput-notchedOutline {
         border-color: #555;
-        border-radius: 50px; 
+        border-radius: 50px;
       }
 
       .MuiInputLabel-root {
@@ -72,15 +72,15 @@
   }
 
   &-button {
-    grid-column: span 2; 
+    grid-column: span 2;
     background-color: #d4ff50;
     color: black;
     padding: 10px 20px;
     border-radius: 5px;
     font-size: 1.2rem;
     text-transform: none;
     margin-top: 20px;
-    
+
     &:hover {
       background-color: #c3ff40;
     }
@@ -141,11 +141,10 @@
 }
 
 .forgot-password {
-  color: #3f51b5; 
+  color: #3f51b5;
   cursor: pointer;
 
   &:hover {
-    text-decoration: underline; 
+    text-decoration: underline;
   }
 }
-
diff --git a/frontend/src/pages/Login/Login.tsx b/frontend/src/pages/Login/Login.tsx
@@ -2,8 +2,8 @@ import { ReactElement, useState } from "react";
 import { Box, Button, Typography, TextField, IconButton, InputAdornment } from "@mui/material";
 import Navbar from "../../components/Navbar/Navbar";
 import Footer from "../../components/Footer/Footer";
-import Visibility from '@mui/icons-material/Visibility';
-import VisibilityOff from '@mui/icons-material/VisibilityOff';
+import Visibility from "@mui/icons-material/Visibility";
+import VisibilityOff from "@mui/icons-material/VisibilityOff";
 import "./Login.scss";
 
 const Login = (): ReactElement => {
@@ -25,14 +25,9 @@ const Login = (): ReactElement => {
           Welcome back! Please log in to access your account.
         </Typography>
 
-        <Box className="Login-form" sx={{ display: 'flex', flexDirection: 'column', alignItems: 'center' }}>
-          <Box sx={{ display: 'flex', width: '100%', justifyContent: 'space-between'}}>
-            <TextField
-              label="Enter your Email"
-              variant="outlined"
-              fullWidth
-              sx={{ mr: 1 }} 
-            />
+        <Box className="Login-form" sx={{ display: "flex", flexDirection: "column", alignItems: "center" }}>
+          <Box sx={{ display: "flex", width: "100%", justifyContent: "space-between" }}>
+            <TextField label="Enter your Email" variant="outlined" fullWidth sx={{ mr: 1 }} />
             <TextField
               label="Enter your Password"
               type={showPassword ? "text" : "password"}
@@ -41,32 +36,24 @@ const Login = (): ReactElement => {
               InputProps={{
                 endAdornment: (
                   <InputAdornment position="end">
-                    <IconButton
-                      onClick={togglePasswordVisibility}
-                      className="password-eye-icon"
-                      edge="end"
-                    >
+                    <IconButton onClick={togglePasswordVisibility} className="password-eye-icon" edge="end">
                       {showPassword ? <VisibilityOff /> : <Visibility />}
                     </IconButton>
                   </InputAdornment>
-                )
+                ),
               }}
             />
           </Box>
-          <Typography 
-            component="a" 
-            href="/forgot-password" 
-            className="forgot-password" 
-            sx={{ textDecoration: 'underline', textAlign: 'center' }}
+          <Typography
+            component="a"
+            href="/forgot-password"
+            className="forgot-password"
+            sx={{ textDecoration: "underline", textAlign: "center" }}
           >
             Forgot password?
           </Typography>
 
-          <Button
-            color="primary"
-            variant="contained"
-            className="LoginUp-button"
-          >
+          <Button color="primary" variant="contained" className="LoginUp-button">
             Login
           </Button>
 

diff --git a/frontend/src/pages/SignUp/SignUp.scss b/frontend/src/pages/SignUp/SignUp.scss
@@ -44,12 +44,12 @@
 
     .MuiTextField-root {
       background-color: #333;
-      border-radius: 50px; 
+      border-radius: 50px;
       padding: 10px 15px;
 
       .MuiOutlinedInput-notchedOutline {
         border-color: #555;
-        border-radius: 50px; 
+        border-radius: 50px;
       }
 
       .MuiInputLabel-root {
@@ -72,15 +72,15 @@
   }
 
   &-button {
-    grid-column: span 2; 
+    grid-column: span 2;
     background-color: #d4ff50;
     color: black;
     padding: 10px 20px;
     border-radius: 5px;
     font-size: 1.2rem;
     text-transform: none;
     margin-top: 20px;
-    
+
     &:hover {
       background-color: #c3ff40;
     }
@@ -139,4 +139,3 @@
     }
   }
 }
-
diff --git a/frontend/src/pages/SignUp/SignUp.tsx b/frontend/src/pages/SignUp/SignUp.tsx
@@ -2,8 +2,8 @@ import { ReactElement, useState } from "react";
 import { Box, Button, Typography, TextField, IconButton, InputAdornment } from "@mui/material";
 import Navbar from "../../components/Navbar/Navbar";
 import Footer from "../../components/Footer/Footer";
-import Visibility from '@mui/icons-material/Visibility';
-import VisibilityOff from '@mui/icons-material/VisibilityOff';
+import Visibility from "@mui/icons-material/Visibility";
+import VisibilityOff from "@mui/icons-material/VisibilityOff";
 import "./SignUp.scss";
 
 const SignUp = (): ReactElement => {
@@ -19,28 +19,17 @@ const SignUp = (): ReactElement => {
 
       <Box className="SignUp-container">
         <Typography variant="body2" className="Home-welcome-title">
-            Sign Up
+          Sign Up
         </Typography>
         <Typography className="SignUp-subtitle" sx={{ mb: 3 }}>
-          Empower your interview preparation today! Create an account to unlock exclusive features and personalized experiences.
+          Empower your interview preparation today! Create an account to unlock exclusive features and personalized
+          experiences.
         </Typography>
 
         <Box className="SignUp-form">
-          <TextField
-            label="Enter First Name"
-            variant="outlined"
-            fullWidth
-          />
-          <TextField
-            label="Enter Last Name"
-            variant="outlined"
-            fullWidth
-          />
-          <TextField
-            label="Enter your Email"
-            variant="outlined"
-            fullWidth
-          />
+          <TextField label="Enter First Name" variant="outlined" fullWidth />
+          <TextField label="Enter Last Name" variant="outlined" fullWidth />
+          <TextField label="Enter your Email" variant="outlined" fullWidth />
           <TextField
             label="Enter your Password"
             type={showPassword ? "text" : "password"}
@@ -50,23 +39,15 @@ const SignUp = (): ReactElement => {
             InputProps={{
               endAdornment: (
                 <InputAdornment position="end">
-                  <IconButton
-                    onClick={togglePasswordVisibility}
-                    className="password-eye-icon"
-                    edge="end"
-                  >
+                  <IconButton onClick={togglePasswordVisibility} className="password-eye-icon" edge="end">
                     {showPassword ? <VisibilityOff /> : <Visibility />}
                   </IconButton>
                 </InputAdornment>
-              )
+              ),
             }}
           />
 
-          <Button
-            color="primary"
-            variant="contained"
-            className="SignUp-button"
-          >
+          <Button color="primary" variant="contained" className="SignUp-button">
             Sign Up
           </Button>
 
@@ -75,7 +56,6 @@ const SignUp = (): ReactElement => {
           </Typography>
 
           {/* <Typography className="SignUp-or">Or Continue with</Typography> */}
-
         </Box>
       </Box>