From 93a781ea63228818d6231f51bbe9010b4a9d6221 Mon Sep 17 00:00:00 2001
From: MOHAMMED-IQRAMUL <MOHDIQRAMUL2468@GMAIL.COM>
Date: Thu, 10 Oct 2024 20:21:25 +0530
Subject: [PATCH 1/9] Installing and setup of React-Icons and TailwindCSS

---
 frontend/.hintrc                |    8 +
 frontend/package-lock.json      | 1398 ++++++++++++++++++++++++++++++-
 frontend/package.json           |    4 +
 frontend/postcss.config.js      |    6 +
 frontend/src/styles/globals.css |   20 +
 frontend/tailwind.config.js     |   11 +
 6 files changed, 1419 insertions(+), 28 deletions(-)
 create mode 100644 frontend/.hintrc
 create mode 100644 frontend/postcss.config.js
 create mode 100644 frontend/src/styles/globals.css
 create mode 100644 frontend/tailwind.config.js

diff --git a/frontend/.hintrc b/frontend/.hintrc
new file mode 100644
index 00000000..cb34607d
--- /dev/null
+++ b/frontend/.hintrc
@@ -0,0 +1,8 @@
+{
+  "extends": [
+    "development"
+  ],
+  "hints": {
+    "no-inline-styles": "off"
+  }
+}
\ No newline at end of file
diff --git a/frontend/package-lock.json b/frontend/package-lock.json
index 2ca0ed36..f5eb7a5a 100644
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
@@ -17,6 +17,7 @@
 				"framer-motion": "^11.9.0",
 				"react": "^18.3.1",
 				"react-dom": "^18.3.1",
+				"react-icons": "^5.3.0",
 				"react-intl": "^6.7.0",
 				"react-redux": "^9.1.2",
 				"react-router-dom": "^6.26.2",
@@ -30,10 +31,26 @@
 				"@types/react-dom": "^18.3.0",
 				"@types/react-redux": "^7.1.34",
 				"@vitejs/plugin-react": "^4.3.2",
+				"autoprefixer": "^10.4.20",
+				"postcss": "^8.4.47",
+				"tailwindcss": "^3.4.13",
 				"typescript": "^5.6.2",
 				"vite": "^5.4.8"
 			}
 		},
+		"node_modules/@alloc/quick-lru": {
+			"version": "5.2.0",
+			"resolved": "https://registry.npmjs.org/@alloc/quick-lru/-/quick-lru-5.2.0.tgz",
+			"integrity": "sha512-UrcABB+4bUrFABwbluTIBErXwvbsU/V7TZWfmbgJfbkwiBuziS9gxdODUyuiecfdGQ85jglMW6juS3+z5TsKLw==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": ">=10"
+			},
+			"funding": {
+				"url": "https://github.com/sponsors/sindresorhus"
+			}
+		},
 		"node_modules/@ampproject/remapping": {
 			"version": "2.3.0",
 			"resolved": "https://registry.npmjs.org/@ampproject/remapping/-/remapping-2.3.0.tgz",
@@ -990,6 +1007,24 @@
 				"tslib": "^2.4.0"
 			}
 		},
+		"node_modules/@isaacs/cliui": {
+			"version": "8.0.2",
+			"resolved": "https://registry.npmjs.org/@isaacs/cliui/-/cliui-8.0.2.tgz",
+			"integrity": "sha512-O8jcjabXaleOG9DQ0+ARXWZBTfnP4WNAqzuiJK7ll44AmxGKv/J2M4TPjxjY3znBCfvBXFzucm1twdyFybFqEA==",
+			"dev": true,
+			"license": "ISC",
+			"dependencies": {
+				"string-width": "^5.1.2",
+				"string-width-cjs": "npm:string-width@^4.2.0",
+				"strip-ansi": "^7.0.1",
+				"strip-ansi-cjs": "npm:strip-ansi@^6.0.1",
+				"wrap-ansi": "^8.1.0",
+				"wrap-ansi-cjs": "npm:wrap-ansi@^7.0.0"
+			},
+			"engines": {
+				"node": ">=12"
+			}
+		},
 		"node_modules/@jridgewell/gen-mapping": {
 			"version": "0.3.5",
 			"resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.5.tgz",
@@ -1267,6 +1302,55 @@
 				}
 			}
 		},
+		"node_modules/@nodelib/fs.scandir": {
+			"version": "2.1.5",
+			"resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
+			"integrity": "sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"@nodelib/fs.stat": "2.0.5",
+				"run-parallel": "^1.1.9"
+			},
+			"engines": {
+				"node": ">= 8"
+			}
+		},
+		"node_modules/@nodelib/fs.stat": {
+			"version": "2.0.5",
+			"resolved": "https://registry.npmjs.org/@nodelib/fs.stat/-/fs.stat-2.0.5.tgz",
+			"integrity": "sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": ">= 8"
+			}
+		},
+		"node_modules/@nodelib/fs.walk": {
+			"version": "1.2.8",
+			"resolved": "https://registry.npmjs.org/@nodelib/fs.walk/-/fs.walk-1.2.8.tgz",
+			"integrity": "sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"@nodelib/fs.scandir": "2.1.5",
+				"fastq": "^1.6.0"
+			},
+			"engines": {
+				"node": ">= 8"
+			}
+		},
+		"node_modules/@pkgjs/parseargs": {
+			"version": "0.11.0",
+			"resolved": "https://registry.npmjs.org/@pkgjs/parseargs/-/parseargs-0.11.0.tgz",
+			"integrity": "sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg==",
+			"dev": true,
+			"license": "MIT",
+			"optional": true,
+			"engines": {
+				"node": ">=14"
+			}
+		},
 		"node_modules/@popperjs/core": {
 			"version": "2.11.8",
 			"resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.8.tgz",
@@ -1702,6 +1786,19 @@
 				"vite": "^4.2.0 || ^5.0.0"
 			}
 		},
+		"node_modules/ansi-regex": {
+			"version": "6.1.0",
+			"resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.1.0.tgz",
+			"integrity": "sha512-7HSX4QQb4CspciLpVFwyRe79O3xsIZDDLER21kERQ71oaPodF8jL725AgJMFAYbooIqolJoRLuM81SpeUkpkvA==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": ">=12"
+			},
+			"funding": {
+				"url": "https://github.com/chalk/ansi-regex?sponsor=1"
+			}
+		},
 		"node_modules/ansi-styles": {
 			"version": "3.2.1",
 			"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
@@ -1714,12 +1811,78 @@
 				"node": ">=4"
 			}
 		},
+		"node_modules/any-promise": {
+			"version": "1.3.0",
+			"resolved": "https://registry.npmjs.org/any-promise/-/any-promise-1.3.0.tgz",
+			"integrity": "sha512-7UvmKalWRt1wgjL1RrGxoSJW/0QZFIegpeGvZG9kjp8vrRu55XTHbwnqq2GpXm9uLbcuhxm3IqX9OB4MZR1b2A==",
+			"dev": true,
+			"license": "MIT"
+		},
+		"node_modules/anymatch": {
+			"version": "3.1.3",
+			"resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.3.tgz",
+			"integrity": "sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==",
+			"dev": true,
+			"license": "ISC",
+			"dependencies": {
+				"normalize-path": "^3.0.0",
+				"picomatch": "^2.0.4"
+			},
+			"engines": {
+				"node": ">= 8"
+			}
+		},
+		"node_modules/arg": {
+			"version": "5.0.2",
+			"resolved": "https://registry.npmjs.org/arg/-/arg-5.0.2.tgz",
+			"integrity": "sha512-PYjyFOLKQ9y57JvQ6QLo8dAgNqswh8M1RMJYdQduT6xbWSgK36P/Z/v+p888pM69jMMfS8Xd8F6I1kQ/I9HUGg==",
+			"dev": true,
+			"license": "MIT"
+		},
 		"node_modules/asynckit": {
 			"version": "0.4.0",
 			"resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
 			"integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==",
 			"license": "MIT"
 		},
+		"node_modules/autoprefixer": {
+			"version": "10.4.20",
+			"resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.20.tgz",
+			"integrity": "sha512-XY25y5xSv/wEoqzDyXXME4AFfkZI0P23z6Fs3YgymDnKJkCGOnkL0iTxCa85UTqaSgfcqyf3UA6+c7wUvx/16g==",
+			"dev": true,
+			"funding": [
+				{
+					"type": "opencollective",
+					"url": "https://opencollective.com/postcss/"
+				},
+				{
+					"type": "tidelift",
+					"url": "https://tidelift.com/funding/github/npm/autoprefixer"
+				},
+				{
+					"type": "github",
+					"url": "https://github.com/sponsors/ai"
+				}
+			],
+			"license": "MIT",
+			"dependencies": {
+				"browserslist": "^4.23.3",
+				"caniuse-lite": "^1.0.30001646",
+				"fraction.js": "^4.3.7",
+				"normalize-range": "^0.1.2",
+				"picocolors": "^1.0.1",
+				"postcss-value-parser": "^4.2.0"
+			},
+			"bin": {
+				"autoprefixer": "bin/autoprefixer"
+			},
+			"engines": {
+				"node": "^10 || ^12 || >=14"
+			},
+			"peerDependencies": {
+				"postcss": "^8.1.0"
+			}
+		},
 		"node_modules/axios": {
 			"version": "1.7.7",
 			"resolved": "https://registry.npmjs.org/axios/-/axios-1.7.7.tgz",
@@ -1746,6 +1909,49 @@
 				"npm": ">=6"
 			}
 		},
+		"node_modules/balanced-match": {
+			"version": "1.0.2",
+			"resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
+			"integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
+			"dev": true,
+			"license": "MIT"
+		},
+		"node_modules/binary-extensions": {
+			"version": "2.3.0",
+			"resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.3.0.tgz",
+			"integrity": "sha512-Ceh+7ox5qe7LJuLHoY0feh3pHuUDHAcRUeyL2VYghZwfpkNIy/+8Ocg0a3UuSoYzavmylwuLWQOf3hl0jjMMIw==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": ">=8"
+			},
+			"funding": {
+				"url": "https://github.com/sponsors/sindresorhus"
+			}
+		},
+		"node_modules/brace-expansion": {
+			"version": "2.0.1",
+			"resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
+			"integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"balanced-match": "^1.0.0"
+			}
+		},
+		"node_modules/braces": {
+			"version": "3.0.3",
+			"resolved": "https://registry.npmjs.org/braces/-/braces-3.0.3.tgz",
+			"integrity": "sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"fill-range": "^7.1.1"
+			},
+			"engines": {
+				"node": ">=8"
+			}
+		},
 		"node_modules/browserslist": {
 			"version": "4.24.0",
 			"resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.24.0.tgz",
@@ -1788,6 +1994,16 @@
 				"node": ">=6"
 			}
 		},
+		"node_modules/camelcase-css": {
+			"version": "2.0.1",
+			"resolved": "https://registry.npmjs.org/camelcase-css/-/camelcase-css-2.0.1.tgz",
+			"integrity": "sha512-QOSvevhslijgYwRx6Rv7zKdMF8lbRmx+uQGx2+vDc+KI/eBnsy9kit5aj23AgGu3pa4t9AgwbnXWqS+iOY+2aA==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": ">= 6"
+			}
+		},
 		"node_modules/caniuse-lite": {
 			"version": "1.0.30001664",
 			"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001664.tgz",
@@ -1832,6 +2048,44 @@
 				"node": ">=0.8.0"
 			}
 		},
+		"node_modules/chokidar": {
+			"version": "3.6.0",
+			"resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.6.0.tgz",
+			"integrity": "sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"anymatch": "~3.1.2",
+				"braces": "~3.0.2",
+				"glob-parent": "~5.1.2",
+				"is-binary-path": "~2.1.0",
+				"is-glob": "~4.0.1",
+				"normalize-path": "~3.0.0",
+				"readdirp": "~3.6.0"
+			},
+			"engines": {
+				"node": ">= 8.10.0"
+			},
+			"funding": {
+				"url": "https://paulmillr.com/funding/"
+			},
+			"optionalDependencies": {
+				"fsevents": "~2.3.2"
+			}
+		},
+		"node_modules/chokidar/node_modules/glob-parent": {
+			"version": "5.1.2",
+			"resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
+			"integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
+			"dev": true,
+			"license": "ISC",
+			"dependencies": {
+				"is-glob": "^4.0.1"
+			},
+			"engines": {
+				"node": ">= 6"
+			}
+		},
 		"node_modules/clsx": {
 			"version": "2.1.1",
 			"resolved": "https://registry.npmjs.org/clsx/-/clsx-2.1.1.tgz",
@@ -1868,6 +2122,16 @@
 				"node": ">= 0.8"
 			}
 		},
+		"node_modules/commander": {
+			"version": "4.1.1",
+			"resolved": "https://registry.npmjs.org/commander/-/commander-4.1.1.tgz",
+			"integrity": "sha512-NOKm8xhkzAjzFx8B2v5OAHT+u5pRQc2UCa2Vq9jYL/31o2wi9mxBA7LIFs3sV5VSC49z6pEhfbMULvShKj26WA==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": ">= 6"
+			}
+		},
 		"node_modules/convert-source-map": {
 			"version": "1.9.0",
 			"resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.9.0.tgz",
@@ -1890,6 +2154,34 @@
 				"node": ">=10"
 			}
 		},
+		"node_modules/cross-spawn": {
+			"version": "7.0.3",
+			"resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.3.tgz",
+			"integrity": "sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"path-key": "^3.1.0",
+				"shebang-command": "^2.0.0",
+				"which": "^2.0.1"
+			},
+			"engines": {
+				"node": ">= 8"
+			}
+		},
+		"node_modules/cssesc": {
+			"version": "3.0.0",
+			"resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz",
+			"integrity": "sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==",
+			"dev": true,
+			"license": "MIT",
+			"bin": {
+				"cssesc": "bin/cssesc"
+			},
+			"engines": {
+				"node": ">=4"
+			}
+		},
 		"node_modules/csstype": {
 			"version": "3.1.3",
 			"resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz",
@@ -1922,6 +2214,20 @@
 				"node": ">=0.4.0"
 			}
 		},
+		"node_modules/didyoumean": {
+			"version": "1.2.2",
+			"resolved": "https://registry.npmjs.org/didyoumean/-/didyoumean-1.2.2.tgz",
+			"integrity": "sha512-gxtyfqMg7GKyhQmb056K7M3xszy/myH8w+B4RT+QXBQsvAOdc3XymqDDPHx1BgPgsdAA5SIifona89YtRATDzw==",
+			"dev": true,
+			"license": "Apache-2.0"
+		},
+		"node_modules/dlv": {
+			"version": "1.1.3",
+			"resolved": "https://registry.npmjs.org/dlv/-/dlv-1.1.3.tgz",
+			"integrity": "sha512-+HlytyjlPKnIG8XuRG8WvmBP8xs8P71y+SKKS6ZXWoEgLuePxtDoUEiH7WkdePWrQ5JBpE6aoVqfZfJUQkjXwA==",
+			"dev": true,
+			"license": "MIT"
+		},
 		"node_modules/dom-helpers": {
 			"version": "5.2.1",
 			"resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-5.2.1.tgz",
@@ -1932,6 +2238,13 @@
 				"csstype": "^3.0.2"
 			}
 		},
+		"node_modules/eastasianwidth": {
+			"version": "0.2.0",
+			"resolved": "https://registry.npmjs.org/eastasianwidth/-/eastasianwidth-0.2.0.tgz",
+			"integrity": "sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==",
+			"dev": true,
+			"license": "MIT"
+		},
 		"node_modules/electron-to-chromium": {
 			"version": "1.5.30",
 			"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.30.tgz",
@@ -1939,6 +2252,13 @@
 			"dev": true,
 			"license": "ISC"
 		},
+		"node_modules/emoji-regex": {
+			"version": "9.2.2",
+			"resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-9.2.2.tgz",
+			"integrity": "sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==",
+			"dev": true,
+			"license": "MIT"
+		},
 		"node_modules/error-ex": {
 			"version": "1.3.2",
 			"resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.2.tgz",
@@ -2009,6 +2329,59 @@
 				"url": "https://github.com/sponsors/sindresorhus"
 			}
 		},
