Autocomplete style fix and input type fixed for signup and login

src/frontend/src/components/inputComponent/index.tsx

@@ -30,6 +30,7 @@ export default function InputComponent({
       {isForm ? (
         <Form.Control asChild>
           <Input
+            type={password && !pwdVisible ? "password" : "text"}
             value={value}
             disabled={disabled}
             required={required}
@@ -53,6 +54,7 @@ export default function InputComponent({
         </Form.Control>
       ) : (
         <Input
+          type={password && !pwdVisible ? "password" : "text"}
           value={value}
           disabled={disabled}
           required={required}
@@ -76,6 +78,8 @@ export default function InputComponent({
       )}
       {password && (
         <button
+          type="button"
+          tabIndex={-1}
           className={classNames(
             editNode
               ? "input-component-true-button"

src/frontend/src/pages/loginPage/index.tsx

@@ -89,6 +89,7 @@ export default function LoginPage(): JSX.Element {
 
               <Form.Control asChild>
                 <Input
+                  type="username"
                   onChange={({ target: { value } }) => {
                     handleInput({ target: { name: "username", value } });
                   }}
@@ -129,12 +130,12 @@ export default function LoginPage(): JSX.Element {
           </div>
           <div className="w-full">
             <Form.Submit asChild>
-              <Button className="mr-3 mt-6 w-full">Sign in</Button>
+              <Button className="mr-3 mt-6 w-full" type="submit">Sign in</Button>
             </Form.Submit>
           </div>
           <div className="w-full">
             <Link to="/signup">
-              <Button className="w-full" variant="outline">
+              <Button className="w-full" variant="outline" type="button">
                 Don't have an account?&nbsp;<b>Sign Up</b>
               </Button>
             </Link>

src/frontend/src/pages/signUpPage/index.tsx

@@ -84,6 +84,7 @@ export default function SignUp(): JSX.Element {
 
               <Form.Control asChild>
                 <Input
+                  type="username"
                   onChange={({ target: { value } }) => {
                     handleInput({ target: { name: "username", value } });
                   }}
@@ -157,6 +158,7 @@ export default function SignUp(): JSX.Element {
           <div className="w-full">
             <Form.Submit asChild>
               <Button
+                type="submit"
                 className="mr-3 mt-6 w-full"
                 onClick={() => {
                   handleSignup();

src/frontend/src/style/classes.css

@@ -36,3 +36,18 @@ pre {
 .gradient-start {
   animation: gradient-motion-start 4s infinite forwards;
 }
+
+input:-webkit-autofill,
+input:-webkit-autofill:hover,
+input:-webkit-autofill:focus,
+textarea:-webkit-autofill,
+textarea:-webkit-autofill:hover,
+textarea:-webkit-autofill:focus,
+select:-webkit-autofill,
+select:-webkit-autofill:hover,
+select:-webkit-autofill:focus {
+  -webkit-text-fill-color: black;
+  -webkit-box-shadow: 0 0 0px 1000px #fff6d0 inset;
+  box-shadow: 0 0 0px 1000px #fff6d0 inset;
+  color: black;
+}