Delete script.js

script.js

@@ -1,77 +0,0 @@
-document.addEventListener('DOMContentLoaded', () => {
-    fetchTeamData();
-    setupEventListeners();
-    feather.replace();
-});
-
-// Fetch Data from Public API (RandomUser.me)
-async function fetchTeamData() {
-    const grid = document.getElementById('team-grid');
-    const btn = document.getElementById('refresh-team');
-    
-    // Add loading state visual
-    if(btn) {
-        const icon = btn.querySelector('[data-feather]');
-        if(icon) icon.classList.add('animate-spin');
-        btn.disabled = true;
-        btn.innerHTML = 'Loading...';
-    }
-
-    try {
-        const response = await fetch('https://randomuser.me/api/?results=4&nat=us,gb,ca,au,de');
-        const data = await response.json();
-        renderTeam(data.results);
-    } catch (error) {
-        console.error('Error fetching team:', error);
-        grid.innerHTML = `
-            <div class="col-span-full text-center text-red-500 p-8 bg-red-50 rounded-xl border border-red-100">
-                <i data-feather="alert-circle" class="inline-block mb-2"></i>
-                <p>Failed to load team data. Please try again.</p>
-            </div>
-        `;
-        feather.replace();
-    } finally {
-        // Reset button state
-        if(btn) {
-            btn.disabled = false;
-            btn.innerHTML = `<i data-feather="refresh-cw" class="w-4 h-4"></i> Refresh Team`;
-            feather.replace();
-        }
-    }
-}
-
-// Render Team Cards
-function renderTeam(users) {
-    const grid = document.getElementById('team-grid');
-    grid.innerHTML = '';
-
-    users.forEach((user, index) => {
-        const card = document.createElement('div');
-        card.className = 'bg-white rounded-2xl p-6 shadow-sm border border-slate-100 text-center hover:shadow-md transition-all duration-300 group animate-fade-in';
-        card.style.animationDelay = `${index * 100}ms`;
-
-        card.innerHTML = `
-            <div class="relative w-24 h-24 mx-auto mb-4">
-                <img src="${user.picture.large}" alt="${user.name.first}" class="w-full h-full rounded-full object-cover ring-4 ring-indigo-50 group-hover:ring-primary transition-all">
-                <div class="absolute bottom-0 right-0 w-6 h-6 bg-green-500 border-2 border-white rounded-full"></div>
-            </div>
-            <h3 class="font-bold text-lg text-slate-800 capitalize">${user.name.first} ${user.name.last}</h3>
-            <p class="text-primary text-sm font-medium mb-3">Product Designer</p>
-            <p class="text-slate-500 text-xs mb-4">${user.location.city}, ${user.location.country}</p>
-            <div class="flex justify-center gap-3">
-                <a href="#" class="text-slate-400 hover:text-blue-500 transition-colors"><i data-feather="linkedin" class="w-4 h-4"></i></a>
-                <a href="#" class="text-slate-400 hover:text-gray-800 transition-colors"><i data-feather="github" class="w-4 h-4"></i></a>
-                <a href="#" class="text-slate-400 hover:text-blue-400 transition-colors"><i data-feather="twitter" class="w-4 h-4"></i></a>
-            </div>
-        `;
-        grid.appendChild(card);
-    });
-    feather.replace();
-}
-
-function setupEventListeners() {
-    const refreshBtn = document.getElementById('refresh-team');
-    if (refreshBtn) {
-        refreshBtn.addEventListener('click', fetchTeamData);
-    }
-}