+		"node_modules/fast-glob": {
+			"version": "3.3.2",
+			"resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.2.tgz",
+			"integrity": "sha512-oX2ruAFQwf/Orj8m737Y5adxDQO0LAB7/S5MnxCdTNDd4p6BsyIVsv9JQsATbTSq8KHRpLwIHbVlUNatxd+1Ow==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"@nodelib/fs.stat": "^2.0.2",
+				"@nodelib/fs.walk": "^1.2.3",
+				"glob-parent": "^5.1.2",
+				"merge2": "^1.3.0",
+				"micromatch": "^4.0.4"
+			},
+			"engines": {
+				"node": ">=8.6.0"
+			}
+		},
+		"node_modules/fast-glob/node_modules/glob-parent": {
+			"version": "5.1.2",
+			"resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
+			"integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
+			"dev": true,
+			"license": "ISC",
+			"dependencies": {
+				"is-glob": "^4.0.1"
+			},
+			"engines": {
+				"node": ">= 6"
+			}
+		},
+		"node_modules/fastq": {
+			"version": "1.17.1",
+			"resolved": "https://registry.npmjs.org/fastq/-/fastq-1.17.1.tgz",
+			"integrity": "sha512-sRVD3lWVIXWg6By68ZN7vho9a1pQcN/WBFaAAsDDFzlJjvoGx0P8z7V1t72grFJfJhu3YPZBuu25f7Kaw2jN1w==",
+			"dev": true,
+			"license": "ISC",
+			"dependencies": {
+				"reusify": "^1.0.4"
+			}
+		},
+		"node_modules/fill-range": {
+			"version": "7.1.1",
+			"resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.1.1.tgz",
+			"integrity": "sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"to-regex-range": "^5.0.1"
+			},
+			"engines": {
+				"node": ">=8"
+			}
+		},
 		"node_modules/find-root": {
 			"version": "1.1.0",
 			"resolved": "https://registry.npmjs.org/find-root/-/find-root-1.1.0.tgz",
@@ -2035,6 +2408,23 @@
 				}
 			}
 		},
+		"node_modules/foreground-child": {
+			"version": "3.3.0",
+			"resolved": "https://registry.npmjs.org/foreground-child/-/foreground-child-3.3.0.tgz",
+			"integrity": "sha512-Ld2g8rrAyMYFXBhEqMz8ZAHBi4J4uS1i/CxGMDnjyFWddMXLVcDp051DZfu+t7+ab7Wv6SMqpWmyFIj5UbfFvg==",
+			"dev": true,
+			"license": "ISC",
+			"dependencies": {
+				"cross-spawn": "^7.0.0",
+				"signal-exit": "^4.0.1"
+			},
+			"engines": {
+				"node": ">=14"
+			},
+			"funding": {
+				"url": "https://github.com/sponsors/isaacs"
+			}
+		},
 		"node_modules/form-data": {
 			"version": "4.0.0",
 			"resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.0.tgz",
@@ -2049,6 +2439,20 @@
 				"node": ">= 6"
 			}
 		},
+		"node_modules/fraction.js": {
+			"version": "4.3.7",
+			"resolved": "https://registry.npmjs.org/fraction.js/-/fraction.js-4.3.7.tgz",
+			"integrity": "sha512-ZsDfxO51wGAXREY55a7la9LScWpwv9RxIrYABrlvOFBlH/ShPnrtsXeuUIfXKKOVicNxQ+o8JTbJvjS4M89yew==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": "*"
+			},
+			"funding": {
+				"type": "patreon",
+				"url": "https://github.com/sponsors/rawify"
+			}
+		},
 		"node_modules/framer-motion": {
 			"version": "11.9.0",
 			"resolved": "https://registry.npmjs.org/framer-motion/-/framer-motion-11.9.0.tgz",
@@ -2090,10 +2494,13 @@
 			}
 		},
 		"node_modules/function-bind": {
-			"version": "1.1.1",
-			"resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz",
-			"integrity": "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A==",
-			"license": "MIT"
+			"version": "1.1.2",
+			"resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz",
+			"integrity": "sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==",
+			"license": "MIT",
+			"funding": {
+				"url": "https://github.com/sponsors/ljharb"
+			}
 		},
 		"node_modules/gensync": {
 			"version": "1.0.0-beta.2",
@@ -2105,6 +2512,40 @@
 				"node": ">=6.9.0"
 			}
 		},
+		"node_modules/glob": {
+			"version": "10.4.5",
+			"resolved": "https://registry.npmjs.org/glob/-/glob-10.4.5.tgz",
+			"integrity": "sha512-7Bv8RF0k6xjo7d4A/PxYLbUCfb6c+Vpd2/mB2yRDlew7Jb5hEXiCD9ibfO7wpk8i4sevK6DFny9h7EYbM3/sHg==",
+			"dev": true,
+			"license": "ISC",
+			"dependencies": {
+				"foreground-child": "^3.1.0",
+				"jackspeak": "^3.1.2",
+				"minimatch": "^9.0.4",
+				"minipass": "^7.1.2",
+				"package-json-from-dist": "^1.0.0",
+				"path-scurry": "^1.11.1"
+			},
+			"bin": {
+				"glob": "dist/esm/bin.mjs"
+			},
+			"funding": {
+				"url": "https://github.com/sponsors/isaacs"
+			}
+		},
+		"node_modules/glob-parent": {
+			"version": "6.0.2",
+			"resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-6.0.2.tgz",
+			"integrity": "sha512-XxwI8EOhVQgWp6iDL+3b0r86f4d6AX6zSU55HfB4ydCEuXLXc5FcYeOu+nnGftS4TEju/11rt4KJPTMgbfmv4A==",
+			"dev": true,
+			"license": "ISC",
+			"dependencies": {
+				"is-glob": "^4.0.3"
+			},
+			"engines": {
+				"node": ">=10.13.0"
+			}
+		},
 		"node_modules/globals": {
 			"version": "11.12.0",
 			"resolved": "https://registry.npmjs.org/globals/-/globals-11.12.0.tgz",
@@ -2114,18 +2555,6 @@
 				"node": ">=4"
 			}
 		},
-		"node_modules/has": {
-			"version": "1.0.3",
-			"resolved": "https://registry.npmjs.org/has/-/has-1.0.3.tgz",
-			"integrity": "sha512-f2dvO0VU6Oej7RkWJGrehjbzMAjFp5/VKPp5tTpWIV4JHHZK1/BxbFRtf/siA2SWTe09caDmVtYYzWEIbBS4zw==",
-			"license": "MIT",
-			"dependencies": {
-				"function-bind": "^1.1.1"
-			},
-			"engines": {
-				"node": ">= 0.4.0"
-			}
-		},
 		"node_modules/has-flag": {
 			"version": "3.0.0",
 			"resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
@@ -2135,10 +2564,22 @@
 				"node": ">=4"
 			}
 		},
-		"node_modules/hoist-non-react-statics": {
-			"version": "3.3.2",
-			"resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz",
-			"integrity": "sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==",
+		"node_modules/hasown": {
+			"version": "2.0.2",
+			"resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.2.tgz",
+			"integrity": "sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==",
+			"license": "MIT",
+			"dependencies": {
+				"function-bind": "^1.1.2"
+			},
+			"engines": {
+				"node": ">= 0.4"
+			}
+		},
+		"node_modules/hoist-non-react-statics": {
+			"version": "3.3.2",
+			"resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz",
+			"integrity": "sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==",
 			"license": "BSD-3-Clause",
 			"dependencies": {
 				"react-is": "^16.7.0"
@@ -2194,18 +2635,110 @@
 			"integrity": "sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg==",
 			"license": "MIT"
 		},
+		"node_modules/is-binary-path": {
+			"version": "2.1.0",
+			"resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz",
+			"integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"binary-extensions": "^2.0.0"
+			},
+			"engines": {
+				"node": ">=8"
+			}
+		},
 		"node_modules/is-core-module": {
-			"version": "2.11.0",
-			"resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.11.0.tgz",
-			"integrity": "sha512-RRjxlvLDkD1YJwDbroBHMb+cukurkDWNyHx7D3oNB5x9rb5ogcksMC5wHCadcXoo67gVr/+3GFySh3134zi6rw==",
+			"version": "2.15.1",
+			"resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.15.1.tgz",
+			"integrity": "sha512-z0vtXSwucUJtANQWldhbtbt7BnL0vxiFjIdDLAatwhDYty2bad6s+rijD6Ri4YuYJubLzIJLUidCh09e1djEVQ==",
 			"license": "MIT",
 			"dependencies": {
-				"has": "^1.0.3"
+				"hasown": "^2.0.2"
+			},
+			"engines": {
+				"node": ">= 0.4"
 			},
 			"funding": {
 				"url": "https://github.com/sponsors/ljharb"
 			}
 		},
+		"node_modules/is-extglob": {
+			"version": "2.1.1",
+			"resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
+			"integrity": "sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": ">=0.10.0"
+			}
+		},
+		"node_modules/is-fullwidth-code-point": {
+			"version": "3.0.0",
+			"resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
+			"integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": ">=8"
+			}
+		},
+		"node_modules/is-glob": {
+			"version": "4.0.3",
+			"resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz",
+			"integrity": "sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"is-extglob": "^2.1.1"
+			},
+			"engines": {
+				"node": ">=0.10.0"
+			}
+		},
+		"node_modules/is-number": {
+			"version": "7.0.0",
+			"resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz",
+			"integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": ">=0.12.0"
+			}
+		},
+		"node_modules/isexe": {
+			"version": "2.0.0",
+			"resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
+			"integrity": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==",
+			"dev": true,
+			"license": "ISC"
+		},
+		"node_modules/jackspeak": {
+			"version": "3.4.3",
+			"resolved": "https://registry.npmjs.org/jackspeak/-/jackspeak-3.4.3.tgz",
+			"integrity": "sha512-OGlZQpz2yfahA/Rd1Y8Cd9SIEsqvXkLVoSw/cgwhnhFMDbsQFeZYoJJ7bIZBS9BcamUW96asq/npPWugM+RQBw==",
+			"dev": true,
+			"license": "BlueOak-1.0.0",
+			"dependencies": {
+				"@isaacs/cliui": "^8.0.2"
+			},
+			"funding": {
+				"url": "https://github.com/sponsors/isaacs"
+			},
+			"optionalDependencies": {
+				"@pkgjs/parseargs": "^0.11.0"
+			}
+		},
+		"node_modules/jiti": {
+			"version": "1.21.6",
+			"resolved": "https://registry.npmjs.org/jiti/-/jiti-1.21.6.tgz",
+			"integrity": "sha512-2yTgeWTWzMWkHu6Jp9NKgePDaYHbntiwvYuuJLbbN9vl7DC9DvXKOB2BC3ZZ92D3cvV/aflH0osDfwpHepQ53w==",
+			"dev": true,
+			"license": "MIT",
+			"bin": {
+				"jiti": "bin/jiti.js"
+			}
+		},
 		"node_modules/js-tokens": {
 			"version": "4.0.0",
 			"resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
@@ -2243,6 +2776,16 @@
 				"node": ">=6"
 			}
 		},
+		"node_modules/lilconfig": {
+			"version": "2.1.0",
+			"resolved": "https://registry.npmjs.org/lilconfig/-/lilconfig-2.1.0.tgz",
+			"integrity": "sha512-utWOt/GHzuUxnLKxB6dk81RoOeoNeHgbrXiuGk4yyF5qlRz+iIVWu56E2fqGHFrXz0QNUhLB/8nKqvRH66JKGQ==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": ">=10"
+			}
+		},
 		"node_modules/lines-and-columns": {
 			"version": "1.2.4",
 			"resolved": "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-1.2.4.tgz",
@@ -2271,6 +2814,30 @@
 				"yallist": "^3.0.2"
 			}
 		},
+		"node_modules/merge2": {
+			"version": "1.4.1",
+			"resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz",
+			"integrity": "sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": ">= 8"
+			}
+		},
+		"node_modules/micromatch": {
+			"version": "4.0.8",
+			"resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.8.tgz",
+			"integrity": "sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"braces": "^3.0.3",
+				"picomatch": "^2.3.1"
+			},
+			"engines": {
+				"node": ">=8.6"
+			}
+		},
 		"node_modules/mime-db": {
 			"version": "1.52.0",
 			"resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz",
@@ -2292,12 +2859,50 @@
 				"node": ">= 0.6"
 			}
 		},
+		"node_modules/minimatch": {
+			"version": "9.0.5",
+			"resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz",
+			"integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==",
+			"dev": true,
+			"license": "ISC",
+			"dependencies": {
+				"brace-expansion": "^2.0.1"
+			},
+			"engines": {
+				"node": ">=16 || 14 >=14.17"
+			},
+			"funding": {
+				"url": "https://github.com/sponsors/isaacs"
+			}
+		},
+		"node_modules/minipass": {
+			"version": "7.1.2",
+			"resolved": "https://registry.npmjs.org/minipass/-/minipass-7.1.2.tgz",
+			"integrity": "sha512-qOOzS1cBTWYF4BH8fVePDBOO9iptMnGUEZwNc/cMWnTV2nVLZ7VoNWEPHkYczZA0pdoA7dl6e7FL659nX9S2aw==",
+			"dev": true,
+			"license": "ISC",
+			"engines": {
+				"node": ">=16 || 14 >=14.17"
+			}
+		},
 		"node_modules/ms": {
 			"version": "2.1.3",
 			"resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz",
 			"integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==",
 			"license": "MIT"
 		},
+		"node_modules/mz": {
+			"version": "2.7.0",
+			"resolved": "https://registry.npmjs.org/mz/-/mz-2.7.0.tgz",
+			"integrity": "sha512-z81GNO7nnYMEhrGh9LeymoE4+Yr0Wn5McHIZMK5cfQCl+NDX08sCZgUc9/6MHni9IWuFLm1Z3HTCXu2z9fN62Q==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"any-promise": "^1.0.0",
+				"object-assign": "^4.0.1",
+				"thenify-all": "^1.0.0"
+			}
+		},
 		"node_modules/nanoid": {
 			"version": "3.3.7",
 			"resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.7.tgz",
@@ -2324,6 +2929,26 @@
 			"dev": true,
 			"license": "MIT"
 		},
+		"node_modules/normalize-path": {
+			"version": "3.0.0",
+			"resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz",
+			"integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": ">=0.10.0"
+			}
+		},
+		"node_modules/normalize-range": {
+			"version": "0.1.2",
+			"resolved": "https://registry.npmjs.org/normalize-range/-/normalize-range-0.1.2.tgz",
+			"integrity": "sha512-bdok/XvKII3nUpklnV6P2hxtMNrCboOjAcyBuQnWEhO665FwrSNRxU+AqpsyvO6LgGYPspN+lu5CLtw4jPRKNA==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": ">=0.10.0"
+			}
+		},
 		"node_modules/object-assign": {
 			"version": "4.1.1",
 			"resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
@@ -2333,6 +2958,23 @@
 				"node": ">=0.10.0"
 			}
 		},
+		"node_modules/object-hash": {
+			"version": "3.0.0",
+			"resolved": "https://registry.npmjs.org/object-hash/-/object-hash-3.0.0.tgz",
+			"integrity": "sha512-RSn9F68PjH9HqtltsSnqYC1XXoWe9Bju5+213R98cNGttag9q9yAOTzdbsqvIa7aNm5WffBZFpWYr2aWrklWAw==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": ">= 6"
+			}
+		},
+		"node_modules/package-json-from-dist": {
+			"version": "1.0.1",
+			"resolved": "https://registry.npmjs.org/package-json-from-dist/-/package-json-from-dist-1.0.1.tgz",
+			"integrity": "sha512-UEZIS3/by4OC8vL3P2dTXRETpebLI2NiI5vIrjaD/5UtrkFX/tNbwjTSRAGC/+7CAo2pIcBaRgWmcBBHcsaCIw==",
+			"dev": true,
+			"license": "BlueOak-1.0.0"
+		},
 		"node_modules/parent-module": {
 			"version": "1.0.1",
 			"resolved": "https://registry.npmjs.org/parent-module/-/parent-module-1.0.1.tgz",
@@ -2363,12 +3005,46 @@
 				"url": "https://github.com/sponsors/sindresorhus"
 			}
 		},
+		"node_modules/path-key": {
+			"version": "3.1.1",
+			"resolved": "https://registry.npmjs.org/path-key/-/path-key-3.1.1.tgz",
+			"integrity": "sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": ">=8"
+			}
+		},
 		"node_modules/path-parse": {
 			"version": "1.0.7",
 			"resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.7.tgz",
 			"integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==",
 			"license": "MIT"
 		},
