fix: conflict

index.html

@@ -7,6 +7,7 @@
     <title>Kodepilot Clone</title>
     <link rel="stylesheet" href="main.css">
     <link rel="stylesheet" href="templateapi/main.css">
+    <link rel="icon" type="image/x-icon" href="assets/images/logo/favicon.ico">
     <style>
         .center-container {
             display: flex;
@@ -164,13 +165,11 @@
             <div class="logo">Kodepilot</div>
             <input type="text" class="search" placeholder="Search Opportunities">
             <nav>
-                <a href="#">Internships</a>
+                <a href="/login">Log in</a>
-                <a href="#">Jobs</a>
-                <a href="#">Competitions</a>
             </nav>
             <div class="buttons">
-                <a href="/my/"><button class="business">Dashboard</button></a>
+                <button class="business" onclick="getInTouch()">Get in touch</button>
-                <button class="login" onclick="goToLogin()">Login</button>
+                <button class="login" onclick="goToApplay()">Apply</button>
             </div>
         </header>
 
@@ -258,15 +257,8 @@
                             <img src="https://repo.dhanu.cloud/ico/jbl.svg" alt="jbl">
                             <img src="https://repo.dhanu.cloud/ico/ust.svg" alt="ust">
                             <img src="https://repo.dhanu.cloud/ico/accenture.svg" alt="accenture">
-                            <img class="image-hcl" src="https://repo.dhanu.cloud/ico/hcl.svg" alt="hcl">
-                            <img src="https://repo.dhanu.cloud/ico/ebmpapst.svg" alt="ebmpapst">
-                            <img src="https://repo.dhanu.cloud/ico/infosys.svg" alt="infosys">
-                            <img src="https://repo.dhanu.cloud/ico/jbl.svg" alt="jbl">
-                            <img src="https://repo.dhanu.cloud/ico/ust.svg" alt="ust">
-                            <img src="https://repo.dhanu.cloud/ico/accenture.svg" alt="accenture">
                         </div>
                     </div>
-
                 </div>
             </div>
         </section>
@@ -603,71 +595,6 @@
         <section class="corces-s">
             <div class="corces"></div>
         </section>
-
-        <script>
-            console.log("test");
-            document.addEventListener('DOMContentLoaded', async () => {
-                const allCourses = [];
-
-                const baseUrl = 'https://kodepilot.in/course/index.php';
-                const res = await fetch(baseUrl);
-                const html = await res.text();
-
-                const categoryRegex = /<h3 class="categoryname aabtn"><a href="([^"]+)">([^<]+)<\/a><\/h3>/g;
-                const categories = [];
-                let match;
-                while ((match = categoryRegex.exec(html)) !== null) {
-                    categories.push({ url: match[1], name: match[2] });
-                }
-
-                for (const category of categories) {
-                    const resCat = await fetch(category.url);
-                    const catHtml = await resCat.text();
-                    const cleanHtml = catHtml.replace(/\n/g, ' ');
-
-                    const courseRegex = /<div class="card dashboard-card [^"]*"[^>]*>.*?<a href="([^"]+)"[^>]*>.*?background-image: url\(([^)]+)\);".*?<span class="sr-only">(.*?)<\/span>.*?<div class="course-category">\s*([^<]+)<\/div>.*?<div class="course-summary">.*?<p>(.*?)<\/p>/g;
-
-                    while ((match = courseRegex.exec(cleanHtml)) !== null) {
-                        allCourses.push({
-                            category: match[4].trim(),
-                            link: match[1].trim(),
-                            image: match[2].trim(),
-                            name: match[3].trim(),
-                            description: match[5].replace(/<br\s*\/?>/g, ' ').trim()
-                        });
-                    }
-                }
-
-                renderCourses(allCourses);
-            });
-
-            function renderCourses(allCourses) {
-                const container = document.querySelector('.corces');
-                if (!container) {
-                    console.error("⚠️ No .corces container found in DOM");
-                    return;
-                }
-
-                container.innerHTML = ''; // clear old content
-
-                allCourses.forEach(course => {
-                    const courseDiv = document.createElement('div');
-                    courseDiv.className = 'course-card';
-                    courseDiv.innerHTML = `
-            <a href="${course.link}" target="_blank">
-              <div class="course-image" style="background-image: url(${course.image});"></div>
-            </a>
-            <div class="course-content">
-              <div class="course-category">${course.category}</div>
-              <a href="${course.link}" class="course-name" target="_blank">${course.name}</a>
-              <div class="course-description">${course.description}</div>
-            </div>
-        `;
-                    container.appendChild(courseDiv);
-                });
-            }
-        </script>
-
         <footer class="footer">
             <div class="footer-container">
                 <div class="footer-section company-section">

