Pagination Fixed For Better User Interface

CODE_OF_CONDUCT.md

@@ -17,17 +17,14 @@ In the interest of fostering an open and welcoming environment, we as contributo
 We expect all participants to:
 
 1. **Be Respectful:**
-
    - Treat everyone with respect and courtesy.
    - Approach disagreements constructively and considerately.
 
 2. **Be Inclusive:**
-
    - Ensure everyone feels welcome and valued.
    - Avoid discriminatory, exclusionary, or harmful language and actions.
 
 3. **Be Collaborative:**
-
    - Share knowledge and help others.
    - Focus on improving the platform and the experience for all.
 
@@ -52,11 +49,9 @@ The following behaviors are unacceptable in the DevDisplay community:
 
 - **Join DevDisplay Discord Community**: [Discord Community](https://discord.gg/chyt2UgTv5)
 - **Join DevDisplay WhatsApp Community**: [WhatsApp Community](https://chat.whatsapp.com/Dcl21sgGDIpHURESSuH0p4)
-
   - Connect with other developers and collaborate on exciting projects.
 
 - **Reach Out to the Team**:
-
   - Organization Email: [email protected]
   - Creator's Email: [email protected]
 
@@ -69,7 +64,6 @@ The following behaviors are unacceptable in the DevDisplay community:
 ---
 
 2. **Provide Details:**
-
    - Include a description of the incident, relevant links, or screenshots if possible.
 
 3. **Expect a Response:**

SECURITY.md

@@ -23,19 +23,16 @@ We take the security of DevDisplay seriously. If you discover any security vulne
 ### For Contributors
 
 1. **Code Review**
-
    - All code changes must go through peer review
    - Security-sensitive code requires additional review
    - Follow secure coding guidelines
 
 2. **Dependencies**
-
    - Keep all dependencies up to date
    - Regularly check for known vulnerabilities in dependencies
    - Use only trusted and well-maintained packages
 
 3. **Authentication & Authorization**
-
    - Use strong password policies
    - Implement proper session management
    - Follow the principle of least privilege
@@ -48,7 +45,6 @@ We take the security of DevDisplay seriously. If you discover any security vulne
 ### For Users
 
 1. **Account Security**
-
    - Use strong, unique passwords
    - Enable two-factor authentication when available
    - Keep your access tokens secure

public/data/DivyaJain-DataAnalyst.json

@@ -1,28 +1,28 @@
 {
-    "name": "Divya Jain",
-    "location": "Delhi, India",
-    "bio": "Aspiring Data Analyst | GSSoC'25 Campus Ambassador & Contributor | Student",
-    "avatar": "https://avatars.githubusercontent.com/u/147162320?v=4&size=300",
-    "portfolio": "https://github.com/DivyaJain-DataAnalyst",
-    "skills": [
-      "HTML",
-      "CSS",
-      "JavaScript",
-      "Excel",
-      "PowerBI",
-      "SQL",
-      "Git",
-      "Responsive Design",
-      "Tailwind CSS",
-      "C",
-      "C+",
-      "GitHub"
-    ],
-    "social": {
-      "GitHub": "https://github.com/DivyaJain-DataAnalyst",
-      "Twitter": "#",
-      "LinkedIn": "https://www.linkedin.com/in/divyajain-dataanalyst/",
-      "Instagram": "#",
-      "Email": "[email protected]"
-    }
-  }
+  "name": "Divya Jain",
+  "location": "Delhi, India",
+  "bio": "Aspiring Data Analyst | GSSoC'25 Campus Ambassador & Contributor | Student",
+  "avatar": "https://avatars.githubusercontent.com/u/147162320?v=4&size=300",
+  "portfolio": "https://github.com/DivyaJain-DataAnalyst",
+  "skills": [
+    "HTML",
+    "CSS",
+    "JavaScript",
+    "Excel",
+    "PowerBI",
+    "SQL",
+    "Git",
+    "Responsive Design",
+    "Tailwind CSS",
+    "C",
+    "C+",
+    "GitHub"
+  ],
+  "social": {
+    "GitHub": "https://github.com/DivyaJain-DataAnalyst",
+    "Twitter": "#",
+    "LinkedIn": "https://www.linkedin.com/in/divyajain-dataanalyst/",
+    "Instagram": "#",
+    "Email": "[email protected]"
+  }
+}

public/data/pseudodanish.json

@@ -4,7 +4,21 @@
   "bio": "I don’t just write code — I architect digital weapons. I debug like a sniper and build web solutions that conquer. Always hungry to outsmart tech, not just learn it.",
   "avatar": "https://github.com/pseudodanish.png",
   "portfolio": "https://github.com/pseudodanish",
-  "skills": ["Python", "Javascript", "Django","React JS","Wordpress","Shopify","Java","Javascript","Typescript","Redux Toolkit","Ant Design","Axios","Redux Saga"],
+  "skills": [
+    "Python",
+    "Javascript",
+    "Django",
+    "React JS",
+    "Wordpress",
+    "Shopify",
+    "Java",
+    "Javascript",
+    "Typescript",
+    "Redux Toolkit",
+    "Ant Design",
+    "Axios",
+    "Redux Saga"
+  ],
   "social": {
     "GitHub": "https://github.com/pseudodanish",
     "Twitter": "https://x.com/Draggy2131",
@@ -13,6 +27,6 @@
     "Email": "[email protected]",
     "Discord": "https://discord.com/users/dragzy6702",
     "YouTube": "https://www.youtube.com/channel/UC7yqfvX8Ivnxgp-EfIgHmnQ",
-    "Upwork":"https://www.upwork.com/freelancers/~01be7c53737368bf38?mp_source=share",
+    "Upwork": "https://www.upwork.com/freelancers/~01be7c53737368bf38?mp_source=share"
   }
 }