+		"node_modules/path-scurry": {
+			"version": "1.11.1",
+			"resolved": "https://registry.npmjs.org/path-scurry/-/path-scurry-1.11.1.tgz",
+			"integrity": "sha512-Xa4Nw17FS9ApQFJ9umLiJS4orGjm7ZzwUrwamcGQuHSzDyth9boKDaycYdDcZDuqYATXw4HFXgaqWTctW/v1HA==",
+			"dev": true,
+			"license": "BlueOak-1.0.0",
+			"dependencies": {
+				"lru-cache": "^10.2.0",
+				"minipass": "^5.0.0 || ^6.0.2 || ^7.0.0"
+			},
+			"engines": {
+				"node": ">=16 || 14 >=14.18"
+			},
+			"funding": {
+				"url": "https://github.com/sponsors/isaacs"
+			}
+		},
+		"node_modules/path-scurry/node_modules/lru-cache": {
+			"version": "10.4.3",
+			"resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-10.4.3.tgz",
+			"integrity": "sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==",
+			"dev": true,
+			"license": "ISC"
+		},
 		"node_modules/path-type": {
 			"version": "4.0.0",
 			"resolved": "https://registry.npmjs.org/path-type/-/path-type-4.0.0.tgz",
@@ -2384,6 +3060,39 @@
 			"integrity": "sha512-TQ92mBOW0l3LeMeyLV6mzy/kWr8lkd/hp3mTg7wYK7zJhuBStmGMBG0BdeDZS/dZx1IukaX6Bk11zcln25o1Aw==",
 			"license": "ISC"
 		},
+		"node_modules/picomatch": {
+			"version": "2.3.1",
+			"resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz",
+			"integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": ">=8.6"
+			},
+			"funding": {
+				"url": "https://github.com/sponsors/jonschlinkert"
+			}
+		},
+		"node_modules/pify": {
+			"version": "2.3.0",
+			"resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
+			"integrity": "sha512-udgsAY+fTnvv7kI7aaxbqwWNb0AHiB0qBO89PZKPkoTmGOgdbrHDKD+0B2X4uTfJ/FT1R09r9gTsjUjNJotuog==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": ">=0.10.0"
+			}
+		},
+		"node_modules/pirates": {
+			"version": "4.0.6",
+			"resolved": "https://registry.npmjs.org/pirates/-/pirates-4.0.6.tgz",
+			"integrity": "sha512-saLsH7WeYYPiD25LDuLRRY/i+6HaPYr6G1OUlN39otzkSTxKnubR9RTxS3/Kk50s1g2JTgFwWQDQyplC5/SHZg==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": ">= 6"
+			}
+		},
 		"node_modules/postcss": {
 			"version": "8.4.47",
 			"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.47.tgz",
@@ -2413,6 +3122,153 @@
 				"node": "^10 || ^12 || >=14"
 			}
 		},
+		"node_modules/postcss-import": {
+			"version": "15.1.0",
+			"resolved": "https://registry.npmjs.org/postcss-import/-/postcss-import-15.1.0.tgz",
+			"integrity": "sha512-hpr+J05B2FVYUAXHeK1YyI267J/dDDhMU6B6civm8hSY1jYJnBXxzKDKDswzJmtLHryrjhnDjqqp/49t8FALew==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"postcss-value-parser": "^4.0.0",
+				"read-cache": "^1.0.0",
+				"resolve": "^1.1.7"
+			},
+			"engines": {
+				"node": ">=14.0.0"
+			},
+			"peerDependencies": {
+				"postcss": "^8.0.0"
+			}
+		},
+		"node_modules/postcss-js": {
+			"version": "4.0.1",
+			"resolved": "https://registry.npmjs.org/postcss-js/-/postcss-js-4.0.1.tgz",
+			"integrity": "sha512-dDLF8pEO191hJMtlHFPRa8xsizHaM82MLfNkUHdUtVEV3tgTp5oj+8qbEqYM57SLfc74KSbw//4SeJma2LRVIw==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"camelcase-css": "^2.0.1"
+			},
+			"engines": {
+				"node": "^12 || ^14 || >= 16"
+			},
+			"funding": {
+				"type": "opencollective",
+				"url": "https://opencollective.com/postcss/"
+			},
+			"peerDependencies": {
+				"postcss": "^8.4.21"
+			}
+		},
+		"node_modules/postcss-load-config": {
+			"version": "4.0.2",
+			"resolved": "https://registry.npmjs.org/postcss-load-config/-/postcss-load-config-4.0.2.tgz",
+			"integrity": "sha512-bSVhyJGL00wMVoPUzAVAnbEoWyqRxkjv64tUl427SKnPrENtq6hJwUojroMz2VB+Q1edmi4IfrAPpami5VVgMQ==",
+			"dev": true,
+			"funding": [
+				{
+					"type": "opencollective",
+					"url": "https://opencollective.com/postcss/"
+				},
+				{
+					"type": "github",
+					"url": "https://github.com/sponsors/ai"
+				}
+			],
+			"license": "MIT",
+			"dependencies": {
+				"lilconfig": "^3.0.0",
+				"yaml": "^2.3.4"
+			},
+			"engines": {
+				"node": ">= 14"
+			},
+			"peerDependencies": {
+				"postcss": ">=8.0.9",
+				"ts-node": ">=9.0.0"
+			},
+			"peerDependenciesMeta": {
+				"postcss": {
+					"optional": true
+				},
+				"ts-node": {
+					"optional": true
+				}
+			}
+		},
+		"node_modules/postcss-load-config/node_modules/lilconfig": {
+			"version": "3.1.2",
+			"resolved": "https://registry.npmjs.org/lilconfig/-/lilconfig-3.1.2.tgz",
+			"integrity": "sha512-eop+wDAvpItUys0FWkHIKeC9ybYrTGbU41U5K7+bttZZeohvnY7M9dZ5kB21GNWiFT2q1OoPTvncPCgSOVO5ow==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": ">=14"
+			},
+			"funding": {
+				"url": "https://github.com/sponsors/antonk52"
+			}
+		},
+		"node_modules/postcss-load-config/node_modules/yaml": {
+			"version": "2.5.1",
+			"resolved": "https://registry.npmjs.org/yaml/-/yaml-2.5.1.tgz",
+			"integrity": "sha512-bLQOjaX/ADgQ20isPJRvF0iRUHIxVhYvr53Of7wGcWlO2jvtUlH5m87DsmulFVxRpNLOnI4tB6p/oh8D7kpn9Q==",
+			"dev": true,
+			"license": "ISC",
+			"bin": {
+				"yaml": "bin.mjs"
+			},
+			"engines": {
+				"node": ">= 14"
+			}
+		},
+		"node_modules/postcss-nested": {
+			"version": "6.2.0",
+			"resolved": "https://registry.npmjs.org/postcss-nested/-/postcss-nested-6.2.0.tgz",
+			"integrity": "sha512-HQbt28KulC5AJzG+cZtj9kvKB93CFCdLvog1WFLf1D+xmMvPGlBstkpTEZfK5+AN9hfJocyBFCNiqyS48bpgzQ==",
+			"dev": true,
+			"funding": [
+				{
+					"type": "opencollective",
+					"url": "https://opencollective.com/postcss/"
+				},
+				{
+					"type": "github",
+					"url": "https://github.com/sponsors/ai"
+				}
+			],
+			"license": "MIT",
+			"dependencies": {
+				"postcss-selector-parser": "^6.1.1"
+			},
+			"engines": {
+				"node": ">=12.0"
+			},
+			"peerDependencies": {
+				"postcss": "^8.2.14"
+			}
+		},
+		"node_modules/postcss-selector-parser": {
+			"version": "6.1.2",
+			"resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.1.2.tgz",
+			"integrity": "sha512-Q8qQfPiZ+THO/3ZrOrO0cJJKfpYCagtMUkXbnEfmgUjwXg6z/WBeOyS9APBBPCTSiDV+s4SwQGu8yFsiMRIudg==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"cssesc": "^3.0.0",
+				"util-deprecate": "^1.0.2"
+			},
+			"engines": {
+				"node": ">=4"
+			}
+		},
+		"node_modules/postcss-value-parser": {
+			"version": "4.2.0",
+			"resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz",
+			"integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==",
+			"dev": true,
+			"license": "MIT"
+		},
 		"node_modules/prop-types": {
 			"version": "15.8.1",
 			"resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz",
@@ -2436,6 +3292,27 @@
 			"integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==",
 			"license": "MIT"
 		},
+		"node_modules/queue-microtask": {
+			"version": "1.2.3",
+			"resolved": "https://registry.npmjs.org/queue-microtask/-/queue-microtask-1.2.3.tgz",
+			"integrity": "sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==",
+			"dev": true,
+			"funding": [
+				{
+					"type": "github",
+					"url": "https://github.com/sponsors/feross"
+				},
+				{
+					"type": "patreon",
+					"url": "https://www.patreon.com/feross"
+				},
+				{
+					"type": "consulting",
+					"url": "https://feross.org/support"
+				}
+			],
+			"license": "MIT"
+		},
 		"node_modules/react": {
 			"version": "18.3.1",
 			"resolved": "https://registry.npmjs.org/react/-/react-18.3.1.tgz",
@@ -2461,6 +3338,15 @@
 				"react": "^18.3.1"
 			}
 		},
+		"node_modules/react-icons": {
+			"version": "5.3.0",
+			"resolved": "https://registry.npmjs.org/react-icons/-/react-icons-5.3.0.tgz",
+			"integrity": "sha512-DnUk8aFbTyQPSkCfF8dbX6kQjXA9DktMeJqfjrg6cK9vwQVMxmcA3BfP4QoiztVmEHtwlTgLFsPuH2NskKT6eg==",
+			"license": "MIT",
+			"peerDependencies": {
+				"react": "*"
+			}
+		},
 		"node_modules/react-intl": {
 			"version": "6.7.0",
 			"resolved": "https://registry.npmjs.org/react-intl/-/react-intl-6.7.0.tgz",
@@ -2575,6 +3461,29 @@
 				"react-dom": ">=16.6.0"
 			}
 		},
+		"node_modules/read-cache": {
+			"version": "1.0.0",
+			"resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz",
+			"integrity": "sha512-Owdv/Ft7IjOgm/i0xvNDZ1LrRANRfew4b2prF3OWMQLxLfu3bS8FVhCsrSCMK4lR56Y9ya+AThoTpDCTxCmpRA==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"pify": "^2.3.0"
+			}
+		},
+		"node_modules/readdirp": {
+			"version": "3.6.0",
+			"resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz",
+			"integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"picomatch": "^2.2.1"
+			},
+			"engines": {
+				"node": ">=8.10.0"
+			}
+		},
 		"node_modules/redux": {
 			"version": "5.0.1",
 			"resolved": "https://registry.npmjs.org/redux/-/redux-5.0.1.tgz",
@@ -2603,12 +3512,12 @@
 			"license": "MIT"
 		},
 		"node_modules/resolve": {
-			"version": "1.22.1",
-			"resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.1.tgz",
-			"integrity": "sha512-nBpuuYuY5jFsli/JIs1oldw6fOQCBioohqWZg/2hiaOybXOft4lonv85uDOKXdf8rhyK159cxU5cDcK/NKk8zw==",
+			"version": "1.22.8",
+			"resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.8.tgz",
+			"integrity": "sha512-oKWePCxqpd6FlLvGV1VU0x7bkPmmCNolxzjMf4NczoDnQcIWrAF+cPtZn5i6n+RfD2d9i0tzpKnG6Yk168yIyw==",
 			"license": "MIT",
 			"dependencies": {
-				"is-core-module": "^2.9.0",
+				"is-core-module": "^2.13.0",
 				"path-parse": "^1.0.7",
 				"supports-preserve-symlinks-flag": "^1.0.0"
 			},
@@ -2628,6 +3537,17 @@
 				"node": ">=4"
 			}
 		},
+		"node_modules/reusify": {
+			"version": "1.0.4",
+			"resolved": "https://registry.npmjs.org/reusify/-/reusify-1.0.4.tgz",
+			"integrity": "sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"iojs": ">=1.0.0",
+				"node": ">=0.10.0"
+			}
+		},
 		"node_modules/rollup": {
 			"version": "4.22.5",
 			"resolved": "https://registry.npmjs.org/rollup/-/rollup-4.22.5.tgz",
@@ -2664,6 +3584,30 @@
 				"fsevents": "~2.3.2"
 			}
 		},
+		"node_modules/run-parallel": {
+			"version": "1.2.0",
+			"resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.2.0.tgz",
+			"integrity": "sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA==",
+			"dev": true,
+			"funding": [
+				{
+					"type": "github",
+					"url": "https://github.com/sponsors/feross"
+				},
+				{
+					"type": "patreon",
+					"url": "https://www.patreon.com/feross"
+				},
+				{
+					"type": "consulting",
+					"url": "https://feross.org/support"
+				}
+			],
+			"license": "MIT",
+			"dependencies": {
+				"queue-microtask": "^1.2.2"
+			}
+		},
 		"node_modules/scheduler": {
 			"version": "0.23.2",
 			"resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.2.tgz",
@@ -2683,6 +3627,42 @@
 				"semver": "bin/semver.js"
 			}
 		},
+		"node_modules/shebang-command": {
+			"version": "2.0.0",
+			"resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz",
+			"integrity": "sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"shebang-regex": "^3.0.0"
+			},
+			"engines": {
+				"node": ">=8"
+			}
+		},
+		"node_modules/shebang-regex": {
+			"version": "3.0.0",
+			"resolved": "https://registry.npmjs.org/shebang-regex/-/shebang-regex-3.0.0.tgz",
+			"integrity": "sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": ">=8"
+			}
+		},
+		"node_modules/signal-exit": {
+			"version": "4.1.0",
+			"resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-4.1.0.tgz",
+			"integrity": "sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==",
+			"dev": true,
+			"license": "ISC",
+			"engines": {
+				"node": ">=14"
+			},
+			"funding": {
+				"url": "https://github.com/sponsors/isaacs"
+			}
+		},
 		"node_modules/source-map": {
 			"version": "0.5.7",
 			"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
@@ -2702,12 +3682,139 @@
 				"node": ">=0.10.0"
 			}
 		},
+		"node_modules/string-width": {
+			"version": "5.1.2",
+			"resolved": "https://registry.npmjs.org/string-width/-/string-width-5.1.2.tgz",
+			"integrity": "sha512-HnLOCR3vjcY8beoNLtcjZ5/nxn2afmME6lhrDrebokqMap+XbeW8n9TXpPDOqdGK5qcI3oT0GKTW6wC7EMiVqA==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"eastasianwidth": "^0.2.0",
+				"emoji-regex": "^9.2.2",
+				"strip-ansi": "^7.0.1"
+			},
+			"engines": {
+				"node": ">=12"
+			},
+			"funding": {
+				"url": "https://github.com/sponsors/sindresorhus"
+			}
+		},
+		"node_modules/string-width-cjs": {
+			"name": "string-width",
+			"version": "4.2.3",
+			"resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
+			"integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"emoji-regex": "^8.0.0",
+				"is-fullwidth-code-point": "^3.0.0",
+				"strip-ansi": "^6.0.1"
+			},
+			"engines": {
+				"node": ">=8"
+			}
+		},
+		"node_modules/string-width-cjs/node_modules/ansi-regex": {
+			"version": "5.0.1",
+			"resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
+			"integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": ">=8"
+			}
+		},
+		"node_modules/string-width-cjs/node_modules/emoji-regex": {
+			"version": "8.0.0",
+			"resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
+			"integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
+			"dev": true,
+			"license": "MIT"
+		},
+		"node_modules/string-width-cjs/node_modules/strip-ansi": {
+			"version": "6.0.1",
+			"resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
+			"integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"ansi-regex": "^5.0.1"
+			},
+			"engines": {
+				"node": ">=8"
+			}
+		},
+		"node_modules/strip-ansi": {
+			"version": "7.1.0",
+			"resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-7.1.0.tgz",
+			"integrity": "sha512-iq6eVVI64nQQTRYq2KtEg2d2uU7LElhTJwsH4YzIHZshxlgZms/wIc4VoDQTlG/IvVIrBKG06CrZnp0qv7hkcQ==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"ansi-regex": "^6.0.1"
+			},
+			"engines": {
+				"node": ">=12"
+			},
+			"funding": {
+				"url": "https://github.com/chalk/strip-ansi?sponsor=1"
+			}
+		},
+		"node_modules/strip-ansi-cjs": {
+			"name": "strip-ansi",
+			"version": "6.0.1",
+			"resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
+			"integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"ansi-regex": "^5.0.1"
+			},
+			"engines": {
+				"node": ">=8"
+			}
+		},
+		"node_modules/strip-ansi-cjs/node_modules/ansi-regex": {
+			"version": "5.0.1",
+			"resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
+			"integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": ">=8"
+			}
+		},
 		"node_modules/stylis": {
 			"version": "4.2.0",
 			"resolved": "https://registry.npmjs.org/stylis/-/stylis-4.2.0.tgz",
 			"integrity": "sha512-Orov6g6BB1sDfYgzWfTHDOxamtX1bE/zo104Dh9e6fqJ3PooipYyfJ0pUmrZO2wAvO8YbEyeFrkV91XTsGMSrw==",
 			"license": "MIT"
 		},
