login and account updating working correctly

inventory-manager/src/components/user/Register.css

+.register-form-container {
+    max-width: 400px;
+    margin: 0 auto;
+    padding: 20px;
+    border: 1px solid #ccc;
+    border-radius: 5px;
+}
+
+.register-form {
+    display: flex;
+    flex-direction: column;
+    gap: 10px;
+}
+
+.form-group {
+    display: flex;
+    flex-direction: column;
+}
+
+button {
+    width: 100%;
+    padding: 10px;
+    background-color: #007bff;
+    color: #fff;
+    border: none;
+    border-radius: 5px;
+    cursor: pointer;
+}
+
+button:hover {
+    background-color: #0056b3;
+}

inventory-manager/src/components/user/Register.jsx

+import './Register.css'
 import React, { useState } from "react";
 import Axios from "axios";
 
@@ -22,59 +23,69 @@ export const Register = (props) => {
   };
 
   return (
-    <div className="auth-form-container">
-      <h2>Register</h2>
-      <form className="register-form" onSubmit={handleSubmit}>
-        <label htmlFor="fname">First name</label>
-        <input
-          value={fname}
-          onChange={(e) => setFname(e.target.value)}
-          name="fname"
-          id="fname"
-          placeholder="First Name"
-        />
+      <div className="register-form-container">
+        <h2>Register</h2>
+        <form className="register-form" onSubmit={handleSubmit}>
+          <div className="form-group">
+            <label htmlFor="fname">First name</label>
+            <input
+                value={fname}
+                onChange={(e) => setFname(e.target.value)}
+                name="fname"
+                id="fname"
+                placeholder="First Name"
+            />
+          </div>
 
-        <label htmlFor="lname">Last name</label>
-        <input
-          value={lname}
-          onChange={(e) => setLname(e.target.value)}
-          name="lname"
-          id="lname"
-          placeholder="Last Name"
-        />
+          <div className="form-group">
+            <label htmlFor="lname">Last name</label>
+            <input
+                value={lname}
+                onChange={(e) => setLname(e.target.value)}
+                name="lname"
+                id="lname"
+                placeholder="Last Name"
+            />
+          </div>
 
-        <label htmlFor="email">Email</label>
-        <input
-          value={email}
-          onChange={(e) => setEmail(e.target.value)}
-          name="email"
-          id="email"
-          placeholder="pid@vt.edu"
-          type="email"
-        />
+          <div className="form-group">
+            <label htmlFor="email">Email</label>
+            <input
+                value={email}
+                onChange={(e) => setEmail(e.target.value)}
+                name="email"
+                id="email"
+                placeholder="pid@vt.edu"
+                type="email"
+            />
+          </div>
 
-        <label htmlFor="phoneNumber">Phone Number</label>
-        <input
-          value={phoneNumber}
-          onChange={(e) => setPhoneNumber(e.target.value)}
-          id="phoneNumber"
-          name="phoneNumber"
-          placeholder="###-###-####"
-        />
+          <div className="form-group">
+            <label htmlFor="phoneNumber">Phone Number</label>
+            <input
+                value={phoneNumber}
+                onChange={(e) => setPhoneNumber(e.target.value)}
+                id="phoneNumber"
+                name="phoneNumber"
+                placeholder="###-###-####"
+            />
+          </div>
 
-        <label htmlFor="password">Password</label>
-        <input
-          value={pass}
-          onChange={(e) => setPass(e.target.value)}
-          id="password"
-          name="password"
-          placeholder="********"
-          type="password"
-        />
+          <div className="form-group">
+            <label htmlFor="password">Password</label>
+            <input
+                value={pass}
+                onChange={(e) => setPass(e.target.value)}
+                id="password"
+                name="password"
+                placeholder="********"
+                type="password"
+            />
+          </div>
 
-        <button type="submit">Log In</button>
-      </form>
-    </div>
+          <button type="submit">Register</button>
+        </form>
+      </div>
   );
 };