src/Homepage.jsx

@@ -151,7 +151,6 @@ function App() {
       <Sidebar />
       <div className="w-full pl-5 pr-4 md:h-screen md:w-[77%] md:overflow-y-scroll md:py-7" ref={profilesRef}>
         <Search onSearch={handleSearch} />
-        {profiles.length === 0 && searching ? <NoResultFound /> : renderProfiles()}
         {combinedData.length > 0 && (
           <Pagination
             currentPage={currentPage}
@@ -160,6 +159,7 @@ function App() {
             onPrevPage={handlePrevPage}
           />
         )}
+        {profiles.length === 0 && searching ? <NoResultFound /> : renderProfiles()}
       </div>
       {/* <GTranslateLoader /> */}
     </div>

src/Page/Home.jsx

@@ -321,7 +321,7 @@ const StyledDot = styled.div`
 const TechFeatures = () => {
   return (
     <section className="tech-features-section mt-[60%] max-w-[90%] px-4 py-16 text-white xs:mt-0">
-      <div className="mx-auto my-12 max-w-[80%] text-center ">
+      <div className="mx-auto my-12 max-w-[80%] text-center">
         <h2 className="custom-font my-4 text-4xl font-bold text-[#00a6fb]">Dive into DevDisplay</h2>
         <div className="mb-6 mt-4 flex flex-col items-center">
           <p className="max-w-2xl text-center text-lg text-gray-400">

src/Page/OpportunitiesHub/CompetitionList.jsx

@@ -163,10 +163,7 @@ const CompetitionsCardComponent = ({ organizer, title, location, date, domains,
 
       <div className="mt-2 flex flex-wrap justify-center gap-2 p-2">
         {domains.map((domain, idx) => (
-          <span
-            key={idx}
-            className="bg-gray-1000 rounded-full border border-[#00a6fb]  px-2 py-1 text-xs text-gray-300"
-          >
+          <span key={idx} className="bg-gray-1000 rounded-full border border-[#00a6fb] px-2 py-1 text-xs text-gray-300">
             {domain}
           </span>
         ))}

src/Page/OpportunitiesHub/EventsList.jsx

@@ -254,10 +254,7 @@ const TecheventsCardComponent = ({ organizer, title, location, date, domains, ap
 
       <div className="mt-2 flex flex-wrap justify-center gap-2 p-2">
         {domains.map((domain, idx) => (
-          <span
-            key={idx}
-            className="bg-gray-1000 rounded-full border border-[#00a6fb]  px-2 py-1 text-xs text-gray-300"
-          >
+          <span key={idx} className="bg-gray-1000 rounded-full border border-[#00a6fb] px-2 py-1 text-xs text-gray-300">
             {domain}
           </span>
         ))}

src/Page/OpportunitiesHub/HackathonList.jsx

@@ -734,10 +734,7 @@ const HackathonCardComponent = React.forwardRef(
 
       <div className="mt-2 flex flex-wrap justify-center gap-2 p-2">
         {domains.map((domain, idx) => (
-          <span
-            key={idx}
-            className="bg-gray-1000 rounded-full border border-[#00a6fb]  px-2 py-1 text-xs text-gray-300"
-          >
+          <span key={idx} className="bg-gray-1000 rounded-full border border-[#00a6fb] px-2 py-1 text-xs text-gray-300">
             {domain}
           </span>
         ))}

src/Page/OpportunitiesHub/InternshipList.jsx

@@ -28,7 +28,7 @@ const Internship1 = () => {
           <div className="flex items-start justify-between">
             <div className="flex gap-4">
               <div className="relative flex h-16 w-16 items-center justify-center rounded-2xl bg-white p-2">
-                <div className="absolute inset-0 rounded-2xl bg-gradient-to-br  to-teal-500 opacity-20 blur-sm transition-opacity duration-300 group-hover:opacity-30" />
+                <div className="absolute inset-0 rounded-2xl bg-gradient-to-br to-teal-500 opacity-20 blur-sm transition-opacity duration-300 group-hover:opacity-30" />
                 <img src="/assets/LocalCompany/WOODESY.png" alt="Custom Icon" className="h-10 w-10" />
               </div>
               <div>
@@ -166,7 +166,7 @@ const Internship2 = () => {
           <div className="flex items-start justify-between">
             <div className="flex gap-4">
               <div className="relative flex h-16 w-16 items-center justify-center rounded-2xl bg-white p-2">
-                <div className="absolute inset-0 rounded-2xl bg-gradient-to-br  to-teal-500 opacity-20 blur-sm transition-opacity duration-300 group-hover:opacity-30" />
+                <div className="absolute inset-0 rounded-2xl bg-gradient-to-br to-teal-500 opacity-20 blur-sm transition-opacity duration-300 group-hover:opacity-30" />
                 <img src="/assets/LocalCompany/Vijetha Softwares Pvt.Ltd.jpg" alt="Custom Icon" className="h-10 w-10" />
               </div>
               <div>
@@ -308,7 +308,7 @@ const Internship3 = () => {
           <div className="flex items-start justify-between">
             <div className="flex gap-4">
               <div className="relative flex h-16 w-16 items-center justify-center rounded-2xl bg-white p-2">
-                <div className="absolute inset-0 rounded-2xl bg-gradient-to-br  to-teal-500 opacity-20 blur-sm transition-opacity duration-300 group-hover:opacity-30" />
+                <div className="absolute inset-0 rounded-2xl bg-gradient-to-br to-teal-500 opacity-20 blur-sm transition-opacity duration-300 group-hover:opacity-30" />
                 <img src="/assets/LocalCompany/Webfuture.jpg" alt="Custom Icon" className="h-10 w-10" />
               </div>
               <div>

src/Page/OpportunitiesHub/OpenSource.jsx

@@ -715,7 +715,7 @@ const OSProgramCardComponent = ({
             <div className="status-user" />
             Apply Now
           </a>
-          <div className="mt-2 flex flex-col items-start gap-1 rounded-lg border border-[#00a6fb] bg-gray-900 bg-opacity-50 px-14 py-3 text-sm text-xs text-white text-white shadow-lg backdrop-blur-md transition-all hover:bg-gray-800">
+          <div className="mt-2 flex flex-col items-start gap-1 rounded-lg border border-[#00a6fb] bg-gray-900 bg-opacity-50 px-14 py-3 text-sm text-xs text-white shadow-lg backdrop-blur-md transition-all hover:bg-gray-800">
             <div className="flex items-center">
               <FontAwesomeIcon icon={faCalendarAlt} className="mr-2 text-[#00a6fb]" />
               <span className="font-medium">{timeline}</span>

src/Page/Sponsor.jsx

@@ -20,7 +20,7 @@ const SponsorUs = () => {
           within the tech community.
         </p>
 
-        <div className="mb-8 ">
+        <div className="mb-8">
           <h6 className="mb-2 text-xl font-semibold">What is DevDisplay?</h6>
           <p className="mb-4">
             DevDisplay is a global open-source tech community with the mission to unite all tech-related needs under one

src/components/AchievementJourney/IndividualJourney.js

@@ -53,7 +53,7 @@ const AchieverJourneyPage = () => {
         </div>
       </header>
 
-      <section className=" mx-auto mt-4 p-8">
+      <section className="mx-auto mt-4 p-8">
         <motion.h2
           className="text-3xl font-bold text-[#00a6fb]"
           initial={{ opacity: 0, y: -20 }}
@@ -113,7 +113,7 @@ const AchieverJourneyPage = () => {
         </ul>
       </section>
 
-      <section className=" mx-auto mt-12 p-8">
+      <section className="mx-auto mt-12 p-8">
         <h2 className="text-2xl font-semibold text-[#00a6fb]">Interview Process</h2>
         <h3 className="mt-4 text-xl font-semibold">Preparation</h3>
         <ul className="list-disc pl-6">
@@ -158,7 +158,7 @@ const AchieverJourneyPage = () => {
         </ul>
       </section>
 
-      <section className=" mx-auto mt-12 p-8">
+      <section className="mx-auto mt-12 p-8">
         <h2 className="text-2xl font-semibold text-[#00a6fb]">Resources for Preparation</h2>
         {achieverData.resources.learningMaterials.map((material, index) => (
           <div key={index} className="mt-4">
@@ -179,7 +179,7 @@ const AchieverJourneyPage = () => {
         </ul>
       </section>
 
-      <section className=" mx-auto mt-12 p-8">
+      <section className="mx-auto mt-12 p-8">
         <h2 className="text-2xl font-semibold text-[#00a6fb]">Inspiration & Guidance</h2>
         {achieverData.inspirationAndGuidance.roadmaps.map((roadmap, index) => (
           <div key={index} className="mt-8">

src/components/Pagination/Pagination.jsx

@@ -14,7 +14,7 @@ function Pagination({ currentPage, totalPages, onNextPage, onPrevPage }) {
   };
 
   return (
-    <div className="flex items-center justify-center gap-12">
+    <div className="mb-5 flex items-center justify-end gap-12">
       <button onClick={handlePrevPage} disabled={currentPage === 1} className="focus:outline-none disabled:opacity-30">
         <span
           href="#"

src/components/Profile/Profile.jsx

@@ -106,45 +106,45 @@ function Card({ data }) {
             <FaLocationDot />
             {data.location}
           </p>
-          <div className=" group flex overflow-hidden">
+          <div className="group flex overflow-hidden">
             <div
-              className=" skills-container group-hover:paused mr-2 mt-4 flex h-auto  animate-loop-scroll gap-4 whitespace-nowrap "
+              className="skills-container group-hover:paused mr-2 mt-4 flex h-auto animate-loop-scroll gap-4 whitespace-nowrap"
               ref={cardRef}
             >
               {data.skills &&
                 data.skills.map((skill, index) => (
                   <div
-                    className=" inline h-auto  cursor-default whitespace-nowrap rounded-md bg-secondaryColor px-2 py-1 text-[9px] text-white sm:text-sm md:h-[30px]"
+                    className="inline h-auto cursor-default whitespace-nowrap rounded-md bg-secondaryColor px-2 py-1 text-[9px] text-white sm:text-sm md:h-[30px]"
                     key={index}
                   >
                     {skill}
                   </div>
                 ))}
             </div>
             <div
-              className=" skills-container group-hover:paused mr-2 mt-4 flex h-auto  animate-loop-scroll gap-4 whitespace-nowrap"
+              className="skills-container group-hover:paused mr-2 mt-4 flex h-auto animate-loop-scroll gap-4 whitespace-nowrap"
               aria-hidden="true"
               ref={cardRef}
             >
               {data.skills &&
                 data.skills.map((skill, index) => (
                   <div
-                    className=" inline h-auto  cursor-default whitespace-nowrap rounded-md bg-secondaryColor px-2 py-1 text-[9px] text-white sm:text-sm md:h-[30px]"
+                    className="inline h-auto cursor-default whitespace-nowrap rounded-md bg-secondaryColor px-2 py-1 text-[9px] text-white sm:text-sm md:h-[30px]"
                     key={index}
                   >
                     {skill}
                   </div>
                 ))}
             </div>
             <div
-              className=" skills-container group-hover:paused mt-4 flex h-auto animate-loop-scroll  gap-4 whitespace-nowrap"
+              className="skills-container group-hover:paused mt-4 flex h-auto animate-loop-scroll gap-4 whitespace-nowrap"
               aria-hidden="true"
               ref={cardRef}
             >
               {data.skills &&
                 data.skills.map((skill, index) => (
                   <div
-                    className=" inline h-auto  cursor-default whitespace-nowrap rounded-md bg-secondaryColor px-2 py-1 text-[9px] text-white sm:text-sm md:h-[30px]"
+                    className="inline h-auto cursor-default whitespace-nowrap rounded-md bg-secondaryColor px-2 py-1 text-[9px] text-white sm:text-sm md:h-[30px]"
                     key={index}
                   >
                     {skill}