+		"node_modules/sucrase": {
+			"version": "3.35.0",
+			"resolved": "https://registry.npmjs.org/sucrase/-/sucrase-3.35.0.tgz",
+			"integrity": "sha512-8EbVDiu9iN/nESwxeSxDKe0dunta1GOlHufmSSXxMD2z2/tMZpDMpvXQGsc+ajGo8y2uYUmixaSRUc/QPoQ0GA==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"@jridgewell/gen-mapping": "^0.3.2",
+				"commander": "^4.0.0",
+				"glob": "^10.3.10",
+				"lines-and-columns": "^1.1.6",
+				"mz": "^2.7.0",
+				"pirates": "^4.0.1",
+				"ts-interface-checker": "^0.1.9"
+			},
+			"bin": {
+				"sucrase": "bin/sucrase",
+				"sucrase-node": "bin/sucrase-node"
+			},
+			"engines": {
+				"node": ">=16 || 14 >=14.17"
+			}
+		},
 		"node_modules/supports-color": {
 			"version": "5.5.0",
 			"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
@@ -2732,6 +3839,67 @@
 				"url": "https://github.com/sponsors/ljharb"
 			}
 		},
+		"node_modules/tailwindcss": {
+			"version": "3.4.13",
+			"resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.4.13.tgz",
+			"integrity": "sha512-KqjHOJKogOUt5Bs752ykCeiwvi0fKVkr5oqsFNt/8px/tA8scFPIlkygsf6jXrfCqGHz7VflA6+yytWuM+XhFw==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"@alloc/quick-lru": "^5.2.0",
+				"arg": "^5.0.2",
+				"chokidar": "^3.5.3",
+				"didyoumean": "^1.2.2",
+				"dlv": "^1.1.3",
+				"fast-glob": "^3.3.0",
+				"glob-parent": "^6.0.2",
+				"is-glob": "^4.0.3",
+				"jiti": "^1.21.0",
+				"lilconfig": "^2.1.0",
+				"micromatch": "^4.0.5",
+				"normalize-path": "^3.0.0",
+				"object-hash": "^3.0.0",
+				"picocolors": "^1.0.0",
+				"postcss": "^8.4.23",
+				"postcss-import": "^15.1.0",
+				"postcss-js": "^4.0.1",
+				"postcss-load-config": "^4.0.1",
+				"postcss-nested": "^6.0.1",
+				"postcss-selector-parser": "^6.0.11",
+				"resolve": "^1.22.2",
+				"sucrase": "^3.32.0"
+			},
+			"bin": {
+				"tailwind": "lib/cli.js",
+				"tailwindcss": "lib/cli.js"
+			},
+			"engines": {
+				"node": ">=14.0.0"
+			}
+		},
+		"node_modules/thenify": {
+			"version": "3.3.1",
+			"resolved": "https://registry.npmjs.org/thenify/-/thenify-3.3.1.tgz",
+			"integrity": "sha512-RVZSIV5IG10Hk3enotrhvz0T9em6cyHBLkH/YAZuKqd8hRkKhSfCGIcP2KUY0EPxndzANBmNllzWPwak+bheSw==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"any-promise": "^1.0.0"
+			}
+		},
+		"node_modules/thenify-all": {
+			"version": "1.6.0",
+			"resolved": "https://registry.npmjs.org/thenify-all/-/thenify-all-1.6.0.tgz",
+			"integrity": "sha512-RNxQH/qI8/t3thXJDwcstUO4zeqo64+Uy/+sNVRBx4Xn2OX+OZ9oP+iJnNFqplFra2ZUVeKCSa2oVWi3T4uVmA==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"thenify": ">= 3.1.0 < 4"
+			},
+			"engines": {
+				"node": ">=0.8"
+			}
+		},
 		"node_modules/to-fast-properties": {
 			"version": "2.0.0",
 			"resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-2.0.0.tgz",
@@ -2741,6 +3909,26 @@
 				"node": ">=4"
 			}
 		},
+		"node_modules/to-regex-range": {
+			"version": "5.0.1",
+			"resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
+			"integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"is-number": "^7.0.0"
+			},
+			"engines": {
+				"node": ">=8.0"
+			}
+		},
+		"node_modules/ts-interface-checker": {
+			"version": "0.1.13",
+			"resolved": "https://registry.npmjs.org/ts-interface-checker/-/ts-interface-checker-0.1.13.tgz",
+			"integrity": "sha512-Y/arvbn+rrz3JCKl9C4kVNfTfSm2/mEp5FSz5EsZSANGPSlQrpRI5M4PKF+mJnE52jOO90PnPSc3Ur3bTQw0gA==",
+			"dev": true,
+			"license": "Apache-2.0"
+		},
 		"node_modules/tslib": {
 			"version": "2.5.0",
 			"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz",
@@ -2801,6 +3989,13 @@
 				"react": "^16.8.0 || ^17.0.0 || ^18.0.0"
 			}
 		},
+		"node_modules/util-deprecate": {
+			"version": "1.0.2",
+			"resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
+			"integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==",
+			"dev": true,
+			"license": "MIT"
+		},
 		"node_modules/vite": {
 			"version": "5.4.8",
 			"resolved": "https://registry.npmjs.org/vite/-/vite-5.4.8.tgz",
@@ -2861,6 +4056,153 @@
 				}
 			}
 		},
+		"node_modules/which": {
+			"version": "2.0.2",
+			"resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz",
+			"integrity": "sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==",
+			"dev": true,
+			"license": "ISC",
+			"dependencies": {
+				"isexe": "^2.0.0"
+			},
+			"bin": {
+				"node-which": "bin/node-which"
+			},
+			"engines": {
+				"node": ">= 8"
+			}
+		},
+		"node_modules/wrap-ansi": {
+			"version": "8.1.0",
+			"resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-8.1.0.tgz",
+			"integrity": "sha512-si7QWI6zUMq56bESFvagtmzMdGOtoxfR+Sez11Mobfc7tm+VkUckk9bW2UeffTGVUbOksxmSw0AA2gs8g71NCQ==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"ansi-styles": "^6.1.0",
+				"string-width": "^5.0.1",
+				"strip-ansi": "^7.0.1"
+			},
+			"engines": {
+				"node": ">=12"
+			},
+			"funding": {
+				"url": "https://github.com/chalk/wrap-ansi?sponsor=1"
+			}
+		},
+		"node_modules/wrap-ansi-cjs": {
+			"name": "wrap-ansi",
+			"version": "7.0.0",
+			"resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
+			"integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"ansi-styles": "^4.0.0",
+				"string-width": "^4.1.0",
+				"strip-ansi": "^6.0.0"
+			},
+			"engines": {
+				"node": ">=10"
+			},
+			"funding": {
+				"url": "https://github.com/chalk/wrap-ansi?sponsor=1"
+			}
+		},
+		"node_modules/wrap-ansi-cjs/node_modules/ansi-regex": {
+			"version": "5.0.1",
+			"resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
+			"integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": ">=8"
+			}
+		},
+		"node_modules/wrap-ansi-cjs/node_modules/ansi-styles": {
+			"version": "4.3.0",
+			"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
+			"integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"color-convert": "^2.0.1"
+			},
+			"engines": {
+				"node": ">=8"
+			},
+			"funding": {
+				"url": "https://github.com/chalk/ansi-styles?sponsor=1"
+			}
+		},
+		"node_modules/wrap-ansi-cjs/node_modules/color-convert": {
+			"version": "2.0.1",
+			"resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
+			"integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"color-name": "~1.1.4"
+			},
+			"engines": {
+				"node": ">=7.0.0"
+			}
+		},
+		"node_modules/wrap-ansi-cjs/node_modules/color-name": {
+			"version": "1.1.4",
+			"resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
+			"integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
+			"dev": true,
+			"license": "MIT"
+		},
+		"node_modules/wrap-ansi-cjs/node_modules/emoji-regex": {
+			"version": "8.0.0",
+			"resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
+			"integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
+			"dev": true,
+			"license": "MIT"
+		},
+		"node_modules/wrap-ansi-cjs/node_modules/string-width": {
+			"version": "4.2.3",
+			"resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
+			"integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"emoji-regex": "^8.0.0",
+				"is-fullwidth-code-point": "^3.0.0",
+				"strip-ansi": "^6.0.1"
+			},
+			"engines": {
+				"node": ">=8"
+			}
+		},
+		"node_modules/wrap-ansi-cjs/node_modules/strip-ansi": {
+			"version": "6.0.1",
+			"resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
+			"integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"ansi-regex": "^5.0.1"
+			},
+			"engines": {
+				"node": ">=8"
+			}
+		},
+		"node_modules/wrap-ansi/node_modules/ansi-styles": {
+			"version": "6.2.1",
+			"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-6.2.1.tgz",
+			"integrity": "sha512-bN798gFfQX+viw3R7yrGWRqnrN2oRkEkUjjl4JNn4E8GxxbjtG3FbrEIIY3l8/hrwUwIeCZvi4QuOTP4MErVug==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": ">=12"
+			},
+			"funding": {
+				"url": "https://github.com/chalk/ansi-styles?sponsor=1"
+			}
+		},
 		"node_modules/yallist": {
 			"version": "3.1.1",
 			"resolved": "https://registry.npmjs.org/yallist/-/yallist-3.1.1.tgz",
diff --git a/frontend/package.json b/frontend/package.json
index c1bc9213..623181c8 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -18,6 +18,7 @@
 		"framer-motion": "^11.9.0",
 		"react": "^18.3.1",
 		"react-dom": "^18.3.1",
+		"react-icons": "^5.3.0",
 		"react-intl": "^6.7.0",
 		"react-redux": "^9.1.2",
 		"react-router-dom": "^6.26.2",
@@ -31,6 +32,9 @@
 		"@types/react-dom": "^18.3.0",
 		"@types/react-redux": "^7.1.34",
 		"@vitejs/plugin-react": "^4.3.2",
+		"autoprefixer": "^10.4.20",
+		"postcss": "^8.4.47",
+		"tailwindcss": "^3.4.13",
 		"typescript": "^5.6.2",
 		"vite": "^5.4.8"
 	}
diff --git a/frontend/postcss.config.js b/frontend/postcss.config.js
new file mode 100644
index 00000000..2e7af2b7
--- /dev/null
+++ b/frontend/postcss.config.js
@@ -0,0 +1,6 @@
+export default {
+  plugins: {
+    tailwindcss: {},
+    autoprefixer: {},
+  },
+}
diff --git a/frontend/src/styles/globals.css b/frontend/src/styles/globals.css
new file mode 100644
index 00000000..8719ab44
--- /dev/null
+++ b/frontend/src/styles/globals.css
@@ -0,0 +1,20 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+*{
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+    font-family: monospace;
+}
+.color-ece{
+    color: #F37172;
+}
+.actvg{
+background-color: #F37172;
+color: white;
+}
+.fg:hover{
+    color: #F37172;
+}
\ No newline at end of file
diff --git a/frontend/tailwind.config.js b/frontend/tailwind.config.js
new file mode 100644
index 00000000..89a305e0
--- /dev/null
+++ b/frontend/tailwind.config.js
@@ -0,0 +1,11 @@
+/** @type {import('tailwindcss').Config} */
+export default {
+  content: [
+    "./index.html",
+    "./src/**/*.{js,ts,jsx,tsx}",
+  ],
+  theme: {
+    extend: {},
+  },
+  plugins: [],
+}
\ No newline at end of file

From 64d6ae928674657d54fe44530a2298b73db552ce Mon Sep 17 00:00:00 2001
From: MOHAMMED-IQRAMUL <MOHDIQRAMUL2468@GMAIL.COM>
Date: Thu, 10 Oct 2024 20:21:47 +0530
Subject: [PATCH 2/9] Updating import for stylesheet

---
 frontend/src/main.tsx | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/frontend/src/main.tsx b/frontend/src/main.tsx
index bf085cba..23db346b 100644
--- a/frontend/src/main.tsx
+++ b/frontend/src/main.tsx
@@ -7,6 +7,8 @@ import App from './App';
 import { store, persister } from './store';
 import { ConfigProvider } from './contexts/ConfigContext';
 
+import './styles/globals.css';
+
 const container: any = document.getElementById('root');
 const root = createRoot(container);
 

From d7cc5b04ed9d95e8781e345a3d0bc9b237f8a905 Mon Sep 17 00:00:00 2001
From: MOHAMMED-IQRAMUL <MOHDIQRAMUL2468@GMAIL.COM>
Date: Thu, 10 Oct 2024 20:22:01 +0530
Subject: [PATCH 3/9] Updating route for dashboard

---
 frontend/src/routes/PublicRoutes.tsx | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/frontend/src/routes/PublicRoutes.tsx b/frontend/src/routes/PublicRoutes.tsx
index 2b566563..44bf9153 100644
--- a/frontend/src/routes/PublicRoutes.tsx
+++ b/frontend/src/routes/PublicRoutes.tsx
@@ -6,6 +6,7 @@ import MinimalLayout from '../layouts/MinimalLayout';
 import GuestGuard from '../utils/guards/GuestGuard';
 
 const Landing = Loadable(lazy(() => import('../pages/landng')));
+const Dashboard = Loadable(lazy(() => import('../pages/dashboard')));
 
 const PublicRoutes = {
 	path: '/',
@@ -21,6 +22,10 @@ const PublicRoutes = {
 			path: '/',
 			element: <Landing />,
 		},
+		{
+			path: '/Dashboard',
+			element: <Dashboard />
+		},
 	],
 };
 

From f854ed308610f3fd928281afda8a7db2755ec675 Mon Sep 17 00:00:00 2001
From: MOHAMMED-IQRAMUL <MOHDIQRAMUL2468@GMAIL.COM>
Date: Thu, 10 Oct 2024 20:22:12 +0530
Subject: [PATCH 4/9] Design of left component

---
 .../src/components/layouts/LeftComponent.tsx  | 140 ++++++++++++++++++
 1 file changed, 140 insertions(+)
 create mode 100644 frontend/src/components/layouts/LeftComponent.tsx

