Promote version 66a4121 to main

Promoted commit 66a4121be103e4afd9119697e0a1289d6f05a23d to main branch

index.html

@@ -47,18 +47,13 @@
             <h2 class="text-3xl font-bold text-gray-800 mb-8 text-center">Choose Your Learning Path</h2>
             
             <div class="mb-12">
-                <div class="flex items-center justify-between mb-4">
-                    <h3 class="text-xl font-semibold text-gray-800">Foundational Courses</h3>
-                    <button class="toggle-section-btn" data-section="foundational">
-                        <i data-feather="chevron-down" class="text-gray-600"></i>
-                    </button>
-                </div>
-                <div id="foundational-section" class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-8">
+                <h3 class="text-xl font-semibold text-gray-800 mb-4">Foundational Courses</h3>
+                <div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-8">
                     <div class="bg-white p-4 rounded-lg shadow hover:shadow-md transition-shadow">
                         <h4 class="font-medium text-green-600">MDB100</h4>
                         <p class="text-gray-600">MongoDB Database and Security</p>
                     </div>
-<div class="bg-white p-4 rounded-lg shadow hover:shadow-md transition-shadow">
+                    <div class="bg-white p-4 rounded-lg shadow hover:shadow-md transition-shadow">
                         <h4 class="font-medium text-green-600">MDB200</h4>
                         <p class="text-gray-600">MongoDB Optimization and Performance</p>
                     </div>
@@ -68,22 +63,13 @@
                     </div>
                 </div>
             </div>
+
             <div class="mb-12">
-                <div class="flex items-center justify-between mb-4">
-                    <h3 class="text-xl font-semibold text-gray-800">Role-Focused Courses</h3>
-                    <button class="toggle-section-btn" data-section="role-focused">
-                        <i data-feather="chevron-down" class="text-gray-600"></i>
-                    </button>
-                </div>
+                <h3 class="text-xl font-semibold text-gray-800 mb-4">Role-Focused Courses</h3>
                 
-                <div id="role-focused-section">
-                    <div class="flex items-center justify-between mb-2">
-                        <h4 class="font-medium text-gray-700">Developer and Data Architect</h4>
-                        <button class="toggle-subsection-btn" data-subsection="developer-data-architect">
-                            <i data-feather="chevron-down" class="text-gray-600"></i>
-                        </button>
-                    </div>
-<div class="grid grid-cols-1 md:grid-cols-3 gap-4">
+                <div class="mb-6">
+                    <h4 class="font-medium text-gray-700 mb-2">Developer and Data Architect</h4>
+                    <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
                         <div class="bg-white p-4 rounded-lg shadow hover:shadow-md transition-shadow">
                             <h4 class="font-medium text-blue-600">DEV400</h4>
                             <p class="text-gray-600">MongoDB Developer Extension</p>
@@ -98,13 +84,10 @@
                         </div>
                     </div>
                 </div>
-                    <div class="flex items-center justify-between mb-2">
-                        <h4 class="font-medium text-gray-700">Developer Advanced</h4>
-                        <button class="toggle-subsection-btn" data-subsection="developer-advanced">
-                            <i data-feather="chevron-down" class="text-gray-600"></i>
-                        </button>
-                    </div>
-<div class="grid grid-cols-1 md:grid-cols-3 lg:grid-cols-5 gap-4">
+
+                <div class="mb-6">
+                    <h4 class="font-medium text-gray-700 mb-2">Developer Advanced</h4>
+                    <div class="grid grid-cols-1 md:grid-cols-3 lg:grid-cols-5 gap-4">
                         <div class="bg-white p-4 rounded-lg shadow hover:shadow-md transition-shadow">
                             <h4 class="font-medium text-purple-600">DA610</h4>
                             <p class="text-gray-600">MongoDB Adv. Queries</p>
@@ -127,13 +110,10 @@
                         </div>
                     </div>
                 </div>
-                    <div class="flex items-center justify-between mb-2">
-                        <h4 class="font-medium text-gray-700">AI Developer</h4>
-                        <button class="toggle-subsection-btn" data-subsection="ai-developer">
-                            <i data-feather="chevron-down" class="text-gray-600"></i>
-                        </button>
-                    </div>
-<div class="grid grid-cols-1 md:grid-cols-3 gap-4">
+
+                <div class="mb-6">
+                    <h4 class="font-medium text-gray-700 mb-2">AI Developer</h4>
+                    <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
                         <div class="bg-white p-4 rounded-lg shadow hover:shadow-md transition-shadow">
                             <h4 class="font-medium text-indigo-600">DS110</h4>
                             <p class="text-gray-600">MongoDB Atlas Search & Vector Search</p>
@@ -148,13 +128,10 @@
                         </div>
                     </div>
                 </div>
