From fbc5ea491d1d0ab654af9fe486d1a1acdd289273 Mon Sep 17 00:00:00 2001
From: "dhanush.s" <dhanush.s@opsmonsters.in>
Date: Fri, 26 Sep 2025 14:00:18 +0530
Subject: [PATCH] fix/feat: !

---
 Assets/Images/logo/favicon.ico | Bin 0 -> 4286 bytes
 index.html                     |  81 +----------
 main.css                       |  53 ++-----
 main.js                        | 248 ++++++++++++++++++++++++++++++++-
 4 files changed, 263 insertions(+), 119 deletions(-)
 create mode 100644 Assets/Images/logo/favicon.ico

diff --git a/Assets/Images/logo/favicon.ico b/Assets/Images/logo/favicon.ico
new file mode 100644
index 0000000000000000000000000000000000000000..2d8dc0590bf56b01a567895237a06403019366eb
GIT binary patch
literal 4286
zcmeH~J!=#}7=UMU>M7!JDjJauo*zg+;ui*kjcI~LtZe-WT37^3Kun_cVk7n<h(d^!
zjlxQdRXQbh=D<SGD2b>MKXN|r+)Q{`cEjavw22p<duL{6=XrN__I6@S#9yUi<lEdY
z8?)UQ(+M=0UXXVC;n?1Tb?OcOzx51!e$ZzeWnvc`Ym!5pw*mC<%a)}tw81%;gjtwt
zf_ct)52wI7k33#5jy=RqU-t<~KSw|D1JqjNDd+D5@0D1ANq7l1hm?OE{l{ALO5W3O
z80<CS5_bviLCrBjly;kf>${Ek3bL;KH|;-ij_Lj~?`J`~*WeM~Pw@VSlnbE!?VR^I
z$06(BHhj!EE;)RIix7dmHW?qz!#sGm#77``t;BzvaWB9Z(AO;GMYst?(C!mBW<a~8
zJPs@M%d;rY#}F)l&S9MTR?zMWju#p3R{U~b*TW6)>tTxWe$e+kz1~7yzjff+2)AGc
zPJ(u4t+!x)SuoDGnb-|-PxQQJt+$|lyJ*!H_t^XM*4tn6EBEeY*4w}E59O@&v|H-U
zK7W3mCANXC@1y<<vV7^b5dPD+mfmG9mjlG92671DAI0+oIzZ1uH}z>qU$d@<@DDr3
z7_l964!zXhxZ~RE%OU-Xc<#a$&^h!|e+%BJV@SV@`wQfqdKu(75C&lawAYtI`~A3$
z#?|g`X8$4Yf4#njbM9>;_aJNjH!=Qm(EAEsmi<>q{~dC-*P`C1@?ISP*=u^Qk0JfC
z7d)f=Du*&|*=K%D<?xC6QPA^$rHT2U<(vUnD}Mcvu^sY%Qy&b%C|m>C*Ooy0yBOmt
z$nS6?h_?rp_MO_lTFW)}`EH_G)kN=LA~A*Qi77^PO2jxy$~{rC<5HBwu&WA5oepA5
WUD{*%#Pp3#7KLhTEOW6bdhZ|bKv2H`

literal 0
HcmV?d00001

diff --git a/index.html b/index.html
index 4479a90..c0fc05a 100644
--- a/index.html
+++ b/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="#">Jobs</a>
-                <a href="#">Competitions</a>
+                <a href="/login">Log in</a>
             </nav>
             <div class="buttons">
-                <a href="/my/"><button class="business">Dashboard</button></a>
-                <button class="login" onclick="goToLogin()">Login</button>
+                <button class="business" onclick="getInTouch()">Get in touch</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>
@@ -610,71 +602,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">
diff --git a/main.css b/main.css
index ed36394..253c126 100644
--- a/main.css
+++ b/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 {
@@ -293,14 +299,13 @@
  .mnc-logos {
      overflow: hidden;
      width: 100%;
-     height: 55px;
  }
 
  .mnc-logos-track {
      display: flex;
-     gap: 5vw;
-     animation: stepScroll 12s infinite;
-     height: 100%;
+     gap: 40px;
+     transform: translateX(0);
+     transition: transform 0.5s ease;
  }
 
  .mnc-logos img {
@@ -311,33 +316,7 @@
 
  .mnc-logos img.image-hcl {
      height: 25px;
- }
-
- @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);
-     }
+     margin-top: 8px;
  }
 
  .our-numbers {
@@ -554,8 +533,8 @@
  }
 
  .card-quizzes {
-     background: linear-gradient(to bottom right, #60a5fa, #2563eb);
      color: white;
+     background: linear-gradient(to bottom right, #60a5fa, #2563eb), url('http://127.0.0.1:5500/Assets/Images/learn/learn.png') no-repeat center/cover;
  }
 
  .card-hackathons {
@@ -1320,7 +1299,7 @@
 
  .card-simple {
      max-width: 1200px;
-     margin: 50px auto 50px auto;
+     margin: 70px auto 70px auto;
  }
 
  .card-easy {
@@ -1448,15 +1427,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;
  }
@@ -1475,12 +1450,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 */
      }
  }
\ No newline at end of file
diff --git a/main.js b/main.js
index 56c7f40..c9ef5af 100644
--- a/main.js
+++ b/main.js
@@ -1,7 +1,12 @@
-function goToLogin() {
-    window.location.href = "/my/";
+function goToApplay() {
+    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);