diff --git a/frontend/src/components/layouts/LeftComponent.tsx b/frontend/src/components/layouts/LeftComponent.tsx
new file mode 100644
index 00000000..fc7f747d
--- /dev/null
+++ b/frontend/src/components/layouts/LeftComponent.tsx
@@ -0,0 +1,140 @@
+import React from 'react'
+import { TbDeviceAnalytics } from "react-icons/tb";
+import { BsJournalBookmark } from "react-icons/bs";
+import { FaRegHeart } from "react-icons/fa6";
+import { MdNoteAlt } from "react-icons/md";
+import { PiMedal } from "react-icons/pi";
+import { GiMedallist } from "react-icons/gi";
+import { IoSettingsOutline } from "react-icons/io5";
+import { IoLogOutOutline } from "react-icons/io5";
+
+import { NavLink } from 'react-router-dom';
+
+const LeftComponent = (props: any) => {
+    const Navlinks = [
+        {
+            title: "Home",
+            link: "/dashboard",
+            icon: <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+                <path d="M7.24487 14.7815L10.238 10.8913L13.6522 13.5732L16.5813 9.79291" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
+                <circle cx="19.9954" cy="4.20023" r="1.9222" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
+                <path d="M14.9245 3.12014H7.65676C4.64532 3.12014 2.77805 5.25286 2.77805 8.2643V16.3467C2.77805 19.3581 4.60871 21.4817 7.65676 21.4817H16.2609C19.2723 21.4817 21.1396 19.3581 21.1396 16.3467V9.30778" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
+            </svg>
+
+
+        },
+        {
+            title: "My Courses",
+            link: "/courses",
+            icon: <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+                <path fill-rule="evenodd" clip-rule="evenodd" d="M16.8 5.76H11.04C10.7749 5.76 10.56 5.97491 10.56 6.24V10.08C10.56 10.3451 10.7749 10.56 11.04 10.56H16.8C17.0651 10.56 17.28 10.3451 17.28 10.08V6.24C17.28 5.97491 17.0651 5.76 16.8 5.76ZM16.32 9.6H11.52V6.72H16.32V9.6Z" fill="#A3A3A5" />
+                <path d="M11.52 9.6H11.27C11.27 9.73807 11.3819 9.85 11.52 9.85V9.6ZM16.32 9.6V9.85C16.4581 9.85 16.57 9.73807 16.57 9.6H16.32ZM11.52 6.72V6.47C11.3819 6.47 11.27 6.58193 11.27 6.72H11.52ZM16.32 6.72H16.57C16.57 6.58193 16.4581 6.47 16.32 6.47V6.72ZM11.04 6.01H16.8V5.51H11.04V6.01ZM10.81 6.24C10.81 6.11298 10.913 6.01 11.04 6.01V5.51C10.6368 5.51 10.31 5.83683 10.31 6.24H10.81ZM10.81 10.08V6.24H10.31V10.08H10.81ZM11.04 10.31C10.913 10.31 10.81 10.207 10.81 10.08H10.31C10.31 10.4832 10.6368 10.81 11.04 10.81V10.31ZM16.8 10.31H11.04V10.81H16.8V10.31ZM17.03 10.08C17.03 10.207 16.927 10.31 16.8 10.31V10.81C17.2032 10.81 17.53 10.4832 17.53 10.08H17.03ZM17.03 6.24V10.08H17.53V6.24H17.03ZM16.8 6.01C16.927 6.01 17.03 6.11298 17.03 6.24H17.53C17.53 5.83683 17.2032 5.51 16.8 5.51V6.01ZM11.52 9.85H16.32V9.35H11.52V9.85ZM11.27 6.72V9.6H11.77V6.72H11.27ZM16.32 6.47H11.52V6.97H16.32V6.47ZM16.57 9.6V6.72H16.07V9.6H16.57Z" fill="#A3A3A5" />
+                <path fill-rule="evenodd" clip-rule="evenodd" d="M18.72 1.92H5.28C4.48471 1.92 3.84 2.56471 3.84 3.36V18.72C3.84 20.5757 5.34432 22.08 7.2 22.08H16.8C18.6557 22.08 20.16 20.5757 20.16 18.72V3.36C20.16 2.56471 19.5153 1.92 18.72 1.92ZM7.68 2.88H5.28C5.0149 2.88 4.8 3.0949 4.8 3.36V18.72C4.8 20.0455 5.87451 21.12 7.2 21.12H7.68V2.88ZM8.64 2.88V21.12H16.8C18.1255 21.12 19.2 20.0455 19.2 18.72V3.36C19.2 3.0949 18.9851 2.88 18.72 2.88H8.64Z" fill="#A3A3A5" />
+                <path d="M7.68 2.88H7.93C7.93 2.74193 7.81807 2.63 7.68 2.63V2.88ZM7.68 21.12V21.37C7.81807 21.37 7.93 21.2581 7.93 21.12H7.68ZM8.64 21.12H8.39C8.39 21.2581 8.50193 21.37 8.64 21.37V21.12ZM8.64 2.88V2.63C8.50193 2.63 8.39 2.74193 8.39 2.88H8.64ZM5.28 2.17H18.72V1.67H5.28V2.17ZM4.09 3.36C4.09 2.70278 4.62278 2.17 5.28 2.17V1.67C4.34664 1.67 3.59 2.42664 3.59 3.36H4.09ZM4.09 18.72V3.36H3.59V18.72H4.09ZM7.2 21.83C5.48239 21.83 4.09 20.4376 4.09 18.72H3.59C3.59 20.7137 5.20625 22.33 7.2 22.33V21.83ZM16.8 21.83H7.2V22.33H16.8V21.83ZM19.91 18.72C19.91 20.4376 18.5176 21.83 16.8 21.83V22.33C18.7937 22.33 20.41 20.7137 20.41 18.72H19.91ZM19.91 3.36V18.72H20.41V3.36H19.91ZM18.72 2.17C19.3772 2.17 19.91 2.70278 19.91 3.36H20.41C20.41 2.42664 19.6534 1.67 18.72 1.67V2.17ZM5.28 3.13H7.68V2.63H5.28V3.13ZM5.05 3.36C5.05 3.23297 5.15297 3.13 5.28 3.13V2.63C4.87683 2.63 4.55 2.95683 4.55 3.36H5.05ZM5.05 18.72V3.36H4.55V18.72H5.05ZM7.2 20.87C6.01258 20.87 5.05 19.9074 5.05 18.72H4.55C4.55 20.1836 5.73644 21.37 7.2 21.37V20.87ZM7.68 20.87H7.2V21.37H7.68V20.87ZM7.43 2.88V21.12H7.93V2.88H7.43ZM8.89 21.12V2.88H8.39V21.12H8.89ZM16.8 20.87H8.64V21.37H16.8V20.87ZM18.95 18.72C18.95 19.9074 17.9874 20.87 16.8 20.87V21.37C18.2636 21.37 19.45 20.1836 19.45 18.72H18.95ZM18.95 3.36V18.72H19.45V3.36H18.95ZM18.72 3.13C18.847 3.13 18.95 3.23297 18.95 3.36H19.45C19.45 2.95683 19.1232 2.63 18.72 2.63V3.13ZM8.64 3.13H18.72V2.63H8.64V3.13Z" fill="#A3A3A5" />
+            </svg>
+
+
+        },
+        {
+            title: "Classroom",
+            link: "/classroom",
+            icon: <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+                <path d="M16.2381 1C14.2381 1 12.5238 2.04762 11.4762 3.57143C10.4286 2.04762 8.71429 1 6.71429 1C3.57143 1 1 3.57143 1 6.71429C1 12.4286 11.4762 21 11.4762 21C11.4762 21 21.9524 12.4286 21.9524 6.71429C21.9524 3.57143 19.381 1 16.2381 1Z" stroke="#A3A3A5" stroke-width="1.5" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round" />
+            </svg>
+
+        },
+        {
+            title: "Test",
+            link: "/test",
+            icon: <svg width="22" height="24" viewBox="0 0 22 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+                <path d="M6 12H16" stroke="#A3A3A5" stroke-width="1.5" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round" />
+                <path d="M6 17H16" stroke="#A3A3A5" stroke-width="1.5" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round" />
+                <path d="M19 3H21V23H1V3H3" stroke="#A3A3A5" stroke-width="1.5" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round" />
+                <path d="M6 1V7H9C9 5.895 9.895 5 11 5C12.105 5 13 5.895 13 7H16V1H6Z" stroke="#A3A3A5" stroke-width="1.5" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round" />
+            </svg>
+
+        },
+        {
+            title: "Test Result",
+            link: "/testresult",
+            icon: <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+                <path d="M17 12.899V22L12 19L7 22V12.898" stroke="#A3A3A5" stroke-width="1.5" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round" />
+                <path d="M12 15C15.866 15 19 11.866 19 8C19 4.13401 15.866 1 12 1C8.13401 1 5 4.13401 5 8C5 11.866 8.13401 15 12 15Z" stroke="#A3A3A5" stroke-width="1.5" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round" />
+            </svg>
+
+        },
+        {
+            title: "Standings",
+            link: "/standings",
+            icon: <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+                <path d="M12.4286 19.2857H3V3H18.4286V9" stroke="#A3A3A5" stroke-width="1.5" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round" />
+                <path d="M21 14.6786V21L18.4286 20.1428L15.8571 21V14.6786" stroke="#A3A3A5" stroke-width="1.5" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round" />
+                <path d="M18.4286 15.8571C20.3221 15.8571 21.8571 14.3221 21.8571 12.4286C21.8571 10.535 20.3221 9 18.4286 9C16.535 9 15 10.535 15 12.4286C15 14.3221 16.535 15.8571 18.4286 15.8571Z" stroke="#A3A3A5" stroke-width="1.5" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round" />
+                <path d="M6.42856 7.28571H14.1428" stroke="#A3A3A5" stroke-width="1.5" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round" />
+                <path d="M6.42856 10.7143H11.5714" stroke="#A3A3A5" stroke-width="1.5" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round" />
+                <path d="M6.42856 14.1429H11.5714" stroke="#A3A3A5" stroke-width="1.5" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round" />
+            </svg>
+
+        },
+        {
+            title: "Settings",
+            link: "/setting",
+            icon: <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+                <g opacity="0.4">
+                    <path fill-rule="evenodd" clip-rule="evenodd" d="M20.8066 7.62358L20.1842 6.54349C19.6576 5.62957 18.4907 5.31429 17.5755 5.83869V5.83869C17.1399 6.09531 16.6201 6.16812 16.1307 6.04106C15.6413 5.91399 15.2226 5.59749 14.9668 5.16134C14.8023 4.88412 14.7139 4.56836 14.7105 4.24601V4.24601C14.7254 3.72919 14.5304 3.22837 14.17 2.85764C13.8096 2.48691 13.3145 2.27783 12.7975 2.27805H11.5435C11.0369 2.27804 10.5513 2.47988 10.194 2.83891C9.83666 3.19795 9.63714 3.68456 9.63958 4.19109V4.19109C9.62457 5.23689 8.77245 6.07678 7.72654 6.07667C7.40418 6.07332 7.08843 5.98491 6.8112 5.82038V5.82038C5.89603 5.29598 4.72908 5.61126 4.20251 6.52519L3.53432 7.62358C3.00838 8.53636 3.31937 9.70258 4.22997 10.2323V10.2323C4.82187 10.574 5.1865 11.2056 5.1865 11.889C5.1865 12.5725 4.82187 13.204 4.22997 13.5458V13.5458C3.32053 14.0719 3.0092 15.2353 3.53432 16.1453V16.1453L4.16589 17.2346C4.41262 17.6798 4.82657 18.0083 5.31616 18.1474C5.80575 18.2866 6.33061 18.2249 6.77459 17.976V17.976C7.21105 17.7213 7.73116 17.6515 8.21931 17.7822C8.70746 17.9128 9.12321 18.233 9.37413 18.6716C9.53867 18.9489 9.62708 19.2646 9.63043 19.587V19.587C9.63043 20.6435 10.4869 21.5 11.5435 21.5H12.7975C13.8505 21.5 14.7055 20.6491 14.7105 19.5961V19.5961C14.7081 19.088 14.9088 18.6 15.2681 18.2407C15.6274 17.8814 16.1154 17.6806 16.6236 17.6831C16.9451 17.6917 17.2596 17.7797 17.5389 17.9394V17.9394C18.4517 18.4653 19.6179 18.1543 20.1476 17.2437V17.2437L20.8066 16.1453C21.0617 15.7075 21.1317 15.186 21.0012 14.6963C20.8706 14.2067 20.5502 13.7893 20.111 13.5366V13.5366C19.6717 13.2839 19.3514 12.8665 19.2208 12.3769C19.0902 11.8873 19.1602 11.3658 19.4153 10.9279C19.5812 10.6383 19.8213 10.3982 20.111 10.2323V10.2323C21.0161 9.70286 21.3264 8.54346 20.8066 7.63274V7.63274V7.62358Z" stroke="#1B1D21" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
+                    <circle cx="12.175" cy="11.889" r="2.63616" stroke="#1B1D21" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
+                </g>
+            </svg>
+
+        },
+
+    ]
+
+
+
+    return (
+        <div style={props.style} className='border-r-2 border-gray-300' >
+            <div className=" flex w-full text-center  justify-center items-baseline">
+                <h1 className=' text-5xl font-bold'>aether</h1>
+                <span className='color-ece text-5xl'>.</span>
+            </div>
+
+            <div className="pt-14 text-base flex flex-col gap-2  " >
+
+                {
+                    Navlinks.map((item, index) => {
+                        return (
+                            <NavLink
+                                key={index}
+                                to={item.link}
+                                className={({ isActive }) =>
+                                    ` fg flex font-semibold pl-5  justify-start items-center text-gray-500 gap-3 py-3 mr-10  ${isActive ? "actvg" : ""}`
+                                }
+                                style={{ borderTopRightRadius: '15px', borderBottomRightRadius: '15px' }}
+                            >
+                                <div className="icon ">{item.icon}</div>
+                                <div className="name">{item.title}</div>
+
+                            </NavLink>
+                        )
+                    })
+                }
+
+            </div>
+
+
+            <button className="fg pt-10 text-base flex font-semibold pl-5  justify-start items-center text-gray-500 gap-3 py-3 mr-10">
+                <div className="icon ">
+                    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+                        <path d="M14.1022 15.3125V16.875C14.1022 18.5982 12.7003 20 10.977 20H3.12514C1.40189 20 0 18.5982 0 16.875V3.125C0 1.40182 1.40189 0 3.12514 0H10.977C12.7003 0 14.1022 1.40182 14.1022 3.125V4.6875C14.1022 5.11902 13.7524 5.46875 13.3209 5.46875C12.8894 5.46875 12.5396 5.11902 12.5396 4.6875V3.125C12.5396 2.26349 11.8386 1.5625 10.977 1.5625H3.12514C2.26359 1.5625 1.56257 2.26349 1.56257 3.125V16.875C1.56257 17.7365 2.26359 18.4375 3.12514 18.4375H10.977C11.8386 18.4375 12.5396 17.7365 12.5396 16.875V15.3125C12.5396 14.881 12.8894 14.5312 13.3209 14.5312C13.7524 14.5312 14.1022 14.881 14.1022 15.3125ZM19.4288 8.65799L17.6793 6.90857C17.3741 6.60339 16.8794 6.60339 16.5744 6.90857C16.2692 7.21359 16.2692 7.70828 16.5744 8.01331L17.8188 9.25781H8.43787C8.00633 9.25781 7.65659 9.60754 7.65659 10.0391C7.65659 10.4706 8.00633 10.8203 8.43787 10.8203H17.8188L16.5744 12.0648C16.2692 12.3698 16.2692 12.8645 16.5744 13.1696C16.727 13.3221 16.9269 13.3984 17.1268 13.3984C17.3268 13.3984 17.5267 13.3221 17.6793 13.1696L19.4288 11.4201C20.1904 10.6586 20.1904 9.41956 19.4288 8.65799Z" fill="#808191" />
+                    </svg>
+
+                </div>
+                <div className="name">Logout</div>
+            </button>
+
+        </div>
+    )
+}
+
+export default LeftComponent

From 954143b670e3f8c2dff267b56740e64b6b0064dd Mon Sep 17 00:00:00 2001
From: MOHAMMED-IQRAMUL <MOHDIQRAMUL2468@GMAIL.COM>
Date: Thu, 10 Oct 2024 20:22:23 +0530
Subject: [PATCH 5/9] Design of course card

---
 frontend/src/components/CourseCard.tsx | 57 ++++++++++++++++++++++++++
 1 file changed, 57 insertions(+)
 create mode 100644 frontend/src/components/CourseCard.tsx

