Your creative shortlist
Fallows
Keep promising lessons close while you decide what your needles are ready to explore next.
Your shortlist is ready for its first stitch.
Browse the catalog and select the track control on any course.
Browse catalog
`;
document.getElementById('site-footer').innerHTML = footerHTML;
// Tailwind script
const twScript = document.createElement('script');
twScript.src = 'https://cdn.tailwindcss.com';
twScript.onload = function() {
tailwind.config = { darkMode: 'class' };
const htmlElement = document.documentElement;
const themeBtn = document.getElementById('theme-toggle');
if (localStorage.getItem('radiantStitchTheme') === 'dark' || (!localStorage.getItem('radiantStitchTheme') && window.matchMedia('(prefers-color-scheme: dark)').matches)) {
htmlElement.classList.add('dark');
}
themeBtn.addEventListener('click', function() {
htmlElement.classList.toggle('dark');
localStorage.setItem('radiantStitchTheme', htmlElement.classList.contains('dark') ? 'dark' : 'light');
});
};
document.head.appendChild(twScript);
// Auth modal
const loginBtn = document.getElementById('login-open');
const regBtn = document.getElementById('register-open');
const modal = document.getElementById('auth-modal');
const closeBtn = document.getElementById('auth-close');
if (loginBtn) loginBtn.onclick = () => modal.showModal();
if (regBtn) regBtn.onclick = () => modal.showModal();
if (closeBtn) closeBtn.onclick = () => modal.close();
// Cookie banner
const cookieBanner = document.getElementById('cookie-banner');
const cookieClose = document.getElementById('cookie-close');
if (localStorage.getItem('radiantStitchCookies') === 'accepted') {
if (cookieBanner) cookieBanner.style.display = 'none';
}
if (cookieClose) cookieClose.addEventListener('click', function() {
localStorage.setItem('radiantStitchCookies', 'accepted');
if (cookieBanner) cookieBanner.style.display = 'none';
});
// Fallows logic
const grid = document.getElementById('tracked-grid');
const emptyState = document.getElementById('tracked-empty');
function renderFavorites(courses) {
const favorites = JSON.parse(localStorage.getItem('radiantStitchFavorites') || '[]');
const filtered = courses.filter(c => favorites.includes(c.id));
grid.innerHTML = '';
if (filtered.length === 0) {
emptyState.classList.remove('hidden');
} else {
emptyState.classList.add('hidden');
filtered.forEach(course => {
const card = document.createElement('div');
card.className = `radiant-card dd23l xk9h7 p2aql flex flex-col rounded-3xl border border-coral-200 bg-white p-6 dark:border-slate-700 dark:bg-slate-900`;
card.innerHTML = `
${course.level}
${course.title}
${course.description}
${course.duration} • ${course.lessons} lessons
`;
grid.appendChild(card);
});
document.querySelectorAll('.remove-btn').forEach(btn => {
btn.addEventListener('click', function() {
const id = parseInt(this.getAttribute('data-id'));
let favs = JSON.parse(localStorage.getItem('radiantStitchFavorites') || '[]');
favs = favs.filter(f => f !== id);
localStorage.setItem('radiantStitchFavorites', JSON.stringify(favs));
renderFavorites(courses);
});
});
}
}
fetch('./catalog.json')
.then(res => res.json())
.then(data => {
renderFavorites(data);
})
.catch(() => {
emptyState.classList.remove('hidden');
grid.innerHTML = '';
});
});