Users should be presented with a reset password link

.eslintrc.json

@@ -16,9 +16,10 @@
     "airbnb-typescript",
     "plugin:react/recommended",
     "plugin:@typescript-eslint/recommended",
+    "plugin:jsx-a11y/recommended",
     "plugin:storybook/recommended"
   ],
-  "ignorePatterns":["jest.config.ts"],
+  "ignorePatterns": ["jest.config.ts"],
   "rules": {
     "react-hooks/rules-of-hooks": "error",
     "react-hooks/exhaustive-deps": "warn",
@@ -58,7 +59,12 @@
     "no-param-reassign": "off",
     "arrow-body-style": ["warn", "as-needed"],
     "jsx-a11y/no-static-element-interactions": "off",
-    "max-len": "off"
+    "max-len": "off",
+    "jsx-a11y/label-has-associated-control": ["error", {
+      "required": {
+        "some": ["nesting", "id"]
+      }
+    }]
   },
   "settings": {
     "react": {
@@ -72,4 +78,4 @@
       }
     }
   }
-}
+}

netlify.toml

@@ -1,10 +1,10 @@
-[[redirects]]
-  from = "/*"
-  to = "/index.html"
-  status = 200
-
-[[redirects]]
-  from = "/api/*"
-  to = "/index.html"
-  status = 200
+[[redirects]]
+  from = "/*"
+  to = "/index.html"
+  status = 200
+
+[[redirects]]
+  from = "/api/*"
+  to = "/index.html"
+  status = 200
   force = true

package.json

@@ -10,6 +10,8 @@
     "build-storybook": "storybook build"
   },
   "dependencies": {
+    "@fortawesome/free-solid-svg-icons": "^6.5.2",
+    "@fortawesome/react-fontawesome": "^0.2.2",
     "@reduxjs/toolkit": "^2.2.5",
     "axios": "^1.7.2",
     "dotenv": "^16.4.5",

src/App.scss

@@ -14,4 +14,6 @@
 @import './assets/styles/Sidebar.scss';
 @import './assets/styles/Header.scss';
 @import "./assets/styles/Product.scss";
-@import "./assets/styles/Loader.scss"
+@import "./assets/styles/Loader.scss";
+@import "./assets/styles/reset-password.scss";
+

src/assets/styles/AdminHeader.scss

@@ -100,4 +100,4 @@
       }
     }
   }
-}
+}

src/assets/styles/Button.scss

@@ -69,4 +69,4 @@
   .button-text {
     vertical-align: middle;
   }
-}
+}

src/assets/styles/Categories.scss

@@ -183,4 +183,4 @@
     font-size: 2.4rem;
     font-weight: 900;
   }
-}
+}

src/assets/styles/Footer.scss

@@ -144,4 +144,4 @@
     height: 3.2rem;
     color: $white-2;
   }
-}
+}

src/assets/styles/Header.scss

@@ -300,4 +300,4 @@
       z-index: 2;
     }
   }
-}
+}

src/assets/styles/Input.scss

@@ -155,4 +155,4 @@
     color: $icon-color;
     margin-right: 0.1rem;
   }
-}
+}

src/assets/styles/LandingPage.scss

@@ -1,80 +1,80 @@
-.landing-container {
-  padding: 3rem 2rem 4rem 5rem;
-
-  .loader {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    height: 100vh;
-  }
-
-  .error-message {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    height: 100vh;
-    color: $black-3;
-    font-size: 1.8rem;
-    background-color: $primary-color-light;
-    border: 1px solid $primary-color-dark;
-    border-radius: 0.5rem;
-    padding: 2rem;
-  }
-  .head {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    h1 {
-      font-size: 3.6rem;
-    }
-  }
-
-  .product-list {
-    display: grid;
-    grid-template-columns: repeat(auto-fill, minmax(26rem, 1fr));
-    gap: 1.7rem;
-  }
-}
-
-.not-found{
-  display: flex;
-  align-items: center;
-  flex-direction: column;
-
-  .not-found-img img{
-    width: 40vw;
-  }
-  .not-found-text{
-     font-family: $text-family;
-     font-weight: 700;
-     font-size: 1.2rem;
-     margin-top: 1rem;
-     margin-bottom: 2rem;
-     text-align: center;
-     line-height: 1.5;
-     letter-spacing: 0.05em;
-     color: $text2-color;
-     text-decoration: none;
-     transition: all 0.3s ease-in-out;
-  }
-  .btn-link{
-      border: none;
-      background-color: $primary-color;
-      padding: 1rem 4rem;
-      text-decoration: none;
-      color: $white-color;
-      font-family: $text-family;
-      font-weight: 700;
-      font-size: 1.2rem;
-      border-radius: 2rem;
-      cursor: pointer;
-  }
-
-  .btn-link:hover{
-      background-color: $white-color;
-      color: $primary-color;
-      border: 1px solid $border-color;
-      box-shadow: 2px 2px 10px rgba(0,0,0,0.5);
-      transition: all 0.3s ease-in-out;
-  }
+.landing-container {
+  padding: 3rem 2rem 4rem 5rem;
+
+  .loader {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    height: 100vh;
+  }
+
+  .error-message {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    height: 100vh;
+    color: $black-3;
+    font-size: 1.8rem;
+    background-color: $primary-color-light;
+    border: 1px solid $primary-color-dark;
+    border-radius: 0.5rem;
+    padding: 2rem;
+  }
+  .head {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    h1 {
+      font-size: 3.6rem;
+    }
+  }
+
+  .product-list {
+    display: grid;
+    grid-template-columns: repeat(auto-fill, minmax(26rem, 1fr));
+    gap: 1.7rem;
+  }
+}
+
+.not-found{
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+
+  .not-found-img img{
+    width: 40vw;
+  }
+  .not-found-text{
+     font-family: $text-family;
+     font-weight: 700;
+     font-size: 1.2rem;
+     margin-top: 1rem;
+     margin-bottom: 2rem;
+     text-align: center;
+     line-height: 1.5;
+     letter-spacing: 0.05em;
+     color: $text2-color;
+     text-decoration: none;
+     transition: all 0.3s ease-in-out;
+  }
+  .btn-link{
+      border: none;
+      background-color: $primary-color;
+      padding: 1rem 4rem;
+      text-decoration: none;
+      color: $white-color;
+      font-family: $text-family;
+      font-weight: 700;
+      font-size: 1.2rem;
+      border-radius: 2rem;
+      cursor: pointer;
+  }
+
+  .btn-link:hover{
+      background-color: $white-color;
+      color: $primary-color;
+      border: 1px solid $border-color;
+      box-shadow: 2px 2px 10px rgba(0,0,0,0.5);
+      transition: all 0.3s ease-in-out;
+  }
 }

src/assets/styles/Product.scss

@@ -107,4 +107,4 @@
       margin-bottom: 1rem;
     }
   }
-}
+}

src/assets/styles/Sample.scss

@@ -197,4 +197,4 @@
       }
     }
   }
-}
+}

src/assets/styles/SearchInput.scss

@@ -53,4 +53,4 @@
       outline: none;
     }
   }
-}
+}

src/assets/styles/SellerHeader.scss

@@ -57,4 +57,4 @@
   height: 3.2rem;
   transform: translateX(0.6rem);
   background-color: #666;
-}
+}

src/assets/styles/Sidebar.scss

@@ -132,4 +132,4 @@
 
 .rotate {
   transform: rotate(-90deg);
-}
+}