diff --git a/frontend/src/components/CourseCard.tsx b/frontend/src/components/CourseCard.tsx
new file mode 100644
index 00000000..15285cb8
--- /dev/null
+++ b/frontend/src/components/CourseCard.tsx
@@ -0,0 +1,57 @@
+import React from 'react';
+import { Box, Button, Typography, LinearProgress } from '@mui/material';
+
+interface CourseCardProps {
+  title: string;
+  instructor: string;
+  progress: number;
+  time: string;
+  onContinue: () => void;
+  onViewCourse: () => void;
+}
+
+const CourseCard: React.FC<CourseCardProps> = ({
+  title,
+  instructor,
+  progress,
+  time,
+  onContinue,
+  onViewCourse,
+}) => {
+  return (
+    <Box
+      className="flex justify-between items-center p-[16px] my-[16px] py-2 bg-gray-100 rounded-lg"
+    >
+
+      <div className="img bg-white w-[50px] h-[50px] flex justify-center items-center rounded-lg ">
+        <svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+          <path d="M3.1223 28.8079L0.0563112 11.4195C0.0267064 11.2517 0.00825172 11.0821 0.00106815 10.9118C-0.0444968 8.94041 1.37257 7.23751 3.32117 6.92201L9.23771 5.87904L9.0775 28.8079H3.1223Z" fill="#35495E" />
+          <path d="M25.8935 28.0464C25.7909 28.4718 25.4463 28.7966 25.0151 28.8741L7.60249 31.9423C6.50497 32.1337 5.37809 31.8437 4.50976 31.1464C3.64143 30.4491 3.11575 29.4121 3.06704 28.3002C3.02353 26.4154 4.32259 24.7638 6.16617 24.3601L11.0441 25.7286H11.0386L6.64679 26.5067C6.15697 26.5927 5.73156 26.8936 5.48759 27.3265C5.24362 27.7594 5.20679 28.2787 5.38725 28.7417C5.69971 29.4873 6.4933 29.9113 7.28761 29.7571L20.5957 27.4117L25.8935 28.0464Z" fill="#2C3E50" />
+          <path d="M11.0386 25.7286L6.64679 26.5067C6.15698 26.5927 5.73156 26.8936 5.48759 27.3265C5.24362 27.7594 5.20679 28.2787 5.38725 28.7417C5.69972 29.4873 6.4933 29.9113 7.28761 29.7571L20.5957 27.4117L11.0386 25.7286Z" fill="#F9EAB0" />
+          <path d="M7.04785 18.3015L10.1177 0.910838C10.2276 0.313061 10.7978 -0.0856757 11.3977 0.0157569L28.6761 3.05914C30.6261 3.37489 32.0442 5.07887 31.9989 7.05169C31.9914 7.22119 31.973 7.39004 31.9437 7.55717L28.8738 24.9478L7.04785 18.3015Z" fill="#E64C3C" />
+          <path d="M25.0638 5.77639C25.0314 5.77637 24.999 5.7736 24.9671 5.76811L12.454 3.56407C12.1716 3.4945 11.9916 3.21814 12.0423 2.93205C12.093 2.64597 12.3571 2.44817 12.6462 2.47971L25.1588 4.68099C25.441 4.73037 25.6386 4.98707 25.6138 5.27219C25.5891 5.55731 25.3503 5.77623 25.0638 5.77639Z" fill="#3F5C6C" />
+          <path d="M22.4077 8.10846C22.3752 8.10851 22.3429 8.10555 22.311 8.09963L14.1505 6.6643C13.8569 6.60482 13.6642 6.32241 13.7162 6.0277C13.7682 5.73298 14.0459 5.53337 14.3422 5.57773L22.5032 7.01251C22.7871 7.06042 22.9865 7.31805 22.9615 7.60452C22.9365 7.891 22.6955 8.11029 22.4077 8.10846Z" fill="#3F5C6C" />
+          <path d="M23.561 10.5732L12.134 8.55679C11.8335 8.50376 11.5468 8.70413 11.4937 9.00433L10.5325 14.4399C10.4794 14.7401 10.68 15.0265 10.9805 15.0795L22.4075 17.0959C22.7081 17.149 22.9947 16.9486 23.0478 16.6484L24.009 11.2128C24.0621 10.9126 23.8615 10.6262 23.561 10.5732Z" fill="#ECF0F1" />
+          <path d="M31.9978 7.04893C31.9912 7.21924 31.9728 7.38888 31.9426 7.55662L28.8711 24.945L24.6118 23.6482L27.0812 9.66464L27.6668 6.36465L28.2634 2.9874L28.6777 3.05914C30.6254 3.3762 32.0417 5.07813 31.9978 7.04893Z" fill="#C03A2B" />
+          <path d="M25.6062 20.4475L8.32621 17.4069C8.26235 17.3959 8.19766 17.3904 8.13286 17.3904C7.56028 17.3918 7.08369 17.83 7.03483 18.3999C6.98597 18.9697 7.38104 19.4825 7.94503 19.5812L25.3521 22.6439C25.8415 22.7324 26.2656 23.0349 26.5083 23.4685C26.751 23.9022 26.7869 24.4215 26.6061 24.8843C26.2954 25.6283 25.503 26.0506 24.7113 25.8942L7.3705 22.8425C7.30664 22.8315 7.24196 22.826 7.17715 22.826C6.60352 22.8246 6.12422 23.2619 6.07384 23.8327C6.02346 24.4035 6.41877 24.9179 6.9838 25.0168L24.3964 28.0795C25.4931 28.2715 26.6195 27.9825 27.4879 27.2863C28.3562 26.59 28.8823 25.554 28.9319 24.4429C28.9752 22.4692 27.5567 20.7651 25.6062 20.4475Z" fill="#802F34" />
+          <path d="M26.6061 24.8843C26.2953 25.6283 25.5029 26.0506 24.7113 25.8942L7.37048 22.8425L7.94501 19.5812L25.3521 22.6439C25.8415 22.7324 26.2656 23.0349 26.5083 23.4685C26.751 23.9022 26.7869 24.4215 26.6061 24.8843Z" fill="#F9EAB0" />
+        </svg>
+
+      </div>
+      <div>
+
+        <Typography variant="h6">{title}</Typography>
+        <Typography variant="body2" color="text.secondary">
+          by {instructor}
+        </Typography></div>
+
+      <Typography variant="body2" color="text.secondary">{time}</Typography>
+
+      <Button variant="contained" onClick={onViewCourse} color='inherit' style={{ backgroundColor: '#F37172', color: 'white' }}  className='rounded-lg '>
+        View Course
+      </Button>
+    </Box>
+  );
+};
+
+export default CourseCard;
\ No newline at end of file

From 0a92d60e14133734c2037dbb8755e69e88e7caf2 Mon Sep 17 00:00:00 2001
From: MOHAMMED-IQRAMUL <MOHDIQRAMUL2468@GMAIL.COM>
Date: Thu, 10 Oct 2024 20:22:34 +0530
Subject: [PATCH 6/9] Design of middle component

---
 .../components/layouts/MiddleComponent.tsx    | 197 ++++++++++++++++++
 1 file changed, 197 insertions(+)
 create mode 100644 frontend/src/components/layouts/MiddleComponent.tsx

