File size: 2,964 Bytes
52a682d | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 | document.addEventListener('DOMContentLoaded', function() {
// Load featured scholarships
fetchFeaturedScholarships();
// Language switcher functionality
const langSwitcher = document.getElementById('lang-switcher');
if (langSwitcher) {
langSwitcher.addEventListener('change', function() {
// In a real app, this would redirect to the appropriate language version
alert('Language switched to: ' + this.value);
});
}
// Mobile menu toggle
const mobileMenuButton = document.getElementById('mobile-menu-button');
const mobileMenu = document.getElementById('mobile-menu');
if (mobileMenuButton && mobileMenu) {
mobileMenuButton.addEventListener('click', function() {
mobileMenu.classList.toggle('hidden');
});
}
});
function fetchFeaturedScholarships() {
// In a real app, this would fetch from your API
const scholarships = [
{
id: 1,
title: "Master's in Computer Science",
university: "ETH Zurich",
country: "Switzerland",
deadline: "2023-12-15",
category: "Computer Science"
},
{
id: 2,
title: "PhD in Mathematics",
university: "University of Oxford",
country: "UK",
deadline: "2024-01-10",
category: "Mathematics"
},
{
id: 3,
title: "Undergraduate Physics Program",
university: "University of Cape Town",
country: "South Africa",
deadline: "2023-11-30",
category: "Physics"
}
];
const container = document.getElementById('featured-scholarships');
if (!container) return;
container.innerHTML = scholarships.map(scholarship => `
<div class="scholarship-card bg-white rounded-xl shadow-md overflow-hidden fade-in">
<div class="p-6">
<div class="flex justify-between items-start mb-2">
<span class="bg-accent bg-opacity-20 text-primary text-xs px-2 py-1 rounded">${scholarship.category}</span>
<span class="text-xs text-gray-500">${formatDate(scholarship.deadline)}</span>
</div>
<h3 class="font-bold text-xl mb-2">${scholarship.title}</h3>
<p class="text-gray-600 mb-4">${scholarship.university}, ${scholarship.country}</p>
<a href="scholarship.html?id=${scholarship.id}" class="text-secondary font-semibold text-sm flex items-center gap-1">
View Details <i data-feather="arrow-right" class="w-4 h-4"></i>
</a>
</div>
</div>
`).join('');
feather.replace();
}
function formatDate(dateString) {
const options = { year: 'numeric', month: 'short', day: 'numeric' };
return new Date(dateString).toLocaleDateString('en-US', options);
} |