main.css

@@ -22,16 +22,22 @@
 
  .search {
      flex: 1;
-     margin: 0 20px;
+     margin: 0 20px 0 10px;
      padding: 8px 12px;
      border: 1px solid #ddd;
      border-radius: 20px;
+     max-width: 344px;
+     position: absolute;
+     left: 142px;
  }
 
  nav a {
      margin: 0 10px;
      text-decoration: none;
      color: #333;
+     position: absolute;
+     right: 235px;
+     top: 19px;
  }
 
  .buttons button {
@@ -126,9 +132,9 @@
  .green {
      background: #9BE6C1;
      background-image: url('assets/images/unlockcarrer/internship.png');
-      background-size: 115px;
+     background-size: 115px;
-      background-repeat: no-repeat;
+     background-repeat: no-repeat;
-      background-position: bottom right;
+     background-position: bottom right;
  }
 
  .orange {
@@ -157,7 +163,8 @@
  }
 
  .yellow {
-     background: #ffdd80;background-image: url('assets/images/unlockcarrer/competitions.png');
+     background: #ffdd80;
+     background-image: url('assets/images/unlockcarrer/competitions.png');
      background-size: 115px;
      background-repeat: no-repeat;
      background-position: bottom right;
@@ -311,14 +318,13 @@
  .mnc-logos {
      overflow: hidden;
      width: 100%;
-     height: 55px;
  }
 
  .mnc-logos-track {
      display: flex;
-     gap: 5vw;
+     gap: 40px;
-     animation: stepScroll 12s infinite;
+     transform: translateX(0);
-     height: 100%;
+     transition: transform 0.5s ease;
  }
 
  .mnc-logos img {
@@ -329,33 +335,7 @@
 
  .mnc-logos img.image-hcl {
      height: 25px;
- }
+     margin-top: 8px;
-
- @keyframes stepScroll {
-
-     0%,
-     20% {
-         transform: translateX(0);
-     }
-
-     25%,
-     45% {
-         transform: translateX(-25%);
-     }
-
-     50%,
-     70% {
-         transform: translateX(-50%);
-     }
-
-     75%,
-     95% {
-         transform: translateX(-75%);
-     }
-
-     100% {
-         transform: translateX(0);
-     }
  }
 
  .our-numbers {
@@ -1338,7 +1318,7 @@
 
  .card-simple {
      max-width: 1200px;
-     margin: 50px auto 50px auto;
+     margin: 70px auto 70px auto;
  }
 
  .card-easy {
@@ -1466,15 +1446,11 @@
      color: white;
      border: none;
      padding: 8px 18px;
-     /* controls height and width */
      border-radius: 25px;
      font-size: 0.9em;
      width: auto;
-     /* ensures it doesn't stretch */
      max-width: 155px;
-     /* optional limit */
      display: inline-block;
-     /* prevents flex from stretching it */
      cursor: pointer;
      transition: background 0.3s;
  }
@@ -1493,12 +1469,10 @@
 
      .card-easy-right {
          padding: 80px 50px;
-         /* more top/bottom space increases height */
      }
 
      .card-easy-left img {
          width: 90%;
          max-height: 100%;
-         /* image takes more vertical space */
      }
  }

main.js

@@ -1,7 +1,12 @@
-function goToLogin() {
+function goToApplay() {
-    window.location.href = "/my/";
+    window.location.href = "/applay/";
 }
 
+function getInTouch() {
+    window.open("https://wa.me/1234567890?text=Hi%20Link%20kodepilote%20Team...", "_blank");
+}
+
+
 (function () {
     if (window.Slide1rSliderLoaded) {
         return;
@@ -227,4 +232,243 @@ const observer = new IntersectionObserver((entries) => {
     });
 }, { threshold: 0.2 });
 
+console.log("test");
+document.addEventListener('DOMContentLoaded', async () => {
+    // const allCourses = [];
+
+    // const baseUrl = 'https://kodepilot.in/course/index.php';
+    // const res = await fetch(baseUrl);
+    // const html = await res.text();
+
+    // const categoryRegex = /<h3 class="categoryname aabtn"><a href="([^"]+)">([^<]+)<\/a><\/h3>/g;
+    // const categories = [];
+    // let match;
+    // while ((match = categoryRegex.exec(html)) !== null) {
+    //     categories.push({ url: match[1], name: match[2] });
+    // }
+
+    // for (const category of categories) {
+    //     const resCat = await fetch(category.url);
+    //     const catHtml = await resCat.text();
+    //     const cleanHtml = catHtml.replace(/\n/g, ' ');
+
+    //     const courseRegex = /<div class="card dashboard-card [^"]*"[^>]*>.*?<a href="([^"]+)"[^>]*>.*?background-image: url\(([^)]+)\);".*?<span class="sr-only">(.*?)<\/span>.*?<div class="course-category">\s*([^<]+)<\/div>.*?<div class="course-summary">.*?<p>(.*?)<\/p>/g;
+
+    //     while ((match = courseRegex.exec(cleanHtml)) !== null) {
+    //         allCourses.push({
+    //             category: match[4].trim(),
+    //             link: match[1].trim(),
+    //             image: match[2].trim(),
+    //             name: match[3].trim(),
+    //             description: match[5].replace(/<br\s*\/?>/g, ' ').trim()
+    //         });
+    //     }
+    // }
+    const allCourses = [
+        {
+            category: "Software Development & Engineering",
+            link: "https://kodepilot.in/course/view.php?id=16",
+            image: "https://kodepilot.in/pluginfile.php/53/course/overviewfiles/UiUx.png",
+            name: "UI/UX Design",
+            description: "Learn the fundamentals of user interface and user experience design."
+        },
+        {
+            category: "Software Development & Engineering",
+            link: "https://kodepilot.in/course/view.php?id=9",
+            image: "https://kodepilot.in/pluginfile.php/39/course/overviewfiles/IOS.png",
+            name: "iOS Development",
+            description: "Build iOS apps using Swift and Apple’s development tools."
+        },
+        {
+            category: "Software Development & Engineering",
+            link: "https://kodepilot.in/course/view.php?id=7",
+            image: "https://kodepilot.in/pluginfile.php/35/course/overviewfiles/RD.png",
+            name: "React Development",
+            description: "Master React.js for building fast and scalable web apps."
+        },
+        {
+            category: "Software Development & Engineering",
+            link: "https://kodepilot.in/course/view.php?id=5",
+            image: "https://kodepilot.in/pluginfile.php/31/course/overviewfiles/PFS.png",
+            name: "Full Stack Development",
+            description: "End-to-end training in frontend, backend, and databases."
+        },
+        {
+            category: "Software Development & Engineering",
+            link: "https://kodepilot.in/course/view.php?id=3",
+            image: "https://kodepilot.in/pluginfile.php/25/course/overviewfiles/JFS.png",
+            name: "Java Full Stack",
+            description: "Become a full stack developer with Java, Spring, and modern tools."
+        },
+        {
+            category: "Quality & Testing",
+            link: "https://kodepilot.in/course/view.php?id=13",
+            image: "https://kodepilot.in/pluginfile.php/46/course/overviewfiles/PT.png",
+            name: "Performance Testing",
+            description: "Learn tools and techniques for testing system performance."
+        },
+        {
+            category: "Quality & Testing",
+            link: "https://kodepilot.in/course/view.php?id=10",
+            image: "https://kodepilot.in/pluginfile.php/41/course/overviewfiles/QA.png",
+            name: "QA Testing",
+            description: "Understand quality assurance practices for reliable software."
+        },
+        {
+            category: "Cloud & DevOps",
+            link: "https://kodepilot.in/course/view.php?id=17",
+            image: "https://kodepilot.in/pluginfile.php/55/course/overviewfiles/GC.png",
+            name: "Google Cloud",
+            description: "Get hands-on with Google Cloud Platform services and tools."
+        },
+        {
+            category: "Cloud & DevOps",
+            link: "https://kodepilot.in/course/view.php?id=4",
+            image: "https://kodepilot.in/pluginfile.php/28/course/overviewfiles/AWSA.png",
+            name: "AWS Associate",
+            description: "Prepare for AWS certifications and cloud computing skills."
+        },
+        {
+            category: "AI, Data & Emerging Tech (On-demand & trending)",
+            link: "https://kodepilot.in/course/view.php?id=26",
+            image: "https://kodepilot.in/pluginfile.php/73/course/overviewfiles/DE.png",
+            name: "Data Engineering",
+            description: "Build pipelines and manage data at scale for analytics."
+        },
+        {
+            category: "AI, Data & Emerging Tech (On-demand & trending)",
+            link: "https://kodepilot.in/course/view.php?id=18",
+            image: "https://kodepilot.in/pluginfile.php/58/course/overviewfiles/PE.png",
+            name: "Prompt Engineering",
+            description: "Learn to design prompts for AI models like ChatGPT."
+        },
+        {
+            category: "AI, Data & Emerging Tech (On-demand & trending)",
+            link: "https://kodepilot.in/course/view.php?id=12",
+            image: "https://kodepilot.in/pluginfile.php/44/course/overviewfiles/AI%28Ess%29.png",
+            name: "AI Essentials",
+            description: "Introduction to AI, ML concepts, and real-world use cases."
+        },
+        {
+            category: "Enterprise & Business Tech",
+            link: "https://kodepilot.in/course/view.php?id=24",
+            image: "https://kodepilot.in/pluginfile.php/70/course/overviewfiles/ServiceNow.png",
+            name: "ServiceNow",
+            description: "Learn ITSM and workflow automation with ServiceNow."
+        },
+        {
+            category: "Enterprise & Business Tech",
+            link: "https://kodepilot.in/course/view.php?id=19",
+            image: "https://kodepilot.in/pluginfile.php/61/course/overviewfiles/SAP.png",
+            name: "SAP",
+            description: "Master SAP ERP modules for enterprise solutions."
+        },
+        {
+            category: "Cybersecurity & Compliance",
+            link: "https://kodepilot.in/course/view.php?id=23",
+            image: "https://kodepilot.in/pluginfile.php/69/course/overviewfiles/Security.png",
+            name: "Security Fundamentals",
+            description: "Understand core concepts of IT security and defense."
+        },
+        {
+            category: "Cybersecurity & Compliance",
+            link: "https://kodepilot.in/course/view.php?id=22",
+            image: "https://kodepilot.in/pluginfile.php/68/course/overviewfiles/CyE.png",
+            name: "Cyber Essentials",
+            description: "Learn the basics of cybersecurity and compliance standards."
+        }
+    ];
+
+    console.table(allCourses);
+
+
+    renderCourses(allCourses);
+});
+
+function renderCourses(allCourses) {
+    const container = document.querySelector('.corces');
+    if (!container) {
+        console.error("⚠️ No .corces container found in DOM");
+        return;
+    }
+
+    container.innerHTML = '';
+
+    // Group courses by category
+    const grouped = {};
+    allCourses.forEach(course => {
+        if (!grouped[course.category]) grouped[course.category] = [];
+        grouped[course.category].push(course);
+    });
+
+    // Render each category section
+    Object.keys(grouped).forEach(category => {
+        const section = document.createElement('div');
+        section.className = 'course-section';
+
+        section.innerHTML = `
+            <h2 class="course-category-title">${category}</h2>
+            <div class="course-slider">
+                <button class="prev-btn">◀</button>
+                <div class="course-track"></div>
+                <button class="next-btn">▶</button>
+            </div>
+        `;
+
+        const track = section.querySelector('.course-track');
+
+        grouped[category].forEach(course => {
+            const courseDiv = document.createElement('div');
+            courseDiv.className = 'course-card';
+            courseDiv.innerHTML = `
+                <a href="${course.link}" target="_blank">
+                  <div class="course-image" style="background-image: url(${course.image});"></div>
+                </a>
+                <div class="course-content">
+                  <a href="${course.link}" class="course-name" target="_blank">${course.name}</a>
+                  <div class="course-description">${course.description}</div>
+                </div>
+            `;
+            track.appendChild(courseDiv);
+        });
+
+        const prevBtn = section.querySelector('.prev-btn');
+        const nextBtn = section.querySelector('.next-btn');
+
+        let scrollAmount = 0;
+        prevBtn.addEventListener('click', () => {
+            track.scrollBy({ left: -300, behavior: 'smooth' });
+        });
+        nextBtn.addEventListener('click', () => {
+            track.scrollBy({ left: 300, behavior: 'smooth' });
+        });
+
+        container.appendChild(section);
+    });
+}
+
 statItems.forEach(item => observer.observe(item));
+
+
+const track = document.querySelector('.mnc-logos-track');
+const gap = 40;
+let index = 0;
+
+function stepScroll() {
+    const items = track.children;
+    const first = items[0];
+    const moveWidth = first.offsetWidth + gap;
+
+    track.style.transform = `translateX(-${moveWidth}px)`;
+
+    track.addEventListener('transitionend', function handler() {
+        track.appendChild(first);
+        track.style.transition = 'none';
+        track.style.transform = 'translateX(0)';
+        void track.offsetWidth; // force reflow
+        track.style.transition = 'transform 0.5s ease';
+        track.removeEventListener('transitionend', handler);
+    });
+}
+
+setInterval(stepScroll, 3000);