minor bugs

Author: Prajualit

frontend/src/components/Authentication/Login.js

@@ -137,6 +137,7 @@ const Login = () => {
                 fontFamily="content"
                 bg="#21364a"
                 border="none"
+                textColor="white"
               />
             </FormControl>
             <FormControl id="password" isRequired>
@@ -152,6 +153,7 @@ const Login = () => {
                   fontFamily="content"
                   bg="#21364a"
                   border="none"
+                  textColor="white"
                 />
                 <InputRightElement width="4.5rem">
                   <Button
@@ -162,13 +164,14 @@ const Login = () => {
                     fontFamily="content"
                     bg="#1b3046ff"
                     textColor="white"
-                    _hover="none"
+                    _hover={{ textColor: "black", bg: "gray.300" }}
                   >
                     {show ? "Hide" : "Show"}
                   </Button>
                 </InputRightElement>
               </InputGroup>
-              <span className="text-white font-light text-[14px] leading-[0px] "
+              <span
+                className="text-white font-light text-[14px] leading-[0px] "
                 children="By signing up, you are creating a COMCONNECT account, and you
                 agree to COMCONNECT's Term of Use and Privacy Policy."
               />

frontend/src/components/Authentication/Signup.js

@@ -144,39 +144,42 @@ const Signup = () => {
         <Box width={["100%", "100%", "60%"]}>
           <VStack spacing="5px">
             <FormControl id="first-name" isRequired>
-              <FormLabel mb={0} mt={3} fontFamily="subhead" textColor="lgrey">
+              <FormLabel mb={0} mt={3} fontFamily="subhead" textColor="white">
                 Name
               </FormLabel>
               <Input
                 fontFamily="content"
                 bg="#21364a"
                 border="none"
                 placeholder="Enter Your Name"
+                textColor="white"
                 onChange={(e) => setName(e.target.value)}
               />
             </FormControl>
             <FormControl id="email" isRequired>
-              <FormLabel mb={0} mt={3} fontFamily="subhead" textColor="lgrey">
+              <FormLabel mb={0} mt={3} fontFamily="subhead" textColor="white">
                 Email Address
               </FormLabel>
               <Input
                 fontFamily="content"
                 type="email"
                 bg="#21364a"
                 border="none"
+                textColor="white"
                 placeholder="Enter Your Email Address"
                 onChange={(e) => setEmail(e.target.value)}
               />
             </FormControl>
             <FormControl id="password" isRequired>
-              <FormLabel mb={0} mt={3} fontFamily="subhead" textColor="lgrey">
+              <FormLabel mb={0} mt={3} fontFamily="subhead" textColor="white">
                 Password
               </FormLabel>
               <InputGroup size="md">
                 <Input
                   fontFamily="content"
                   bg="#21364a"
                   border="none"
+                  textColor="white"
                   type={show ? "text" : "password"}
                   placeholder="Enter Password"
                   onChange={(e) => setPassword(e.target.value)}
@@ -188,7 +191,7 @@ const Signup = () => {
                     fontFamily="content"
                     bg="#1b3046ff"
                     textColor="white"
-                    _hover="none"
+                    _hover={{ textColor: "black", bg: "gray.300" }}
                     onClick={handleClick}
                   >
                     {show ? "Hide" : "Show"}
@@ -197,14 +200,15 @@ const Signup = () => {
               </InputGroup>
             </FormControl>
             <FormControl id="password" isRequired>
-              <FormLabel mb={0} mt={3} fontFamily="subhead" textColor="lgrey">
+              <FormLabel mb={0} mt={3} fontFamily="subhead" textColor="white">
                 Confirm Password
               </FormLabel>
               <InputGroup size="md">
                 <Input
                   fontFamily="content"
                   bg="#21364a"
                   border="none"
+                  textColor="white"
                   type={show ? "text" : "password"}
                   placeholder="Confirm password"
                   onChange={(e) => setConfirmpassword(e.target.value)}
@@ -216,7 +220,7 @@ const Signup = () => {
                     fontFamily="content"
                     bg="#1b3046ff"
                     textColor="white"
-                    _hover="none"
+                    _hover={{ textColor: "black", bg: "gray.300" }}
                     onClick={handleClick}
                   >
                     {show ? "Hide" : "Show"}
@@ -225,7 +229,7 @@ const Signup = () => {
               </InputGroup>
             </FormControl>
             <FormControl id="pic">
-              <FormLabel mb={0} mt={3} fontFamily="subhead" textColor="lgrey">
+              <FormLabel mb={0} mt={3} fontFamily="subhead" textColor="white">
                 Upload your Picture
               </FormLabel>
               <Box position="relative" width="100%">