Merge pull request #321 from MuhammadKhalilzadeh/add-product-logo

Product logo added

Client/src/Components/NavBar/index.css

@@ -30,3 +30,9 @@
   height: 16px;
   color: var(--env-var-color-25);
 }
+
+#bw-uptime-logo-dashboard {
+  width: fit-content;
+  height: 16px;
+  margin-left: 15px;
+}

Client/src/Components/NavBar/index.jsx

@@ -23,6 +23,8 @@ 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?react";
+
 const settings = ["Profile", "Password", "Team", "Logout"];
 const icons = {
   Profile: <UserSvg />,
@@ -103,22 +105,7 @@ function NavBar() {
     >
       <Container maxWidth="xxl" sx={{ width: "100%" }}>
         <Toolbar disableGutters>
-          <Typography
-            variant="h6"
-            noWrap
-            component="a"
-            href="#"
-            sx={{
-              mr: 2,
-              display: { xs: "none", md: "flex" },
-              fontWeight: theme.typography.fontWeightBold,
-              letterSpacing: theme.spacing(0.3),
-              color: "var(--env-var-color-11)",
-              textDecoration: "none",
-            }}
-          >
-            Peak Watch
-          </Typography>
+          <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,8 +17,9 @@
   text-align: center;
 }
 
-.login-form-header-logo {
-  margin: 0 auto;
+#login-form-header-logo {
+  margin: 30px;
+  margin-bottom: 60px;
 }
 
 .login-form-v-spacing {

Client/src/Pages/Login/index.jsx

@@ -3,7 +3,8 @@ import { useNavigate } from "react-router-dom";
 
 import "./index.css";
 import BackgroundPattern from "../../Components/BackgroundPattern/BackgroundPattern";
-import Logomark from "../../assets/Images/Logomark.png";
+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";
 import Google from "../../assets/Images/Google.png";
@@ -115,11 +116,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>