chnaged about us

package.json

@@ -19,6 +19,7 @@
         "@next/mdx": "^14.0.4",
         "@radix-ui/react-icons": "^1.3.0",
         "@tailwindcss/typography": "^0.5.10",
+        "@tsparticles/basic": "^3.3.0",
         "@tsparticles/react": "^3.0.0",
         "@types/mdx": "^2.0.10",
         "autoprefixer": "10.4.14",

script.js

@@ -13,7 +13,7 @@ async function fetchDataAndSave() {
     const projectresponse = await fetch('https://tetragram.codered.cloud/api/v2/pages/?type=projects.ProjectsPage&fields=*');
     const projectdata = await projectresponse.json();
     fs.writeFileSync('./public/project-response.json', JSON.stringify(projectdata, null, 2));
-    console.log('API response saved to api-response.json');
+    console.log('API response saved to public folder!');
   } catch (error) {
     console.error('Error fetching data:', error);
   }

src/components/Navbar/Navbar.js

@@ -62,15 +62,15 @@ const Navbar = () => {
                                     Projects
                                 </Link>
                             </li>
-                            <li className={styles.nav__item}>
+                            {/* <li className={styles.nav__item}>
                                 <Link
                                     href="/teams"
                                     className={styles.nav__link}
                                     onClick={closeMobileMenu}
                                 >
                                     Team
                                 </Link>
-                            </li>
+                            </li> */}
                         </ul>
                         <div className={styles.nav__close} id="nav-close" onClick={toggleMenu}>
                             <IoClose />
@@ -83,11 +83,11 @@ const Navbar = () => {
                                 Home
                             </Link>
                         </li>
-                        <li className={styles.nav__item}>
+                        {/* <li className={styles.nav__item}>
                             <Link href="/teams" className={styles.nav__link} onClick={closeMobileMenu}>
                                 Team
                             </Link>
-                        </li>
+                        </li> */}
                         <li className={styles.nav__item}>
                             <Link href="/blogs" className={styles.nav__link} onClick={closeMobileMenu}>
                                 Blogs

src/components/ProjectsPage.js

@@ -5,10 +5,12 @@ import ReactPaginate from 'react-paginate';
 import './ProjectsPage.css'; // Import your CSS for styling
 import { IoIosArrowForward } from "react-icons/io";
 import { IoIosArrowBack } from "react-icons/io";
+import { useMediaQuery } from "react-responsive";
 
 const ProjectsPage = ({ projects }) => {
   const [currentPage, setCurrentPage] = useState(0);
-  const projectsPerPage = 6;
+  const bigScreen = useMediaQuery({ minWidth: "1536px" });
+  const projectsPerPage = bigScreen ? 8 : 6;
 
   const handlePageClick = (data) => {
     setCurrentPage(data.selected);

src/components/blog/blogList.jsx

@@ -5,11 +5,13 @@ import jsonData from '../../../public/blog-response.json';
 import ReactPaginate from 'react-paginate';
 import { IoIosArrowForward } from "react-icons/io";
 import { IoIosArrowBack } from "react-icons/io";
+import { useMediaQuery } from "react-responsive";
 
 const BlogList = () => {
   const [blogs, setBlogs] = useState([]);
   const [currentPage, setCurrentPage] = useState(0);
-  const blogsPerPage = 6;
+  const bigScreen = useMediaQuery({ minWidth: "1536px" });
+  const blogsPerPage = bigScreen ? 8 : 6;
 
   useEffect(() => {
     const fetchData = async () => {
@@ -33,9 +35,6 @@ const BlogList = () => {
   const currentBlogs = blogs.slice(indexOfFirstProject, indexOfLastProject);
   const pageCount = Math.ceil(blogs.length / 6);
 
-
-
-
   // Function to handle page change
   const handlePageChange = (newPage) => {
     setCurrentPage(newPage);

src/components/event/eventList.jsx

@@ -5,11 +5,13 @@ import jsonData from '../../../public/event-response.json'
 import ReactPaginate from 'react-paginate';
 import { IoIosArrowForward } from "react-icons/io";
 import { IoIosArrowBack } from "react-icons/io";
+import { useMediaQuery } from "react-responsive";
 
 const EventList = () => {
   const [events, setEvents] = useState([]);
   const [currentPage, setCurrentPage] = useState(0);
-  const eventsPerPage = 6;
+  const bigScreen = useMediaQuery({ minWidth: "1536px" });
+  const eventsPerPage = bigScreen ? 8 : 6;
 
   useEffect(() => {
     const fetchData = async () => {

src/components/footer.js

@@ -86,11 +86,11 @@ export default function Footer() {
                             class="mb-4 flex font-semibold uppercase justify-start">
                             Information
                         </h6>
-                        <p class="mb-4">
+                        {/* <p class="mb-4">
                             <a href="/teams" class=" text-neutral-200"
                             >Our Team</a
                             >
-                        </p>
+                        </p> */}
                         <p class="mb-4">
                             <a href="/projects" class=" text-neutral-200"
                             >Projects</a

src/components/particles.jsx

@@ -3,6 +3,7 @@
 import { useEffect, useMemo, useState } from "react";
 import Particles, { initParticlesEngine } from "@tsparticles/react";
 import { loadFull } from "tsparticles";
+import { loadBasic } from "@tsparticles/basic";
 
 export default function ParticlesAnimation() {
 
@@ -15,8 +16,8 @@ export default function ParticlesAnimation() {
             // starting from v2 you can add only the features you need reducing the bundle size
             //await loadAll(engine);
             //await loadFull(engine);
-            await loadFull(engine);
-            //await loadBasic(engine);
+            // await loadFull(engine);
+            await loadBasic(engine);
         }).then(() => {
             setInit(true);
         });