added wrenchboard icons

2023-10-18 00:06:12 +01:00
parent 122e2c59b8
commit d092c6f909
11 changed files with 43 additions and 44 deletions
@@ -1,7 +1,10 @@
 .favicon {
  position: relative;
  top: 5px;
-  margin-left: 10px;
+  max-width: 250px;
+  max-height: 250px;
+  width: 100%;
+  height: 100%;
 }

 /* googleBtn */
@@ -8,6 +8,7 @@ import Button from "@mui/material/Button";
 import FormControlLabel from "@mui/material/FormControlLabel";
 import Checkbox from "@mui/material/Checkbox";
 import styles from "@/components/Authentication/Authentication.module.css";
+import WrenchBoardLogo from "@/public/images/logos/wrenchboard-logo.png";

 const SignInForm = () => {
  const handleSubmit = (event) => {
@@ -33,47 +34,21 @@ const SignInForm = () => {
        >
          <Grid item xs={12} md={12} lg={12} xl={12}>
            <Box>
-              <Typography as="h1" fontSize="28px" fontWeight="700" mb="65px">
-                Sign In{" "}
+              <Box
+                display="flex"
+                alignItems="center"
+                justifyContent="center"
+                mb="60px"
+              >
                <img
-                  src="/images/favicon.png"
-                  alt="favicon"
+                  src="/images/logos/wrenchboard-logo.png"
+                  alt="logo"
                  className={styles.favicon}
                />
-              </Typography>
-
-              {/* <Typography fontSize="15px" mb="30px">
-                Already have an account?{" "}
-                <Link
-                  href="/authentication/sign-up"
-                  className="primaryColor text-decoration-none"
-                >
-                  Sign up
-                </Link>
-              </Typography>
-
-              <Box
-                sx={{
-                  display: "flex",
-                  justifyContent: "space-between",
-                  alignItems: "center",
-                  mb: "30px",
-                }}
-              >
-                <Link href="#" className={styles.googleBtn}>
-                  <img src="/images/google-icon.png" />
-                  Sign in with Google
-                </Link>
-
-                <Link href="#" className={styles.fbBtn}>
-                  <img src="/images/fb-icon.png" />
-                  Sign in with Facebook
-                </Link>
              </Box>
-
-              <div className={styles.or}>
-                <span>or</span>
-              </div> */}
+              <Typography as="h1" fontSize="28px" fontWeight="700" mb="5px">
+                Sign In{" "}
+              </Typography>

              <Box component="form" noValidate onSubmit={handleSubmit}>
                <Box
@@ -46,13 +46,13 @@ const Sidebar = ({ toogleActive }) => {
            >
              <Link href='/'>
                <img 
-                  src="/images/logo.png" alt="Logo" 
+                  src="/images/logos/wrenchboard-logo.png" alt="Logo" 
                  className='black-logo' 
                />

                {/* For Dark Variation */}
                <img 
-                  src="/images/logo-white.png" alt="Logo" 
+                  src="/images/logos/wrenchboard-logo.png" alt="Logo" 
                  className='white-logo' 
                />
              </Link>
@@ -10,7 +10,7 @@ const AuthRoute = ({ children }) => {
  const router = useRouter();

  useEffect(() => {
-    const isAuthenticated = false; // In a real application, this would be determined based on the user's authentication status.
+    const isAuthenticated = true; // In a real application, this would be determined based on the user's authentication status.

    if (!isAuthenticated) {
      router.push("/authentication/sign-in/");
@@ -7,11 +7,32 @@ class MyDocument extends Document {
    return (
      <Html dir={dir} lang={locale}>
        <Head>
-          <link rel="icon" href="/images/favicon.png" />
-          <link 
-            href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap" 
+          <link
+            href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap"
            rel="stylesheet"
          />
+
+          {/* Icons */}
+          <link rel="icon" href="/images/icons/favicon.ico" />
+          <link
+            rel="icon"
+            href="/images/icons/favicon-16x16.png"
+            sizes="16x16"
+            type="image/png"
+          />
+          <link
+            rel="icon"
+            href="/images/icons/android-chrome-192x192.png"
+            sizes="192x192"
+            type="image/png"
+          />
+          <link rel="apple-touch-icon" href="/icons/apple-touch-icon.png" />
+          <link
+            rel="icon"
+            href="/images/icons/android-chrome-512x512.png"
+            sizes="512x512"
+            type="image/png"
+          />
        </Head>
        <body>
          <Main />