优化调整

2025-07-26 00:37:18 +08:00
parent 08bbd4df0f
commit 0dfabc35d7
90 changed files with 3594 additions and 2294 deletions
@@ -0,0 +1,78 @@
+import { features } from './data.js';
+
+document.addEventListener('DOMContentLoaded', () => {
+    
+    if (typeof lucide !== 'undefined') {
+        lucide.createIcons();
+    }
+
+    const featuresGrid = document.getElementById('features-grid');
+
+    if (featuresGrid) {
+        features.forEach((feature, index) => {
+            const card = document.createElement('div');
+            card.className = 'feature-card-bg rounded-2xl p-6 flex flex-col items-center text-center scroll-target';
+            card.style.transitionDelay = `${index * 100}ms`;
+
+            card.innerHTML = `
+                <div class="w-full aspect-square rounded-xl overflow-hidden mb-6 feature-card-image-container flex items-center justify-center">
+                    <img src="${feature.image}" alt="${feature.alt}" class="w-4/5 h-4/5 object-contain drop-shadow-lg">
+                </div>
+                <div class="flex items-center space-x-2 mb-3">
+                    <i data-lucide="${feature.icon}" class="w-5 h-5 text-tech-blue"></i>
+                    <h3 class="text-xl font-bold text-text-dark">${feature.title}</h3>
+                </div>
+                <p class="text-text-medium text-sm flex-grow">${feature.description}</p>
+            `;
+            featuresGrid.appendChild(card);
+        });
+        
+        if (typeof lucide !== 'undefined') {
+            lucide.createIcons();
+        }
+    }
+
+    const scrollObserver = new IntersectionObserver((entries, observer) => {
+        entries.forEach(entry => {
+            if (entry.isIntersecting) {
+                entry.target.classList.add('visible');
+                observer.unobserve(entry.target);
+            }
+        });
+    }, { threshold: 0.1 });
+
+    document.querySelectorAll('.scroll-target').forEach(target => {
+        scrollObserver.observe(target);
+    });
+
+
+    const loginButton = document.getElementById('login-button');
+    const loginModal = document.getElementById('login-modal');
+    const closeModalButton = document.getElementById('close-modal-button');
+
+    if (loginButton && loginModal && closeModalButton) {
+        const openModal = () => {
+            loginModal.classList.remove('hidden');
+            if (typeof lucide !== 'undefined') {
+                lucide.createIcons();
+            }
+        };
+
+        const closeModal = () => {
+            loginModal.classList.add('hidden');
+        };
+
+        loginButton.addEventListener('click', openModal);
+        closeModalButton.addEventListener('click', closeModal);
+        loginModal.addEventListener('click', (event) => {
+            if (event.target === loginModal) {
+                closeModal();
+            }
+        });
+        document.addEventListener('keydown', (event) => {
+            if (event.key === 'Escape' && !loginModal.classList.contains('hidden')) {
+                closeModal();
+            }
+        });
+    }
+});