-                    <div class="flex items-center justify-between mb-2">
-                        <h4 class="font-medium text-gray-700">Atlas Admin / DevOps</h4>
-                        <button class="toggle-subsection-btn" data-subsection="atlas-admin">
-                            <i data-feather="chevron-down" class="text-gray-600"></i>
-                        </button>
-                    </div>
-<div class="grid grid-cols-1 md:grid-cols-3 lg:grid-cols-5 gap-4">
+
+                <div class="mb-6">
+                    <h4 class="font-medium text-gray-700 mb-2">Atlas Admin / DevOps</h4>
+                    <div class="grid grid-cols-1 md:grid-cols-3 lg:grid-cols-5 gap-4">
                         <div class="bg-white p-4 rounded-lg shadow hover:shadow-md transition-shadow">
                             <h4 class="font-medium text-red-600">OFA400</h4>
                             <p class="text-gray-600">Atlas Admin</p>
@@ -177,13 +154,10 @@
                         </div>
                     </div>
                 </div>
-                    <div class="flex items-center justify-between mb-2">
-                        <h4 class="font-medium text-gray-700">Database Admin / DevOps</h4>
-                        <button class="toggle-subsection-btn" data-subsection="db-admin">
-                            <i data-feather="chevron-down" class="text-gray-600"></i>
-                        </button>
-                    </div>
-<div class="grid grid-cols-1 md:grid-cols-3 lg:grid-cols-5 gap-4">
+
+                <div class="mb-6">
+                    <h4 class="font-medium text-gray-700 mb-2">Database Admin / DevOps</h4>
+                    <div class="grid grid-cols-1 md:grid-cols-3 lg:grid-cols-5 gap-4">
                         <div class="bg-white p-4 rounded-lg shadow hover:shadow-md transition-shadow">
                             <h4 class="font-medium text-orange-600">OFS400</h4>
                             <p class="text-gray-600">Ops Manager Admin</p>
@@ -206,13 +180,10 @@
                         </div>
                     </div>
                 </div>
-                    <div class="flex items-center justify-between mb-2">
-                        <h4 class="font-medium text-gray-700">Security - CSFLE</h4>
-                        <button class="toggle-subsection-btn" data-subsection="security">
-                            <i data-feather="chevron-down" class="text-gray-600"></i>
-                        </button>
-                    </div>
-<div class="grid grid-cols-1 md:grid-cols-3 gap-4">
+
+                <div>
+                    <h4 class="font-medium text-gray-700 mb-2">Security - CSFLE</h4>
+                    <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
                         <div class="bg-white p-4 rounded-lg shadow hover:shadow-md transition-shadow">
                             <h4 class="font-medium text-teal-600">DS130</h4>
                             <p class="text-gray-600">Client-Side Field Level Encryption</p>
@@ -306,48 +277,12 @@
     </main>
 
     <custom-footer></custom-footer>
+
     <script>
         feather.replace();
         
-        // Toggle section functionality
-        document.querySelectorAll('.toggle-section-btn').forEach(btn => {
-            btn.addEventListener('click', () => {
-                const sectionId = btn.getAttribute('data-section');
-                const section = document.getElementById(`${sectionId}-section`);
-                const icon = btn.querySelector('i');
-                
-                if (section.classList.contains('hidden')) {
-                    section.classList.remove('hidden');
-                    icon.setAttribute('data-feather', 'chevron-up');
-                } else {
-                    section.classList.add('hidden');
-                    icon.setAttribute('data-feather', 'chevron-down');
-                }
-                feather.replace();
-            });
-        });
-
-        // Toggle subsection functionality
-        document.querySelectorAll('.toggle-subsection-btn').forEach(btn => {
-            btn.addEventListener('click', (e) => {
-                e.stopPropagation();
-                const subsection = btn.getAttribute('data-subsection');
-                const content = btn.closest('div').nextElementSibling;
-                const icon = btn.querySelector('i');
-                
-                if (content.classList.contains('hidden')) {
-                    content.classList.remove('hidden');
-                    icon.setAttribute('data-feather', 'chevron-up');
-                } else {
-                    content.classList.add('hidden');
-                    icon.setAttribute('data-feather', 'chevron-down');
-                }
-                feather.replace();
-            });
-        });
-
         // Month selector functionality
-document.querySelectorAll('.month-btn').forEach(btn => {
+        document.querySelectorAll('.month-btn').forEach(btn => {
             btn.addEventListener('click', () => {
                 document.querySelectorAll('.month-btn').forEach(b => b.classList.remove('active', 'bg-gray-100'));
                 btn.classList.add('active', 'bg-gray-100');

style.css

@@ -32,33 +32,12 @@ body {
 #upcoming-dates-list::-webkit-scrollbar-thumb:hover {
     background: #a0aec0;
 }
-/* Dropdown section styles */
-.toggle-section-btn, .toggle-subsection-btn {
-    background: none;
-    border: none;
-    cursor: pointer;
-    padding: 0.25rem;
-    transition: transform 0.2s;
-}
-
-.toggle-section-btn:hover, .toggle-subsection-btn:hover {
-    transform: scale(1.1);
-}
 /* Animation for course cards */
 @keyframes fadeIn {
     from { opacity: 0; transform: translateY(20px); }
     to { opacity: 1; transform: translateY(0); }
 }
 
-/* Course card dropdown styles */
-.custom-course-card select {
-    appearance: none;
-    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
-    background-repeat: no-repeat;
-    background-position: right 0.5rem center;
-    background-size: 1rem;
-    padding-right: 2rem;
-}
 .month-section {
     animation: fadeIn 0.5s ease-out forwards;
 }