Update cardDetails.json

app.js

@@ -174,7 +174,7 @@ function setPageStyle(selectedPage) {
 //
 //
 // Toggle mobile navbar menu
-const attatchMobileMenuToggleFunction = () => {
+const attachMobileMenuToggleFunction = () => {
   try {
     const menuIcon = document.getElementById("navbar-menu-icon-1");
     const linkListContainer = document.getElementById(
@@ -232,5 +232,5 @@ const attatchMobileMenuToggleFunction = () => {
 };
 
 document.addEventListener("DOMContentLoaded", function () {
-  attatchMobileMenuToggleFunction();
+  attachMobileMenuToggleFunction();
 });

cardDetails.json

@@ -1,15 +1,11 @@
 {
   "cardDetails": [
     {
-      "name": "Your Name",
-      "profession": "Your Profession",
-      "quote": "\"Your favourite quote\"</br> - Said By Me",
-      "twitter": "https://twitter.com",
-      "dribbble": "https://dribbble.com",
-      "behance": "https://behance.com",
-      "github": "https://github.com",
-      "linkedin": "https://linkedin.com",
-      "email": "mailto:youremail@gmail.com"
+      "name": "Leonardo Castro",
+      "profession": "Student",
+      "quote": "\"Fortune Favors the Bold\"</br> - Said By Me",
+      "github": "https://github.com/leo-cas",
+      "linkedin": "https://linkedin.com/leonardo-castro"
     },
     {
       "name": "carlos saenz",

index.html

@@ -24,7 +24,7 @@
     <div class="navbar-innner-parent">
       <img src="./image/design-files/logo/simple-contribution.svg" class="navbar-logo-1"
         alt="Simple Contribution Logo" />
-      <img src="./image/design-files/logo/icon-menu.svg" id="navbar-menu-icon-1" alt="MENU Icone" />
+      <img src="./image/design-files/logo/icon-menu.svg" id="navbar-menu-icon-1" alt="MENU Icon" />
       <div class="navbar-link-list">
         <div id="navbar-link-list-container">
           <div>
@@ -79,6 +79,7 @@ <h1>HI CONTRIBUTORS!</h1>
           <span class="button_text">Join a Community</span>
         </span>
       </a>
+      <button id="copyInvite">Copy Discord Invite</button>
     </div>
   </section>
   <section class="home-content">
@@ -143,11 +144,17 @@ <h1>Thanks for your Contribution</h1>
   </section>
 
   <footer id="footer">
-    <div class="copyright">Copyright &copy; Designed by Simple Contribution 2024</div>
+<div class="copyright">
+  Copyright &copy; <span id="year"></span> Designed by Simple Contribution
+</div>
   </footer>
   <script src="./app.js"></script>
   <script src="./banner.js"></script>
   <script src="https://unpkg.com/aos@next/dist/aos.js"></script>
+  <script>
+  document.getElementById("year").textContent = new Date().getFullYear();
+</script>
+
   <script>
     AOS.init();
   </script>

style/style.css

@@ -46,7 +46,7 @@ section {
   z-index: 6;
 }
 
-.navbar-innner-parent {
+.navbar-inner-parent {
   position: relative;
   width: 100%;
   height: 5rem;
@@ -365,7 +365,7 @@ section {
   margin-bottom: 0;
 }
 /*This is a form style for desktop*/
-.discription-title {
+.description-title {
   display: grid;
   grid-template-columns: 70% 30%;
 }
@@ -642,7 +642,7 @@ footer .lag {
 }
 @media screen and (max-width: 1100px) {
   /* This is a form style for desktop */
-  .discription-title {
+  .dscription-title {
     display: flex;
     flex-direction: column;
     justify-content: center;
@@ -759,4 +759,18 @@ footer .lag {
     align-items: center;
     justify-content: space-evenly;
   }
+  #copyInvite {
+  margin-top: 10px;
+  padding: 8px 12px;
+  background: #5865F2; /* Discord blue */
+  color: #fff;
+  border: none;
+  border-radius: 6px;
+  cursor: pointer;
+}
+
+#copyInvite:hover {
+  background: #4752C4;
+}
+
 }