diff --git a/public/css/styles.css b/public/css/styles.css
index 3532fa9..19f1d84 100644
--- a/public/css/styles.css
+++ b/public/css/styles.css
@@ -16,7 +16,7 @@ body.page-leaderboard {
   padding: 0 !important;
   /* Ensures padding is removed for .page-leaderboard for full width navbar */
 }
-*{
+* {
   /* border: 2px solid red; */
 }
 .alert {
@@ -70,7 +70,6 @@ body.page-leaderboard {
   /* Add a dark-grey background on hover */
 }
 
-
 .alert.show {
   opacity: 1;
   visibility: visible;
@@ -119,7 +118,7 @@ body {
   height: 5rem;
   z-index: 1000;
 }
- /* cursor */
+/* cursor */
 .circle {
   z-index: 10000;
   width: 20px;
@@ -142,16 +141,15 @@ body {
 }
 /* navigation bar font size transition styling*/
 
-
 /* navigation bar hover styling*/
 .links-hover:hover::after {
-  content: '';
+  content: "";
   display: block;
   margin-top: 0.3rem;
   width: 0;
   height: 0.2rem;
-  background:rgba(0, 131, 245, 0.769);
-  transition: width .3s;
+  background: rgba(0, 131, 245, 0.769);
+  transition: width 0.3s;
   position: relative;
   top: 0.7rem;
 }
@@ -159,29 +157,28 @@ body {
   width: 50%;
 }
 .links-hover:hover {
-  color:rgb(204, 22, 198) !important; 
-  text-shadow: .1em .1em 0 hsl(200 50% 30%) !important;
+  color: rgb(204, 22, 198) !important;
+  text-shadow: 0.1em 0.1em 0 hsl(200 50% 30%) !important;
   font-size: 17px;
   font-weight: bold;
   text-align: start;
-  
 }
-.links-hover-currentpage{
+.links-hover-currentpage {
   color: rgb(204, 22, 198) !important;
-  text-shadow: .1em .1em 0 hsl(200 50% 30%) !important;
+  text-shadow: 0.1em 0.1em 0 hsl(200 50% 30%) !important;
   font-size: 17px;
   font-weight: bold;
   text-align: start;
 }
-.links-hover-currentpage::after{
-  content: '';
+.links-hover-currentpage::after {
+  content: "";
   display: block;
   width: 50%;
   height: 0.2rem;
-  background:rgba(0, 131, 245, 0.769);
-  transition: width .3s;
+  background: rgba(0, 131, 245, 0.769);
+  transition: width 0.3s;
   position: relative;
-  top:0.7rem;
+  top: 0.7rem;
 }
 
 /* Navigation bar styling. */
@@ -484,26 +481,26 @@ body {
   display: none;
 }
 .social-links {
-  display: flex; 
-  gap: 15px; 
+  display: flex;
+  gap: 15px;
 }
 
 .social-icon {
   width: 40px;
   height: 40px;
-  background-size: contain; 
+  background-size: contain;
   background-repeat: no-repeat;
 }
 .footer-column {
-position: absolute; 
-bottom: 3rem; 
-right: 8rem; 
+  position: absolute;
+  bottom: 3rem;
+  right: 8rem;
 }
 .social-links a {
-margin-top: 1rem; 
+  margin-top: 1rem;
 }
 .gmail-icon {
-  position: relative; 
+  position: relative;
   top: -5px;
 }
 .youtube {
@@ -582,15 +579,18 @@ margin-top: 1rem;
 }
 
 .toggler:hover {
-  background: linear-gradient(135deg, rgb(64, 176, 228), rgb(87, 43, 190), rgb(223, 8, 212));
+  background: linear-gradient(
+    135deg,
+    rgb(64, 176, 228),
+    rgb(87, 43, 190),
+    rgb(223, 8, 212)
+  );
 }
 
 .social-icon:hover {
   transform: scale(1.4);
 }
 
-
-
 .social-icons.show-icons .social-icon:nth-child(2) {
   transition-delay: 0.1s;
 }
@@ -611,7 +611,6 @@ margin-top: 1rem;
   transition-delay: 0.5s;
 }
 
-
 /* Styling for rotate button. */
 #rotate {
   vertical-align: top;
@@ -803,13 +802,13 @@ h3 {
 }
 
 .border-hover::after {
-  content: '';
+  content: "";
   display: block;
   margin-top: 0.3rem;
   width: 0;
   height: 0.2rem;
-  background:rgba(0, 131, 245, 0.769);
-  transition: width .3s;
+  background: rgba(0, 131, 245, 0.769);
+  transition: width 0.3s;
   position: relative;
   top: 0.7rem;
 }
@@ -817,7 +816,6 @@ h3 {
   width: 15%;
 }
 
-
 /* Responsive styling. */
 @media screen and (max-width: 1160px) {
   .nav {
@@ -958,7 +956,6 @@ h3 {
 }
 
 @media screen and (min-width: 48rem) {
-
   h2,
   h3,
   .h6 {
@@ -1039,7 +1036,8 @@ h3 {
   cursor: pointer;
   position: absolute;
   transition: opacity 0.3s ease;
-  background: url(https://d125fmws0bore1.cloudfront.net/assets/svgs/icon_close_dark-c7c6a31cb37c841e14b44a8c1a7b5e81447b9442d94fdea8bcf66cfea18d1a13.svg) no-repeat center;
+  background: url(https://d125fmws0bore1.cloudfront.net/assets/svgs/icon_close_dark-c7c6a31cb37c841e14b44a8c1a7b5e81447b9442d94fdea8bcf66cfea18d1a13.svg)
+    no-repeat center;
 }
 
 .remodal-close:hover {
@@ -1062,6 +1060,13 @@ h3 {
   padding: 3em 1.5em 2em 1.5em;
 } */
 
+.avatar-img {
+  width: 42px; /* Adjust the size as needed */
+  height: 42px; /* Adjust the size as needed */
+  border-radius: 50%; /* Make the image round */
+  margin-right: 20px;
+}
+
 @media (min-width: 70em) {
   .page-leaderboard .leaderboard-progress .contain {
     padding: 6em 0 4.5em 0;
@@ -1213,7 +1218,6 @@ h3 {
   transition: background-color 1s, font-weight 1s, font-size 1s;
 }
 
-
 .ranking-table {
   width: 100%;
   border-collapse: collapse;
@@ -1262,8 +1266,6 @@ h3 {
   margin-right: 10px;
 }
 
-
-
 .page-leaderboard .ranking .ranking-table-row-leader-1:hover {
   background-color: gold;
   height: 6vw;
@@ -1289,7 +1291,6 @@ h3 {
 }
 
 @media (min-width: 33em) {
-
   .page-leaderboard .ranking .ranking-table-row-leader-1,
   .page-leaderboard .ranking .ranking-table-row-leader-2,
   .page-leaderboard .ranking .ranking-table-row-leader-3 {
@@ -1298,36 +1299,76 @@ h3 {
   }
 }
 
-.page-leaderboard .ranking .ranking-table-row-leader-1 .ranking-table-data-leader-1,
-.page-leaderboard .ranking .ranking-table-row-leader-2 .ranking-table-data-leader-2,
-.page-leaderboard .ranking .ranking-table-row-leader-3 .ranking-table-data-leader-3 {
+.page-leaderboard
+  .ranking
+  .ranking-table-row-leader-1
+  .ranking-table-data-leader-1,
+.page-leaderboard
+  .ranking
+  .ranking-table-row-leader-2
+  .ranking-table-data-leader-2,
+.page-leaderboard
+  .ranking
+  .ranking-table-row-leader-3
+  .ranking-table-data-leader-3 {
   display: flex;
   justify-content: end;
   width: 20%;
 }
 
 @media (min-width: 48em) {
-
-  .page-leaderboard .ranking .ranking-table-row-leader-1 .ranking-table-data-leader-1,
-  .page-leaderboard .ranking .ranking-table-row-leader-2 .ranking-table-data-leader-2,
-  .page-leaderboard .ranking .ranking-table-row-leader-3 .ranking-table-data-leader-3 {
+  .page-leaderboard
+    .ranking
+    .ranking-table-row-leader-1
+    .ranking-table-data-leader-1,
+  .page-leaderboard
+    .ranking
+    .ranking-table-row-leader-2
+    .ranking-table-data-leader-2,
+  .page-leaderboard
+    .ranking
+    .ranking-table-row-leader-3
+    .ranking-table-data-leader-3 {
     width: 15%;
   }
 }
 
-.page-leaderboard .ranking .ranking-table-row-leader-1 .ranking-table-data-leader-1 .medal-gold,
-.page-leaderboard .ranking .ranking-table-row-leader-2 .ranking-table-data-leader-2 .medal-silver,
-.page-leaderboard .ranking .ranking-table-row-leader-3 .ranking-table-data-leader-3 .medal-bronze {
+.page-leaderboard
+  .ranking
+  .ranking-table-row-leader-1
+  .ranking-table-data-leader-1
+  .medal-gold,
+.page-leaderboard
+  .ranking
+  .ranking-table-row-leader-2
+  .ranking-table-data-leader-2
+  .medal-silver,
+.page-leaderboard
+  .ranking
+  .ranking-table-row-leader-3
+  .ranking-table-data-leader-3
+  .medal-bronze {
   margin-top: -1.313em;
   height: 2.875em;
   width: 2.875em;
 }
 
 @media (min-width: 33em) {
-
-  .page-leaderboard .ranking .ranking-table-row-leader-1 .ranking-table-data-leader-1 .medal-gold,
-  .page-leaderboard .ranking .ranking-table-row-leader-2 .ranking-table-data-leader-2 .medal-silver,
-  .page-leaderboard .ranking .ranking-table-row-leader-3 .ranking-table-data-leader-3 .medal-bronze {
+  .page-leaderboard
+    .ranking
+    .ranking-table-row-leader-1
+    .ranking-table-data-leader-1
+    .medal-gold,
+  .page-leaderboard
+    .ranking
+    .ranking-table-row-leader-2
+    .ranking-table-data-leader-2
+    .medal-silver,
+  .page-leaderboard
+    .ranking
+    .ranking-table-row-leader-3
+    .ranking-table-data-leader-3
+    .medal-bronze {
     margin-top: -1.563em;
     height: 3.875em;
     width: 3.875em;
@@ -1338,8 +1379,13 @@ h3 {
   border: solid 0.125em #ecc81a;
 }
 
-.page-leaderboard .ranking .ranking-table-row-leader-1 .ranking-table-data-leader-1 .medal-gold {
-  background: url(https://d125fmws0bore1.cloudfront.net/assets/pages/leaderboard/medal-gold-c49052bfa07f36621f16dbe77f7fc36cbafd72ff088ea970256ff998be05687b.svg) no-repeat;
+.page-leaderboard
+  .ranking
+  .ranking-table-row-leader-1
+  .ranking-table-data-leader-1
+  .medal-gold {
+  background: url(https://d125fmws0bore1.cloudfront.net/assets/pages/leaderboard/medal-gold-c49052bfa07f36621f16dbe77f7fc36cbafd72ff088ea970256ff998be05687b.svg)
+    no-repeat;
   background-size: contain;
 }
 
@@ -1347,8 +1393,13 @@ h3 {
   border: solid 0.125em #dbe2e8;
 }
 
-.page-leaderboard .ranking .ranking-table-row-leader-2 .ranking-table-data-leader-2 .medal-silver {
-  background: url(https://d125fmws0bore1.cloudfront.net/assets/pages/leaderboard/medal-silver-d099c5dd916c167c3ba4716c8968a819f317daaef1901c8e8bae6c6932852faa.svg) no-repeat;
+.page-leaderboard
+  .ranking
+  .ranking-table-row-leader-2
+  .ranking-table-data-leader-2
+  .medal-silver {
+  background: url(https://d125fmws0bore1.cloudfront.net/assets/pages/leaderboard/medal-silver-d099c5dd916c167c3ba4716c8968a819f317daaef1901c8e8bae6c6932852faa.svg)
+    no-repeat;
   background-size: contain;
 }
 
@@ -1356,8 +1407,13 @@ h3 {
   border: solid 0.125em #dfdfd1;
 }
 
-.page-leaderboard .ranking .ranking-table-row-leader-3 .ranking-table-data-leader-3 .medal-bronze {
-  background: url(https://d125fmws0bore1.cloudfront.net/assets/pages/leaderboard/medal-bronze-d0f15d413800257442c8d4b2d5239cfe28c9fd9594f863ab1fad5258f8d1d5eb.svg) no-repeat;
+.page-leaderboard
+  .ranking
+  .ranking-table-row-leader-3
+  .ranking-table-data-leader-3
+  .medal-bronze {
+  background: url(https://d125fmws0bore1.cloudfront.net/assets/pages/leaderboard/medal-bronze-d0f15d413800257442c8d4b2d5239cfe28c9fd9594f863ab1fad5258f8d1d5eb.svg)
+    no-repeat;
   background-size: contain;
 }
 
@@ -1430,7 +1486,8 @@ h3 {
 .page-leaderboard .ranking .ranking-table-data:nth-child(3) .complete {
   margin: -1.25em auto;
   transform: translateY(18%);
-  background: url(https://github.com/GameSphere-MultiPlayer/GameSphere/assets/98798977/fe253e0d-b619-477e-a8de-b10b785f0bd1) no-repeat;
+  background: url(https://github.com/GameSphere-MultiPlayer/GameSphere/assets/98798977/fe253e0d-b619-477e-a8de-b10b785f0bd1)
+    no-repeat;
   background-size: contain;
   width: 3em;
   height: 3em;
@@ -1472,7 +1529,7 @@ h3 {
   transition: opacity 0.5s;
 }
 
-.active>.socials-menu {
+.active > .socials-menu {
   opacity: 1;
 }
 
@@ -1510,7 +1567,7 @@ h3 {
   height: 4rem;
   border-radius: 50%;
   outline: none;
-  transition: outline ;
+  transition: outline;
   transition-duration: 5s;
 }
 
@@ -1523,7 +1580,7 @@ h3 {
 .social li a {
   transition: font-size 0.3s;
 }
-.active .social:hover{
+.active .social:hover {
   outline: 2px solid white;
   outline-offset: 3px;
 }
@@ -1596,9 +1653,9 @@ h3 {
     position: absolute;
   }
 }
-.about-para{
+.about-para {
   font-size: 1rem;
-  margin:0 200px ;
+  margin: 0 200px;
 }
 @media (max-width: 480px) {
   .icons {
@@ -1610,7 +1667,7 @@ h3 {
   .logo_image {
     overflow: hidden;
   }
-  .logo_image{
+  .logo_image {
     margin-top: 1rem;
   }
   .logo_head1 {
@@ -1619,10 +1676,9 @@ h3 {
   .logo_head {
     font-size: 2rem !important;
   }
-  .complete{
+  .complete {
     position: relative;
     left: 2rem;
-
   }
 }
 
@@ -1667,13 +1723,13 @@ section.image {
     font-size: 50px;
     text-align: center;
   }
-  .about-para{
+  .about-para {
     margin: 1.5rem;
   }
-  .container1{
+  .container1 {
     padding: 1px !important;
   }
-  .line3{
+  .line3 {
     font-size: 15px;
   }
 }
@@ -1790,14 +1846,12 @@ section.image {
 }
 .image_part img:hover {
   transform: translateY(-10px);
-  border:5px double rgb(87, 43, 190);
+  border: 5px double rgb(87, 43, 190);
   padding: 20px;
   /* border-style: ; */
   border-radius: 30px;
 }
 
-
-
 .line_img {
   width: 100%;
   height: auto;
@@ -1807,7 +1861,7 @@ section.image {
   .image_part {
     display: none;
   }
-  .about-para{
+  .about-para {
     margin: 2rem;
   }
   .container1 {
@@ -1829,7 +1883,6 @@ section.image {
   .right {
     left: 8.7%;
   }
- 
 }
 
 @media screen and (max-width: 768px) {
@@ -1921,9 +1974,9 @@ section.image {
   top: 0;
   border-radius: 10px;
 }
-.button-85:hover{
+.button-85:hover {
   font-size: 14px;
-  box-shadow:0px 2px 10px 6px #999999;
+  box-shadow: 0px 2px 10px 6px #999999;
 }
 
 .rateus-modal {
@@ -1962,8 +2015,8 @@ section.image {
   border-radius: 10px;
   outline: none;
   opacity: 0.9;
-  -webkit-transition: opacity .15s ease-in-out;
-  transition: opacity .15s ease-in-out;
+  -webkit-transition: opacity 0.15s ease-in-out;
+  transition: opacity 0.15s ease-in-out;
 }
 
 .rating-slider input[type="range"]::-webkit-slider-thumb {
@@ -2056,7 +2109,6 @@ textarea {
   color: white; /* Text color */
 }
 
-
 .close {
   color: white;
   float: right;
diff --git a/public/js/script.js b/public/js/script.js
index e489e03..80b3759 100644
--- a/public/js/script.js
+++ b/public/js/script.js
@@ -62,91 +62,134 @@ function compare(a, b) {
 }
 
 async function getContributors(repoName, page = 1) {
-  let request = await fetch(`https://api.github.com/repos/${repoName}/contributors?page=${page}&anon=true`, {
-    method: 'GET',
-    headers: {
-      'Content-Type': 'application/json',
+  let request = await fetch(
+    `https://api.github.com/repos/GameSphere-MultiPlayer/Community-Page/contributors?page=1&anon=true`,
+    {
+      method: "GET",
+      headers: {
+        "Content-Type": "application/json",
+      },
     }
-  });
+  );
+
+  const updateProgress = () => {
+    const { scrollTop, scrollHeight } = document.documentElement;
+    const scrollPercent = `${
+      (scrollTop / (scrollHeight - window.innerHeight)) * 100
+    }%`;
+    document
+      .querySelector("#progress-bar")
+      .style.setProperty("--progress", scrollPercent);
+  };
+  document.addEventListener("scroll", updateProgress);
 
   let contributorsList = await request.json();
-  return contributorsList;
-}
-
-async function getAllContributors(repoName) {
-  let allContributors = [];
-  let page = 1;
-  while (true) {
-    let contributors = await getContributors(repoName, page);
-    if (contributors.length === 0) break;
-    allContributors = allContributors.concat(contributors);
-    page++;
+  contributorsList.sort(compare);
+
+  var data = [];
+  var size = contributorsList.length;
+  for (var i = 0; i < size; i++) {
+    data.push({
+      place: i + 1,
+      name:
+        contributorsList[i].login == undefined
+          ? contributorsList[i].name
+          : contributorsList[i].login,
+      avatar_url: contributorsList[i].avatar_url,
+    });
   }
-  allContributors.sort(compare);
-  return allContributors.map((contributor, index) => ({
-    place: index + 1,
-    name: contributor.login ? contributor.login : contributor.name,
-  }));
-}
 
-var medals = ['medal-gold', 'medal-silver', 'medal-bronze'];
-let data = [];
+  console.log(data);
+  return data;
+}
 
+var medals = ["medal-gold", "medal-silver", "medal-bronze"];
 window.onload = async function () {
-  data = await getAllContributors("GameSphere-MultiPlayer/Community-Page");
-
-  if(document.getElementById('rankingTableBody') == null)
-    return;
+  const data = await getContributors("Community-Page");
 
+  console.log(data.length);
   var i = 0;
-  const top3Fragment = document.createDocumentFragment();
-  const rankingFragment = document.createDocumentFragment();
-
-  data.forEach(item => {
-    const row = document.createElement('div');
-    const placeCell = document.createElement('div');
-    const nameCell = document.createElement('div');
-    const completeCell = document.createElement('div');
-    const completeIndicator = document.createElement('div');
-
+  data.forEach((item) => {
     if (i > 2) {
-      row.className = 'ranking-table-row';
-      placeCell.className = 'ranking-table-data';
+      const rankingTable = document.getElementById("rankingTableBody");
+      const row = document.createElement("div");
+      row.className = "ranking-table-row";
+
+      const placeCell = document.createElement("div");
+      placeCell.className = "ranking-table-data";
       placeCell.textContent = item.place;
-      nameCell.className = 'ranking-table-data';
-      nameCell.textContent = item.name;
-      completeCell.className = 'ranking-table-data';
-      completeIndicator.className = 'complete';
+
+      const nameCell = document.createElement("div");
+      nameCell.className = "ranking-table-data";
+
+      // Create img element for avatar
+      const avatarImg = document.createElement("img");
+      avatarImg.src = item.avatar_url;
+      avatarImg.className = "avatar-img";
+      nameCell.appendChild(avatarImg);
+
+      // Append name
+      const nameText = document.createTextNode(item.name);
+      nameCell.appendChild(nameText);
+
+      const completeCell = document.createElement("div");
+      completeCell.className = "ranking-table-data";
+
+      const completeIndicator = document.createElement("div");
+      completeIndicator.className = "complete";
       completeCell.appendChild(completeIndicator);
+
       row.appendChild(placeCell);
       row.appendChild(nameCell);
       row.appendChild(completeCell);
-      rankingFragment.appendChild(row);
+
+      rankingTable.appendChild(row);
     } else {
-      row.className = 'ranking-table-row-leader-' + (i + 1);
-      placeCell.className = 'ranking-table-data-leader-' + (i + 1);
-      const medalcell = document.createElement('div');
+      const rankingTable = document.getElementById("top3");
+      const row = document.createElement("div");
+      row.className = "ranking-table-row-leader-" + (i + 1);
+
+      const placeCell = document.createElement("div");
+      placeCell.className = "ranking-table-data-leader-" + (i + 1);
+
+      const medalcell = document.createElement("div");
+      console.log(medals[i]);
       medalcell.className = medals[i];
+
       placeCell.appendChild(medalcell);
-      nameCell.className = 'ranking-table-data';
-      nameCell.textContent = item.name;
-      completeCell.className = 'ranking-table-data';
-      completeIndicator.className = 'complete';
+
+      const nameCell = document.createElement("div");
+      nameCell.className = "ranking-table-data";
+
+      // Create img element for avatar
+      const avatarImg = document.createElement("img");
+      avatarImg.src = item.avatar_url;
+      avatarImg.className = "avatar-img";
+      nameCell.appendChild(avatarImg);
+
+      // Append name
+      const nameText = document.createTextNode(item.name);
+      nameCell.appendChild(nameText);
+
+      const completeCell = document.createElement("div");
+      completeCell.className = "ranking-table-data";
+
+      const completeIndicator = document.createElement("div");
+      completeIndicator.className = "complete";
       completeCell.appendChild(completeIndicator);
+
       row.appendChild(placeCell);
       row.appendChild(nameCell);
       row.appendChild(completeCell);
-      top3Fragment.appendChild(row);
+
+      rankingTable.appendChild(row);
     }
     i++;
   });
-
-  document.getElementById('top3').appendChild(top3Fragment);
-  document.getElementById('rankingTableBody').appendChild(rankingFragment);
   console.log("RUNNED");
 };
 
-let nav = document.querySelector(".nav"),
+const nav = document.querySelector(".nav"),
   searchIcon = document.querySelector("#searchIcon"),
   navOpenBtn = document.querySelector(".navOpenBtn"),
   navCloseBtn = document.querySelector(".navCloseBtn"),
@@ -165,7 +208,7 @@ searchResult.addEventListener("input", () => {
     console.log(result);
     resultContainer.innerHTML = "";
     if (result.length !== 0) {
-      result.forEach((item) => {
+      result.forEach((item, index) => {
         const div = document.createElement("div");
         const p = document.createElement("p");
         const span = document.createElement("span");
@@ -196,7 +239,10 @@ searchIcon.addEventListener("click", () => {
   searchIcon.classList.replace("uil-times", "uil-search");
 });
 
+// page start with dark mode
+
 body.classList.add("dark-mode");
+// Toggle between "toggle off and toggle on"//
 
 toggleButton.addEventListener("click", () => {
   body.classList.toggle("dark-mode");
@@ -206,12 +252,16 @@ toggleButton.addEventListener("click", () => {
     toggleButton.classList.remove("bi-toggle-off");
     toggleButton.classList.add("bi-toggle-on");
     document.getElementById("menuBarsColor").style.color = "black";
-    document.querySelectorAll("a").forEach((link) => link.style.color = "black");
+    document
+      .querySelectorAll("a")
+      .forEach((link) => (link.style.color = "black"));
   } else {
     toggleButton.classList.remove("bi-toggle-on");
     toggleButton.classList.add("bi-toggle-off");
     document.getElementById("menuBarsColor").style.color = "white";
-    document.querySelectorAll("a").forEach((link) => link.style.color = "white");
+    document
+      .querySelectorAll("a")
+      .forEach((link) => (link.style.color = "white"));
   }
 });
 
@@ -229,9 +279,6 @@ document.addEventListener("DOMContentLoaded", function () {
   const discordPopup = document.getElementById("discord-popup");
   const closeBtn = document.getElementById("close-btn");
 
-  if(discordButton == null)
-    return;
-
   discordButton.addEventListener("click", function () {
     discordPopup.style.display = "block";
   });
@@ -241,23 +288,18 @@ document.addEventListener("DOMContentLoaded", function () {
   });
 });
 
-// document.addEventListener("DOMContentLoaded", function () {
-//   const discordPopup = document.getElementById("discord-popup");
-//   const closeBtn = document.getElementById("close-btn");
-//   const discordButton = document.getElementById("discord-button");
-//
-//   if(discordButton == null)
-//     return;
-//
-//   discordButton.addEventListener("click", function () {
-//     discordPopup.style.display = "block";
-//   });
-//
-//   closeBtn.addEventListener("click", function () {
-//     discordPopup.style.display = "none";
-//   });
-// });
+document.addEventListener("DOMContentLoaded", function () {
+  const discordPopup = document.getElementById("discord-popup");
+  const closeBtn = document.getElementById("close-btn");
+
+  discordButton.addEventListener("click", function () {
+    discordPopup.style.display = "block";
+  });
 
+  closeBtn.addEventListener("click", function () {
+    discordPopup.style.display = "none";
+  });
+});
 const success = () => {
   showAlert("You have successfully subscribed!", "success");
 };
@@ -287,7 +329,7 @@ const subscriptionForm = document.getElementById("subscriptionForm");
 const emailInput = document.getElementById("emailInput");
 
 subscriptionForm.addEventListener("submit", function (event) {
-  if (!emailInput.validity.valid) {
+  if (!emailInput.checkValidity()) {
     showAlert("Please enter a valid email address.", "error");
     emailInput.focus();
     event.preventDefault();
@@ -298,9 +340,11 @@ subscriptionForm.addEventListener("submit", function (event) {
 
 // Function to update the displayed slider value
 function updateSliderValue(value) {
-  document.getElementById('slider-value').textContent = value;
-  const slider = document.getElementById('rating');
-  const color = `linear-gradient(90deg, #ffcc00 ${value * 20}%, #ddd ${value * 20}%)`;
+  document.getElementById("slider-value").textContent = value;
+  const slider = document.getElementById("rating");
+  const color = `linear-gradient(90deg, #ffcc00 ${value * 20}%, #ddd ${
+    value * 20
+  }%)`;
   slider.style.background = color;
 }
 
@@ -308,34 +352,34 @@ function updateSliderValue(value) {
 function submitFeedback(event) {
   event.preventDefault(); // Prevent form submission from refreshing the page
 
-  const rating = document.getElementById('rating').value;
-  const feedback = document.getElementById('feedback').value;
-  const feedbackMessage = document.getElementById('feedback-message');
+  const rating = document.getElementById("rating").value;
+  const feedback = document.getElementById("feedback").value;
+  const feedbackMessage = document.getElementById("feedback-message");
 
   if (rating && feedback) {
-      // Show feedback message
-      feedbackMessage.textContent = "You have submitted the rating";
-      feedbackMessage.style.display = 'block';
-
-      // Close the Rate Us modal after submission
-      closeRateUs();
+    // Show feedback message
+    feedbackMessage.textContent = "You have submitted the rating";
+    feedbackMessage.style.display = "block";
 
-      // Optional: Reset form fields
-      document.getElementById('feedback').value = '';
-      document.getElementById('rating').value = 3; // Reset slider to default value
-      updateSliderValue(3); // Reset displayed value
+    // Close the Rate Us modal after submission
+    closeRateUs();
 
+    // Optional: Reset form fields
+    document.getElementById("feedback").value = "";
+    document.getElementById("rating").value = 3; // Reset slider to default value
+    updateSliderValue(3); // Reset displayed value
   } else {
-      feedbackMessage.textContent = "Please select a rating and provide feedback before submitting.";
-      feedbackMessage.style.display = 'block';
+    feedbackMessage.textContent =
+      "Please select a rating and provide feedback before submitting.";
+    feedbackMessage.style.display = "block";
   }
 }
 
 function openRateUs() {
-  document.getElementById('rateus-modal').style.display = 'block';
+  document.getElementById("rateus-modal").style.display = "block";
 }
 
 // Function to close the Rate Us modal
 function closeRateUs() {
-  document.getElementById('rateus-modal').style.display = 'none';
+  document.getElementById("rateus-modal").style.display = "none";
 }
diff --git a/server/package-lock.json b/server/package-lock.json
index f59909a..1f2a44b 100644
--- a/server/package-lock.json
+++ b/server/package-lock.json
@@ -377,6 +377,7 @@
       "version": "4.19.2",
       "resolved": "https://registry.npmjs.org/express/-/express-4.19.2.tgz",
       "integrity": "sha512-5T6nhjsT+EOMzuck8JjBHARTHfMht0POzlA60WV2pMD3gyXw2LZnZ+ueGdNxG+0calOJcWKbpFcuzLZ91YWq9Q==",
+      "license": "MIT",
       "dependencies": {
         "accepts": "~1.3.8",
         "array-flatten": "1.1.1",