useless code removed, imgs turned to svgs

Client/src/Components/NavBar/index.css

@@ -32,7 +32,7 @@
 }
 
 #bw-uptime-logo-dashboard {
+  width: fit-content;
   height: 16px;
-  float: left;
   margin-left: 15px;
 }

Client/src/Components/NavBar/index.jsx

@@ -23,7 +23,7 @@ import UserSvg from "../../assets/icons/user.svg?react";
 import TeamSvg from "../../assets/icons/user-two.svg?react";
 import LogoutSvg from "../../assets/icons/logout.svg?react";
 
-import BWULogo from "../../assets/Images/bwl-logo.svg";
+import BWULogo from "../../assets/Images/bwl-logo.svg?react";
 
 const settings = ["Profile", "Password", "Team", "Logout"];
 const icons = {
@@ -105,11 +105,7 @@ function NavBar() {
     >
       <Container maxWidth="xxl" sx={{ width: "100%" }}>
         <Toolbar disableGutters>
-          <img
-            id="bw-uptime-logo-dashboard"
-            src={BWULogo}
-            alt="BlueWave Uptime Logo"
-          />
+          <BWULogo id="bw-uptime-logo-dashboard" alt="BlueWave Uptime Logo" />
 
           <Box sx={{ flexGrow: 1, display: { xs: "flex", md: "none" } }}>
             <IconButton

Client/src/Pages/Login/index.css

@@ -17,10 +17,9 @@
   text-align: center;
 }
 
-.login-form-header-logo {
+#login-form-header-logo {
   margin: 30px auto;
   margin-bottom: 60px;
-  width: 353px;
 }
 
 .login-form-v-spacing {

Client/src/Pages/Login/index.jsx

@@ -3,7 +3,7 @@ import { useNavigate } from "react-router-dom";
 
 import "./index.css";
 import BackgroundPattern from "../../Components/BackgroundPattern/BackgroundPattern";
-import Logomark from "../../assets/Images/bwl-logo.svg";
+import Logomark from "../../assets/Images/bwl-logo-2.svg?react";
 import EmailTextField from "../../Components/TextFields/Email/EmailTextField";
 import CheckBox from "../../Components/Checkbox/Checkbox";
 import Button from "../../Components/Button";
@@ -102,11 +102,7 @@ const Login = () => {
       <BackgroundPattern></BackgroundPattern>
       <form className="login-form" onSubmit={handleSubmit}>
         <div className="login-form-header">
-          <img
-            className="login-form-header-logo"
-            src={Logomark}
-            alt="Logomark"
-          />
+          <Logomark id="login-form-header-logo" alt="Logomark" />
           <div className="login-form-v-spacing" />
           <div className="login-form-heading">Log in to your account</div>
         </div>