diff --git a/frontend/src/components/layouts/MiddleComponent.tsx b/frontend/src/components/layouts/MiddleComponent.tsx
new file mode 100644
index 00000000..5fdb12a2
--- /dev/null
+++ b/frontend/src/components/layouts/MiddleComponent.tsx
@@ -0,0 +1,197 @@
+import { Box, Button, Typography } from '@mui/material';
+import React from 'react'
+import CourseCard from '../CourseCard';
+
+const MiddleComponent = (props) => {
+
+    const courses = [
+        {
+            title: 'Bioorganic Chemistry I',
+            instructor: 'Walter White',
+            progress: 83,
+            time: '01:30 PM',
+        },
+        {
+            title: 'Software Engineering',
+            instructor: 'Jesse Pinkman',
+            progress: 0,
+            time: '02:40 PM',
+        },
+        {
+            title: 'Discrete Mathematics',
+            instructor: 'Christopher Nolan',
+            progress: 0,
+            time: '09:40 AM',
+        },
+        {
+            title: 'Engineering Drawing',
+            instructor: 'Leonardo da Vinci',
+            progress: 0,
+            time: '01:00 PM',
+        },
+        {
+            title: 'Data Structures and Algorithm',
+            instructor: 'David Green',
+            progress: 0,
+            time: '04:20 PM',
+        },
+    ];
+
+    const handleContinue = (title: string) => {
+        console.log(`Continuing with ${title}`);
+    };
+
+    const handleViewCourse = (title: string) => {
+        console.log(`Viewing course: ${title}`);
+    };
+
+    return (
+        <div style={props.style}>
+
+            <div className='w-[90%]  max-h-[150px] overflow-visible mx-auto rounded-lg bg-gray-100'>
+                <div className="pl-[50px] overflow-visible mx-auto h-full flex  gap-[50px]   ">
+                    <div className="left self-center align-middle">
+                        <div className="u text-3xl font-semibold">Hello Harry!</div>
+                        <div className="b ">Its Good To See You Again</div>
+                    </div>
+                    <div className="right self-end">
+                        <svg className='relative top-[-41px]' width="175" height="191" viewBox="0 0 175 191" fill="none" xmlns="http://www.w3.org/2000/svg">
+                            <g clip-path="url(#clip0_2_369)">
+                                <path d="M93.6876 20.0594C99.796 36.3923 119.787 33.9344 133.352 30.4458C136.605 29.5737 139.937 28.6222 142.872 26.9572C145.807 25.2922 148.266 22.5965 149.218 19.3458C150.249 15.6986 149.059 11.655 146.997 8.4836C145.093 5.55002 142.316 2.45786 139.381 0.554999C138.112 3.80573 133.59 4.04358 130.496 4.04358C126.133 4.04358 122.167 2.37858 118.121 1.18929C113.996 -3.39746e-06 109.553 -0.237861 105.428 0.872143C97.0988 2.85429 90.4351 11.3379 93.6876 20.0594Z" fill="black" />
+                                <path d="M106.142 129.395C105.904 129.395 105.825 129.395 105.666 129.474L106.142 129.395Z" fill="black" />
+                                <path d="M106.142 129.395C105.904 129.395 105.825 129.395 105.666 129.474L106.142 129.395Z" fill="black" />
+                                <path d="M88.5312 49.8709V34.5687C88.5312 21.5658 100.669 10.9415 115.503 10.9415C122.881 10.9415 129.624 13.5579 134.542 17.8393C139.461 22.1208 142.475 27.988 142.475 34.4894V49.7916" stroke="black" stroke-width="2" stroke-miterlimit="10" />
+                                <path d="M142.475 66.4417V84.1225C142.475 97.1254 130.338 107.75 115.503 107.75C100.669 107.75 88.5312 97.1254 88.5312 84.1225V66.4417" stroke="black" stroke-width="2" stroke-miterlimit="10" />
+                                <path d="M99.4787 71.9124C107.058 71.9124 113.203 65.7713 113.203 58.1959C113.203 50.6205 107.058 44.4794 99.4787 44.4794C91.8992 44.4794 85.7548 50.6205 85.7548 58.1959C85.7548 65.7713 91.8992 71.9124 99.4787 71.9124Z" stroke="black" stroke-width="2" stroke-miterlimit="10" />
+                                <path d="M131.448 71.9124C139.028 71.9124 145.172 65.7713 145.172 58.1959C145.172 50.6205 139.028 44.4794 131.448 44.4794C123.869 44.4794 117.724 50.6205 117.724 58.1959C117.724 65.7713 123.869 71.9124 131.448 71.9124Z" stroke="black" stroke-width="2" stroke-miterlimit="10" />
+                                <path d="M113.123 57.7995H117.883" stroke="black" stroke-width="4" stroke-miterlimit="10" />
+                                <path d="M126.53 105.609H126.609V130.425" stroke="black" stroke-width="2" stroke-miterlimit="10" />
+                                <path d="M106.777 130.108V106.243" stroke="black" stroke-width="2" stroke-miterlimit="10" />
+                                <path d="M99.4787 61.3674C101.231 61.3674 102.652 59.9475 102.652 58.1959C102.652 56.4444 101.231 55.0245 99.4787 55.0245C97.7262 55.0245 96.3055 56.4444 96.3055 58.1959C96.3055 59.9475 97.7262 61.3674 99.4787 61.3674Z" fill="black" />
+                                <path d="M131.448 61.3674C133.201 61.3674 134.621 59.9475 134.621 58.1959C134.621 56.4444 133.201 55.0245 131.448 55.0245C129.696 55.0245 128.275 56.4444 128.275 58.1959C128.275 59.9475 129.696 61.3674 131.448 61.3674Z" fill="black" />
+                                <path d="M86.7067 63.3495H85.1201C83.3749 63.3495 81.7883 64.0631 80.5984 65.1731C79.4878 66.3624 78.7738 67.9481 78.7738 69.6924C78.7738 73.181 81.6297 76.0353 85.1201 76.0353H88.2933" stroke="black" stroke-width="2" stroke-miterlimit="10" />
+                                <path d="M144.22 63.3495H145.807C149.297 63.3495 152.153 66.2038 152.153 69.6924C152.153 71.4367 151.439 73.0224 150.249 74.2117C149.139 75.3217 147.552 76.0353 145.807 76.0353H142.634" stroke="black" stroke-width="2" stroke-miterlimit="10" />
+                                <path d="M88.3726 67.7895V71.5953H85.8341C84.8028 71.5953 83.9302 70.7231 83.9302 69.6924C83.9302 69.1374 84.1682 68.6617 84.4855 68.3445C84.8028 68.0274 85.2788 67.7895 85.8341 67.7895H88.3726Z" fill="black" />
+                                <path d="M142.634 71.5953V67.7895H145.172C146.203 67.7895 147.076 68.6617 147.076 69.6924C147.076 70.2474 146.838 70.7231 146.521 71.0403C146.203 71.3574 145.728 71.5953 145.172 71.5953H142.634Z" fill="black" />
+                                <path d="M115.503 71.2781C115.503 71.2781 111.537 77.621 117.883 76.0353" stroke="black" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round" />
+                                <path d="M108.364 89.5932C108.364 89.5932 114.71 97.4425 123.436 89.5932" stroke="black" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round" />
+                                <path d="M93.291 41.9423C93.291 41.9423 97.6541 37.5816 105.19 41.1494" stroke="black" stroke-width="3" stroke-miterlimit="10" stroke-linecap="round" />
+                                <path d="M137.715 41.9423C137.715 41.9423 133.352 37.5816 125.816 41.1494" stroke="black" stroke-width="3" stroke-miterlimit="10" stroke-linecap="round" />
+                                <path d="M88.3726 32.9037C88.3726 32.9037 77.4252 24.4201 82.1849 14.1129C86.9447 3.80572 102.017 9.35574 102.017 9.35574C102.017 9.35574 108.046 35.0444 88.3726 32.9037Z" fill="black" />
+                                <path d="M33.9529 96.2539C33.0009 93.1617 31.6523 91.6553 30.9384 87.136C29.4311 78.0974 29.9864 69.4552 26.258 69.7723C24.7507 69.9309 24.2747 71.5166 24.3541 72.3888L25.544 86.6602C25.068 88.3253 24.1954 87.691 24.1954 87.691C24.1954 87.691 21.1016 75.0052 20.7049 72.7059C20.3083 70.4859 19.1977 69.2173 17.6904 69.3759C15.0726 69.6137 16.1038 72.7852 16.3418 73.9745L19.1183 89.356C19.3563 90.8624 17.7697 90.3867 17.7697 90.3867L11.5821 75.0052C10.8681 73.3402 9.51952 73.7366 9.51952 73.7366C7.06032 74.2916 8.01227 76.5116 8.01227 76.5116L13.3273 92.8446C13.3273 92.9238 13.3273 93.0031 13.3273 93.0824C13.4066 93.9546 12.296 94.4303 11.8201 93.6374C10.1542 91.1003 6.90166 87.0567 4.20447 85.471C2.85588 84.6781 1.90393 84.8367 1.34862 85.2331C0.793319 85.6295 0.71399 86.3431 1.11064 86.8981L11.0268 101.249C13.3273 116.472 22.6088 118.295 22.6088 118.295L28.1619 140.02L36.3328 174.271L37.364 178.632C38.316 182.834 42.1238 185.847 46.4076 185.847H50.7707C53.8645 185.847 56.0064 182.834 55.0544 179.98L35.3015 119.881L34.4289 114.648C36.3328 112.507 37.602 107.988 38.2367 104.737C38.6333 102.993 38.792 101.17 38.6333 99.4253C38.316 95.0646 41.2512 87.2152 41.2512 87.2152C41.0132 85.7088 38.1573 86.9774 38.1573 86.9774C34.9842 88.0874 34.1909 93.1617 33.9529 95.9367C33.8736 97.126 33.3183 98.1567 32.525 98.9496C27.7652 103.627 27.3686 108.86 27.3686 108.86" stroke="black" stroke-width="2" stroke-miterlimit="10" />
+                                <path d="M20.6256 72.7846C20.2289 70.5646 19.515 68.8995 17.6111 69.4545C15.0726 70.1681 16.0245 72.8638 16.2625 74.0531" stroke="black" stroke-width="2" stroke-miterlimit="10" />
+                                <path d="M175 190.207V191H157.706L154.057 170.782V191H79.1704V179.504C79.1704 176.729 79.1704 173.954 79.2498 171.179C77.5839 172.526 75.7593 173.636 73.6174 174.826L57.0376 185.926C56.9583 186.005 56.879 186.005 56.7996 186.084C56.0857 186.481 55.2924 186.719 54.4198 186.719L50.9719 186.849C50.9719 186.849 54.6578 185.45 55.5304 181.961L49.5807 162.14C58.0689 155.083 71.7928 134.707 98.1301 130.505C99.2407 130.267 100.431 130.029 101.7 129.87C102.89 129.712 104.08 129.553 105.428 129.474L106.301 129.395V129.553L105.825 129.633C105.984 129.633 106.063 129.633 106.222 129.553H106.301C106.46 129.553 106.618 129.553 106.777 129.474H106.856L107.65 129.395V132.408C107.65 132.804 107.808 133.28 108.205 133.676C109.395 135.024 112.092 136.055 115.345 136.293C115.9 136.372 116.455 136.372 117.01 136.372C117.09 136.372 117.169 136.372 117.169 136.372H117.248C120.422 136.293 123.357 135.421 124.864 134.152C125.34 133.756 125.816 133.201 125.816 132.408V129.633L126.609 129.791H126.768C127.006 129.791 127.165 129.87 127.403 129.87V129.633L128.434 129.791C157.548 133.359 175 155.956 175 190.207Z" fill="#F37172" />
+                                <path d="M56.9583 185.846L56.7203 186.005C56.7997 186.005 56.879 185.926 56.9583 185.846Z" fill="black" />
+                            </g>
+                            <defs>
+                                <clipPath id="clip0_2_369">
+                                    <rect width="175" height="191" fill="white" />
+                                </clipPath>
+                            </defs>
+                        </svg>
+                    </div>
+                </div>
+            </div>
+
+            <div className="w-[90%] mx-auto flex justify-between items-center">
+                <div className="w-[70%] ">
+                    {[{
+                        title: 'Bioorganic Chemistry I',
+                        instructor: 'Walter White',
+                        progress: 83,
+                        time: '01:30 PM',
+                    }].map(({ title, instructor, time }, index) => (
+                        <Box
+                            className="flex justify-between items-center p-[16px] my-[16px] py-2 bg-gray-100 rounded-lg"
+                        >
+
+                            <div className="img bg-white w-[50px] h-[50px] flex justify-center items-center rounded-lg ">
+                                <svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+                                    <path d="M3.1223 28.8079L0.0563112 11.4195C0.0267064 11.2517 0.00825172 11.0821 0.00106815 10.9118C-0.0444968 8.94041 1.37257 7.23751 3.32117 6.92201L9.23771 5.87904L9.0775 28.8079H3.1223Z" fill="#35495E" />
+                                    <path d="M25.8935 28.0464C25.7909 28.4718 25.4463 28.7966 25.0151 28.8741L7.60249 31.9423C6.50497 32.1337 5.37809 31.8437 4.50976 31.1464C3.64143 30.4491 3.11575 29.4121 3.06704 28.3002C3.02353 26.4154 4.32259 24.7638 6.16617 24.3601L11.0441 25.7286H11.0386L6.64679 26.5067C6.15697 26.5927 5.73156 26.8936 5.48759 27.3265C5.24362 27.7594 5.20679 28.2787 5.38725 28.7417C5.69971 29.4873 6.4933 29.9113 7.28761 29.7571L20.5957 27.4117L25.8935 28.0464Z" fill="#2C3E50" />
+                                    <path d="M11.0386 25.7286L6.64679 26.5067C6.15698 26.5927 5.73156 26.8936 5.48759 27.3265C5.24362 27.7594 5.20679 28.2787 5.38725 28.7417C5.69972 29.4873 6.4933 29.9113 7.28761 29.7571L20.5957 27.4117L11.0386 25.7286Z" fill="#F9EAB0" />
+                                    <path d="M7.04785 18.3015L10.1177 0.910838C10.2276 0.313061 10.7978 -0.0856757 11.3977 0.0157569L28.6761 3.05914C30.6261 3.37489 32.0442 5.07887 31.9989 7.05169C31.9914 7.22119 31.973 7.39004 31.9437 7.55717L28.8738 24.9478L7.04785 18.3015Z" fill="#E64C3C" />
+                                    <path d="M25.0638 5.77639C25.0314 5.77637 24.999 5.7736 24.9671 5.76811L12.454 3.56407C12.1716 3.4945 11.9916 3.21814 12.0423 2.93205C12.093 2.64597 12.3571 2.44817 12.6462 2.47971L25.1588 4.68099C25.441 4.73037 25.6386 4.98707 25.6138 5.27219C25.5891 5.55731 25.3503 5.77623 25.0638 5.77639Z" fill="#3F5C6C" />
+                                    <path d="M22.4077 8.10846C22.3752 8.10851 22.3429 8.10555 22.311 8.09963L14.1505 6.6643C13.8569 6.60482 13.6642 6.32241 13.7162 6.0277C13.7682 5.73298 14.0459 5.53337 14.3422 5.57773L22.5032 7.01251C22.7871 7.06042 22.9865 7.31805 22.9615 7.60452C22.9365 7.891 22.6955 8.11029 22.4077 8.10846Z" fill="#3F5C6C" />
+                                    <path d="M23.561 10.5732L12.134 8.55679C11.8335 8.50376 11.5468 8.70413 11.4937 9.00433L10.5325 14.4399C10.4794 14.7401 10.68 15.0265 10.9805 15.0795L22.4075 17.0959C22.7081 17.149 22.9947 16.9486 23.0478 16.6484L24.009 11.2128C24.0621 10.9126 23.8615 10.6262 23.561 10.5732Z" fill="#ECF0F1" />
+                                    <path d="M31.9978 7.04893C31.9912 7.21924 31.9728 7.38888 31.9426 7.55662L28.8711 24.945L24.6118 23.6482L27.0812 9.66464L27.6668 6.36465L28.2634 2.9874L28.6777 3.05914C30.6254 3.3762 32.0417 5.07813 31.9978 7.04893Z" fill="#C03A2B" />
+                                    <path d="M25.6062 20.4475L8.32621 17.4069C8.26235 17.3959 8.19766 17.3904 8.13286 17.3904C7.56028 17.3918 7.08369 17.83 7.03483 18.3999C6.98597 18.9697 7.38104 19.4825 7.94503 19.5812L25.3521 22.6439C25.8415 22.7324 26.2656 23.0349 26.5083 23.4685C26.751 23.9022 26.7869 24.4215 26.6061 24.8843C26.2954 25.6283 25.503 26.0506 24.7113 25.8942L7.3705 22.8425C7.30664 22.8315 7.24196 22.826 7.17715 22.826C6.60352 22.8246 6.12422 23.2619 6.07384 23.8327C6.02346 24.4035 6.41877 24.9179 6.9838 25.0168L24.3964 28.0795C25.4931 28.2715 26.6195 27.9825 27.4879 27.2863C28.3562 26.59 28.8823 25.554 28.9319 24.4429C28.9752 22.4692 27.5567 20.7651 25.6062 20.4475Z" fill="#802F34" />
+                                    <path d="M26.6061 24.8843C26.2953 25.6283 25.5029 26.0506 24.7113 25.8942L7.37048 22.8425L7.94501 19.5812L25.3521 22.6439C25.8415 22.7324 26.2656 23.0349 26.5083 23.4685C26.751 23.9022 26.7869 24.4215 26.6061 24.8843Z" fill="#F9EAB0" />
+                                </svg>
+
+                            </div>
+
+
+
+                            <div>
+
+                                <Typography variant="h6">{title}</Typography>
+                                <Typography variant="body2" color="text.secondary">
+                                    by {instructor}
+                                </Typography></div>
+
+
+                            <svg width="41" height="41" viewBox="0 0 41 41" fill="none" xmlns="http://www.w3.org/2000/svg">
+
+                                <mask id="path-1-inside-1_2_351" fill="white">
+                                    <path d="M39.1012 20.1696C39.8546 20.1696 40.4702 20.7811 40.4188 21.5328C40.164 25.2642 38.8667 28.8595 36.6618 31.9031C34.1894 35.3159 30.7022 37.8605 26.6978 39.1737C22.6934 40.4869 18.3765 40.5017 14.3632 39.216C10.35 37.9302 6.84538 35.4096 4.34968 32.0138C1.85397 28.6181 0.494677 24.5207 0.465802 20.3066C0.436926 16.0925 1.73994 11.9769 4.18888 8.54732C6.63782 5.11769 10.1075 2.54927 14.1028 1.20862C17.6659 0.013001 21.4845 -0.151633 25.1219 0.719206C25.8546 0.89463 26.2544 1.66475 26.0295 2.3838C25.8045 3.10285 25.04 3.49777 24.3055 3.33025C21.2189 2.62634 17.9887 2.78256 14.9708 3.79524C11.5205 4.953 8.52414 7.17104 6.40928 10.1328C4.29442 13.0946 3.16916 16.6487 3.1941 20.2879C3.21904 23.9272 4.3929 27.4655 6.54814 30.398C8.70339 33.3305 11.7299 35.5073 15.1957 36.6177C18.6615 37.7281 22.3895 37.7153 25.8476 36.5812C29.3057 35.4471 32.3172 33.2496 34.4523 30.3024C36.3198 27.7246 37.4334 24.6883 37.6831 21.5324C37.7426 20.7813 38.3477 20.1696 39.1012 20.1696Z" />
+                                </mask>
+                                <svg width="24" height="10" viewBox="0 0 24 10" fill="none" xmlns="http://www.w3.org/2000/svg">
+                                    <path d="M6.33838 2.83951C6.33838 3.30077 6.21566 3.71125 5.97021 4.07095C5.729 4.43065 5.40104 4.71207 4.98633 4.91519C5.46875 5.12255 5.84961 5.42512 6.12891 5.82291C6.41243 6.22069 6.5542 6.67138 6.5542 7.17496C6.5542 7.97476 6.28337 8.61164 5.7417 9.0856C5.20426 9.55956 4.49544 9.79654 3.61523 9.79654C2.72656 9.79654 2.01351 9.55956 1.47607 9.0856C0.942871 8.60741 0.67627 7.97053 0.67627 7.17496C0.67627 6.67561 0.811686 6.22492 1.08252 5.82291C1.35758 5.42089 1.73633 5.1162 2.21875 4.90884C1.80827 4.70572 1.48454 4.42431 1.24756 4.06461C1.01058 3.70491 0.89209 3.29654 0.89209 2.83951C0.89209 2.06086 1.14176 1.44302 1.64111 0.985992C2.14046 0.528961 2.7985 0.300446 3.61523 0.300446C4.42773 0.300446 5.08366 0.528961 5.58301 0.985992C6.08659 1.44302 6.33838 2.06086 6.33838 2.83951ZM5.37988 7.14957C5.37988 6.63329 5.21484 6.21223 4.88477 5.88638C4.55892 5.56054 4.13151 5.39761 3.60254 5.39761C3.07357 5.39761 2.64827 5.55842 2.32666 5.88004C2.00928 6.20165 1.85059 6.62483 1.85059 7.14957C1.85059 7.67431 2.00505 8.0869 2.31396 8.38736C2.62712 8.68782 3.06087 8.83804 3.61523 8.83804C4.16536 8.83804 4.59701 8.68782 4.91016 8.38736C5.22331 8.08267 5.37988 7.67007 5.37988 7.14957ZM3.61523 1.26529C3.15397 1.26529 2.77946 1.40917 2.4917 1.69693C2.20817 1.98046 2.06641 2.36767 2.06641 2.85855C2.06641 3.32828 2.20605 3.70914 2.48535 4.00113C2.76888 4.28889 3.14551 4.43277 3.61523 4.43277C4.08496 4.43277 4.45947 4.28889 4.73877 4.00113C5.0223 3.70914 5.16406 3.32828 5.16406 2.85855C5.16406 2.38882 5.01807 2.00585 4.72607 1.70963C4.43408 1.4134 4.0638 1.26529 3.61523 1.26529ZM9.74072 4.4772H10.623C11.1774 4.46874 11.6133 4.32274 11.9307 4.03922C12.248 3.75569 12.4067 3.37271 12.4067 2.89029C12.4067 1.80696 11.8672 1.26529 10.7881 1.26529C10.2803 1.26529 9.87402 1.41129 9.56934 1.70328C9.26888 1.99104 9.11865 2.37401 9.11865 2.8522H7.94434C7.94434 2.12011 8.21094 1.51285 8.74414 1.03043C9.28158 0.543772 9.96289 0.300446 10.7881 0.300446C11.6598 0.300446 12.3433 0.531077 12.8384 0.99234C13.3335 1.4536 13.5811 2.09472 13.5811 2.91568C13.5811 3.3177 13.4499 3.70702 13.1875 4.08365C12.9294 4.46028 12.576 4.74169 12.1274 4.92789C12.6353 5.08869 13.0267 5.3553 13.3018 5.72769C13.5811 6.10009 13.7207 6.555 13.7207 7.09244C13.7207 7.92186 13.4499 8.57991 12.9082 9.06656C12.3665 9.55321 11.6619 9.79654 10.7944 9.79654C9.92692 9.79654 9.22021 9.56168 8.67432 9.09195C8.13265 8.62222 7.86182 8.00227 7.86182 7.23209H9.04248C9.04248 7.71874 9.20117 8.10806 9.51855 8.40005C9.83594 8.69205 10.2612 8.83804 10.7944 8.83804C11.3615 8.83804 11.7952 8.68993 12.0957 8.39371C12.3962 8.09748 12.5464 7.67219 12.5464 7.11783C12.5464 6.58039 12.3813 6.1678 12.0513 5.88004C11.7212 5.59227 11.2451 5.44416 10.623 5.4357H9.74072V4.4772ZM15.2314 2.20474C15.2314 1.65038 15.4071 1.19335 15.7583 0.833649C16.1138 0.473948 16.5687 0.294098 17.123 0.294098C17.6859 0.294098 18.1408 0.476064 18.4878 0.839996C18.839 1.1997 19.0146 1.66731 19.0146 2.24283V2.69351C19.0146 3.25211 18.8369 3.70914 18.4814 4.06461C18.1302 4.41584 17.6816 4.59146 17.1357 4.59146C16.5856 4.59146 16.1307 4.41584 15.771 4.06461C15.4113 3.70914 15.2314 3.23729 15.2314 2.64908V2.20474ZM16.1074 2.69351C16.1074 3.02359 16.2005 3.29654 16.3867 3.51236C16.5729 3.72395 16.8226 3.82974 17.1357 3.82974C17.4362 3.82974 17.6774 3.72606 17.8594 3.51871C18.0456 3.31135 18.1387 3.02782 18.1387 2.66812V2.20474C18.1387 1.87466 18.0477 1.60172 17.8657 1.38589C17.6838 1.17007 17.4362 1.06216 17.123 1.06216C16.8099 1.06216 16.5623 1.17007 16.3804 1.38589C16.1984 1.60172 16.1074 1.88313 16.1074 2.23013V2.69351ZM19.7319 7.40347C19.7319 6.84911 19.9076 6.3942 20.2588 6.03873C20.6143 5.67903 21.0692 5.49918 21.6235 5.49918C22.1779 5.49918 22.6328 5.67691 22.9883 6.03238C23.3438 6.38785 23.5215 6.85969 23.5215 7.44791V7.89859C23.5215 8.45295 23.3438 8.90998 22.9883 9.26968C22.637 9.62515 22.1864 9.80289 21.6362 9.80289C21.0861 9.80289 20.6312 9.62727 20.2715 9.27603C19.9118 8.92056 19.7319 8.44872 19.7319 7.8605V7.40347ZM20.6079 7.89859C20.6079 8.2329 20.701 8.50797 20.8872 8.72379C21.0734 8.93537 21.3231 9.04117 21.6362 9.04117C21.9409 9.04117 22.1842 8.93749 22.3662 8.73013C22.5482 8.51854 22.6392 8.2329 22.6392 7.8732V7.40347C22.6392 7.06916 22.5461 6.79621 22.3599 6.58463C22.1779 6.37304 21.9325 6.26724 21.6235 6.26724C21.3231 6.26724 21.0776 6.37304 20.8872 6.58463C20.701 6.79198 20.6079 7.07339 20.6079 7.42886V7.89859ZM17.4023 8.97134L16.7358 8.5524L21.249 1.32877L21.9155 1.74771L17.4023 8.97134Z" fill="black" />
+                                </svg>
+
+                                <path d="M39.1012 20.1696C39.8546 20.1696 40.4702 20.7811 40.4188 21.5328C40.164 25.2642 38.8667 28.8595 36.6618 31.9031C34.1894 35.3159 30.7022 37.8605 26.6978 39.1737C22.6934 40.4869 18.3765 40.5017 14.3632 39.216C10.35 37.9302 6.84538 35.4096 4.34968 32.0138C1.85397 28.6181 0.494677 24.5207 0.465802 20.3066C0.436926 16.0925 1.73994 11.9769 4.18888 8.54732C6.63782 5.11769 10.1075 2.54927 14.1028 1.20862C17.6659 0.013001 21.4845 -0.151633 25.1219 0.719206C25.8546 0.89463 26.2544 1.66475 26.0295 2.3838C25.8045 3.10285 25.04 3.49777 24.3055 3.33025C21.2189 2.62634 17.9887 2.78256 14.9708 3.79524C11.5205 4.953 8.52414 7.17104 6.40928 10.1328C4.29442 13.0946 3.16916 16.6487 3.1941 20.2879C3.21904 23.9272 4.3929 27.4655 6.54814 30.398C8.70339 33.3305 11.7299 35.5073 15.1957 36.6177C18.6615 37.7281 22.3895 37.7153 25.8476 36.5812C29.3057 35.4471 32.3172 33.2496 34.4523 30.3024C36.3198 27.7246 37.4334 24.6883 37.6831 21.5324C37.7426 20.7813 38.3477 20.1696 39.1012 20.1696Z" stroke="black" stroke-width="4" mask="url(#path-1-inside-1_2_351)" />
+
+
+
+                            </svg>
+
+
+                            <Button variant='contained' color='inherit' sx={{ backgroundColor: 'black', color: 'white', borderRadius: '0.5rem' }}  >Continue</Button>
+                        </Box>
+                    ))}
+                </div>
+
+                <div className="arr">
+                    <svg width="97" height="41" viewBox="0 0 97 41" fill="none" xmlns="http://www.w3.org/2000/svg">
+                        <rect x="58" y="39.1696" width="38" height="38" rx="19" transform="rotate(-90 58 39.1696)" stroke="black" stroke-width="2" />
+                        <path d="M82.3334 19.9427H83.5405L82.6869 19.0892L79.2765 15.6788L78.923 16.0324L79.2765 15.6788C79.188 15.5902 79.188 15.4467 79.2765 15.3582C79.3651 15.2697 79.5087 15.2697 79.5972 15.3582L84.2482 20.0091C84.3367 20.0977 84.3367 20.2412 84.2482 20.3298L84.6017 20.6833L84.2482 20.3298L79.5975 24.9806C79.5529 25.0251 79.4956 25.0471 79.437 25.0471C79.3783 25.0471 79.3211 25.0251 79.2767 24.9807C79.1881 24.8922 79.1881 24.7487 79.2767 24.6601L79.2767 24.6601L82.6869 21.2497L83.5405 20.3962H82.3334H69.9121C69.787 20.3962 69.6854 20.2946 69.6854 20.1695C69.6854 20.0443 69.787 19.9427 69.9121 19.9427H82.3334Z" fill="black" stroke="black" />
+                        <rect x="39.8994" y="1.16959" width="38" height="38" rx="19" transform="rotate(90 39.8994 1.16959)" stroke="black" stroke-width="2" />
+                        <path d="M15.566 20.3964L14.3589 20.3964L15.2125 21.25L18.6229 24.6604L18.9764 24.3068L18.6229 24.6604C18.7114 24.7489 18.7114 24.8925 18.6229 24.981C18.5344 25.0695 18.3907 25.0695 18.3022 24.981L13.6513 20.33C13.5627 20.2415 13.5627 20.098 13.6513 20.0094L13.2977 19.6558L13.6513 20.0094L18.302 15.3586C18.3465 15.3141 18.4038 15.292 18.4624 15.292C18.5211 15.292 18.5783 15.3141 18.6227 15.3584C18.7113 15.447 18.7113 15.5905 18.6228 15.6791L18.6227 15.6791L15.2125 19.0895L14.359 19.943L15.566 19.943L27.9873 19.943C28.1124 19.943 28.214 20.0446 28.214 20.1697C28.214 20.2949 28.1125 20.3964 27.9873 20.3964L15.566 20.3964Z" fill="black" stroke="black" />
+
+                    </svg>
+
+                </div>
+
+            </div>
+
+            <div className='w-[90%] mx-auto mt-10'  >
+
+                <Typography variant="h4" gutterBottom>
+                    Courses
+                </Typography>
+
+                <Typography variant="h5" gutterBottom>
+                    Ongoing
+                </Typography>
+
+                {courses.map((course, index) => (
+                    <CourseCard
+                        key={index}
+                        title={course.title}
+                        instructor={course.instructor}
+                        progress={course.progress}
+                        time={course.time}
+                        onContinue={() => handleContinue(course.title)}
+                        onViewCourse={() => handleViewCourse(course.title)}
+
+                    />
+                ))}
+
+
+            </div>
+        </div>
+    )
+}
+
+export default MiddleComponent

From d9aa88358c08b0f5a101da62afb1f554803e2a03 Mon Sep 17 00:00:00 2001
From: MOHAMMED-IQRAMUL <MOHDIQRAMUL2468@GMAIL.COM>
Date: Thu, 10 Oct 2024 20:22:49 +0530
Subject: [PATCH 7/9] Design Of Right Component

---
 .../src/components/layouts/RightComponent.tsx | 66 +++++++++++++++++++
 1 file changed, 66 insertions(+)
 create mode 100644 frontend/src/components/layouts/RightComponent.tsx

diff --git a/frontend/src/components/layouts/RightComponent.tsx b/frontend/src/components/layouts/RightComponent.tsx
new file mode 100644
index 00000000..c0ab1722
--- /dev/null
+++ b/frontend/src/components/layouts/RightComponent.tsx
@@ -0,0 +1,66 @@
+import React from 'react'
+
+const RightComponent = (props) => {
+    return (
+        <div style={props.style}>
+            <div className="w-[90%] mx-auto flex items-center justify-between" >
+
+                <div className='bg-gray-100 flex gap-2 py-4 px-2 rounded-lg'>
+                    <svg width="22" height="21" viewBox="0 0 22 21" fill="none" xmlns="http://www.w3.org/2000/svg">
+                        <path d="M14.2861 2.34031C11.1564 -0.789371 6.06262 -0.789371 2.93294 2.34031C-0.19607 5.47067 -0.19607 10.5638 2.93294 13.6941C5.72 16.4805 10.0607 16.7791 13.1884 14.6033C13.2542 14.9147 13.4048 15.2118 13.647 15.454L18.2048 20.0119C18.869 20.6747 19.9423 20.6747 20.6031 20.0119C21.2667 19.3483 21.2667 18.275 20.6031 17.6135L16.0453 13.0544C15.8045 12.8142 15.5066 12.6629 15.1952 12.5971C17.3724 9.46877 17.0738 5.12874 14.2861 2.34031ZM12.8471 12.2552C10.5105 14.5917 6.70782 14.5917 4.37192 12.2552C2.0367 9.91858 2.0367 6.11656 4.37192 3.77998C6.70782 1.44408 10.5105 1.44408 12.8471 3.77998C15.1837 6.11656 15.1837 9.91858 12.8471 12.2552Z" fill="black" />
+                    </svg>
+                    <input type="text" name="Search" id="Search" color='inherit' style={{
+                        backgroundColor: 'rgb(243 244 246)',
+                    }}
+
+                        placeholder='Search...'
+
+                    />
+                </div>
+
+                <svg width="25" height="27" viewBox="0 0 25 27" fill="none" xmlns="http://www.w3.org/2000/svg">
+                    <path d="M23.21 11.8968C22.7615 11.8968 22.3975 11.5328 22.3975 11.0843C22.3975 7.97294 21.1864 5.04905 18.9872 2.84879C18.6698 2.53141 18.6698 2.01685 18.9872 1.69947C19.3046 1.38209 19.8191 1.38209 20.1367 1.69947C22.6424 4.2062 24.0225 7.53971 24.0225 11.0843C24.0225 11.5328 23.6585 11.8968 23.21 11.8968Z" fill="black" />
+                    <path d="M1.00171 11.8968C0.553207 11.8968 0.189209 11.5328 0.189209 11.0843C0.189209 7.53971 1.56943 4.2062 4.07616 1.70046C4.39354 1.38308 4.90829 1.38308 5.22568 1.70046C5.54306 2.01785 5.54306 2.5326 5.22568 2.84998C3.02542 5.04905 1.81421 7.97294 1.81421 11.0843C1.81421 11.5328 1.45021 11.8968 1.00171 11.8968Z" fill="black" />
+                    <path d="M12.1058 26.251C9.86551 26.251 8.04333 24.4288 8.04333 22.1885C8.04333 21.74 8.40733 21.376 8.85583 21.376C9.30434 21.376 9.66833 21.74 9.66833 22.1885C9.66833 23.533 10.7613 24.626 12.1058 24.626C13.4501 24.626 14.5433 23.533 14.5433 22.1885C14.5433 21.74 14.9073 21.376 15.3558 21.376C15.8043 21.376 16.1683 21.74 16.1683 22.1885C16.1683 24.4288 14.3462 26.251 12.1058 26.251Z" fill="black" />
+                    <path d="M21.0433 23.001H3.1683C2.12273 23.001 1.27234 22.1506 1.27234 21.1052C1.27234 20.5504 1.51395 20.0252 1.93547 19.6643C3.58308 18.2722 4.52234 16.2487 4.52234 14.1048V11.0843C4.52234 6.90276 7.92409 3.50101 12.1058 3.50101C16.2873 3.50101 19.6891 6.90276 19.6891 11.0843V14.1048C19.6891 16.2487 20.6283 18.2722 22.2652 19.6568C22.6975 20.0252 22.9391 20.5504 22.9391 21.1052C22.9391 22.1506 22.0887 23.001 21.0433 23.001ZM12.1058 5.12601C8.8199 5.12601 6.14734 7.79858 6.14734 11.0843V14.1048C6.14734 16.7273 4.99802 19.2039 2.99493 20.8972C2.95705 20.9297 2.89734 20.9969 2.89734 21.1052C2.89734 21.2524 3.02092 21.376 3.1683 21.376H21.0433C21.1905 21.376 21.3141 21.2524 21.3141 21.1052C21.3141 20.9969 21.2546 20.9297 21.2187 20.8993C19.2134 19.2039 18.0641 16.7273 18.0641 14.1048V11.0843C18.0641 7.79858 15.3915 5.12601 12.1058 5.12601Z" fill="black" />
+                    <path d="M12.1058 5.12601C11.6573 5.12601 11.2933 4.76202 11.2933 4.31351V1.06351C11.2933 0.615013 11.6573 0.251015 12.1058 0.251015C12.5543 0.251015 12.9183 0.615013 12.9183 1.06351V4.31351C12.9183 4.76202 12.5543 5.12601 12.1058 5.12601Z" fill="black" />
+                </svg>
+
+            </div>
+
+            <div className="w-[90%] mt-7 mx-auto flex justify-between items-center ">
+
+                        <div className="p-2 px-4 bg-gray-100 rounded-lg flex justify-center items-center gap-3 ">
+                            <div style={{fontSize:'50px'}}>11</div>
+                            <div className=''>
+                                <div style={{fontSize:'20px', fontWeight:'lighter'}}>Courses</div>
+                                <div style={{fontSize:'20px', fontWeight:'lighter'}}>completed</div>
+                            </div>
+                        </div>
+
+                        <div className="p-2 px-4 bg-gray-100 rounded-lg flex justify-center items-center gap-3">
+                            <div className="color-ece" style={{fontSize:'50px'}}>4</div>
+                            <div>
+                                <div style={{fontSize:'20px', fontWeight:'lighter'}}>Curses</div>
+                                <div style={{fontSize:'20px', fontWeight:'lighter'}}>In Progress</div>
+                            </div>
+                        </div>
+            </div>
+
+            <div className="w-[90%] mx-auto mt-7">
+
+                        <h1 style={{fontSize:'25px'}}>Your Statistics</h1>
+
+            
+            
+            </div>
+
+            <div className="w-[90%] mx-auto">
+
+
+            </div>
+        </div>
+    )
+}
+
+export default RightComponent

From 8aebb5bc3416005f8abcd138aa2e78bdc1a12df6 Mon Sep 17 00:00:00 2001
From: MOHAMMED-IQRAMUL <MOHDIQRAMUL2468@GMAIL.COM>
Date: Thu, 10 Oct 2024 20:23:08 +0530
Subject: [PATCH 8/9] Designing our Dashboard and adding components

---
 frontend/src/pages/dashboard.tsx | 31 +++++++++++++++++++++++++++++++
 1 file changed, 31 insertions(+)
 create mode 100644 frontend/src/pages/dashboard.tsx

diff --git a/frontend/src/pages/dashboard.tsx b/frontend/src/pages/dashboard.tsx
new file mode 100644
index 00000000..7a5faa19
--- /dev/null
+++ b/frontend/src/pages/dashboard.tsx
@@ -0,0 +1,31 @@
+import React from 'react';
+import RightComponent from '../components/layouts/RightComponent';
+import LeftComponent from '../components/layouts/LeftComponent';
+import MiddleComponent from '../components/layouts/MiddleComponent';
+
+import '../styles/globals.css';
+
+interface ComponentProps {
+  style?: React.CSSProperties;
+}
+
+const Dashboard: React.FC = () => {
+	 
+
+  return (
+    <main
+      style={{
+        width: '100vw',
+        minHeight: '100vh',
+        display: 'flex',
+    
+      }}
+    >
+      <LeftComponent style={{  paddingTop:'35px', minWidth: '17%', minHeight: '100vh' }} />
+      <MiddleComponent style={{  paddingTop:'50px', minWidth: '50%', minHeight: '100vh'}} />
+      <RightComponent style={{  paddingTop:'50px', minWidth: '30%', minHeight: '100vh' }} />
+    </main>
+  );
+};
+
+export default Dashboard;

From 707e534de83bc17f821148e327ba19cf00e0d660 Mon Sep 17 00:00:00 2001
From: MOHAMMED-IQRAMUL <MOHDIQRAMUL2468@GMAIL.COM>
Date: Thu, 10 Oct 2024 20:53:33 +0530
Subject: [PATCH 9/9] Added TSX Interface and Clarity

---
 .../src/components/layouts/LeftComponent.tsx  | 32 +++++++++----------
 .../components/layouts/MiddleComponent.tsx    | 20 +++++++++---
 .../src/components/layouts/RightComponent.tsx | 11 ++++---
 frontend/src/pages/dashboard.tsx              |  4 +--
 4 files changed, 39 insertions(+), 28 deletions(-)

diff --git a/frontend/src/components/layouts/LeftComponent.tsx b/frontend/src/components/layouts/LeftComponent.tsx
index fc7f747d..6629342f 100644
--- a/frontend/src/components/layouts/LeftComponent.tsx
+++ b/frontend/src/components/layouts/LeftComponent.tsx
@@ -1,17 +1,17 @@
-import React from 'react'
-import { TbDeviceAnalytics } from "react-icons/tb";
-import { BsJournalBookmark } from "react-icons/bs";
-import { FaRegHeart } from "react-icons/fa6";
-import { MdNoteAlt } from "react-icons/md";
-import { PiMedal } from "react-icons/pi";
-import { GiMedallist } from "react-icons/gi";
-import { IoSettingsOutline } from "react-icons/io5";
-import { IoLogOutOutline } from "react-icons/io5";
-
 import { NavLink } from 'react-router-dom';
-
-const LeftComponent = (props: any) => {
-    const Navlinks = [
+interface NavLinkItem {
+    title: string;
+    link: string;
+    icon: React.ReactNode;
+  }
+
+interface LeftComponentProps {
+    style?: React.CSSProperties;
+}
+  
+  const LeftComponent:  React.FC<LeftComponentProps> = ({ style }) => {
+    const Navlinks: NavLinkItem[] = [
+      
         {
             title: "Home",
             link: "/dashboard",
@@ -87,13 +87,13 @@ const LeftComponent = (props: any) => {
             </svg>
 
         },
-
+    
     ]
 
 
 
     return (
-        <div style={props.style} className='border-r-2 border-gray-300' >
+        <div style={style} className='border-r-2 border-gray-300' >
             <div className=" flex w-full text-center  justify-center items-baseline">
                 <h1 className=' text-5xl font-bold'>aether</h1>
                 <span className='color-ece text-5xl'>.</span>
@@ -137,4 +137,4 @@ const LeftComponent = (props: any) => {
     )
 }
 
-export default LeftComponent
+export default LeftComponent;
\ No newline at end of file
diff --git a/frontend/src/components/layouts/MiddleComponent.tsx b/frontend/src/components/layouts/MiddleComponent.tsx
index 5fdb12a2..511a15f4 100644
--- a/frontend/src/components/layouts/MiddleComponent.tsx
+++ b/frontend/src/components/layouts/MiddleComponent.tsx
@@ -1,10 +1,20 @@
 import { Box, Button, Typography } from '@mui/material';
-import React from 'react'
 import CourseCard from '../CourseCard';
 
-const MiddleComponent = (props) => {
+interface CoursesItem {
+    title: string;
+    instructor: string;
+    progress: number;
+    time: string;
+}
+
+interface MiddleComponentProps {
+    style?: React.CSSProperties;
+}
+
+const MiddleComponent: React.FC<MiddleComponentProps> = ({ style }) => {
 
-    const courses = [
+    const courses: CoursesItem[] = [
         {
             title: 'Bioorganic Chemistry I',
             instructor: 'Walter White',
@@ -46,7 +56,7 @@ const MiddleComponent = (props) => {
     };
 
     return (
-        <div style={props.style}>
+        <div style={style}>
 
             <div className='w-[90%]  max-h-[150px] overflow-visible mx-auto rounded-lg bg-gray-100'>
                 <div className="pl-[50px] overflow-visible mx-auto h-full flex  gap-[50px]   ">
@@ -194,4 +204,4 @@ const MiddleComponent = (props) => {
     )
 }
 
-export default MiddleComponent
+export default MiddleComponent;
diff --git a/frontend/src/components/layouts/RightComponent.tsx b/frontend/src/components/layouts/RightComponent.tsx
index c0ab1722..d66e8f44 100644
--- a/frontend/src/components/layouts/RightComponent.tsx
+++ b/frontend/src/components/layouts/RightComponent.tsx
@@ -1,8 +1,11 @@
-import React from 'react'
-
-const RightComponent = (props) => {
+interface RightComponentProps {
+    style?: React.CSSProperties;
+}
+  
+  const RightComponent:  React.FC<RightComponentProps> = ({ style }) => {
+    
     return (
-        <div style={props.style}>
+        <div style={style}>
             <div className="w-[90%] mx-auto flex items-center justify-between" >
 
                 <div className='bg-gray-100 flex gap-2 py-4 px-2 rounded-lg'>
diff --git a/frontend/src/pages/dashboard.tsx b/frontend/src/pages/dashboard.tsx
index 7a5faa19..16d50c92 100644
--- a/frontend/src/pages/dashboard.tsx
+++ b/frontend/src/pages/dashboard.tsx
@@ -5,9 +5,7 @@ import MiddleComponent from '../components/layouts/MiddleComponent';
 
 import '../styles/globals.css';
 
-interface ComponentProps {
-  style?: React.CSSProperties;
-}
+
 
 const Dashboard: React.FC = () => {