educational variant

edu/script.js

@@ -0,0 +1,65 @@
+document.addEventListener('DOMContentLoaded', () => {
+    // --- Tip of the Day Logic ---
+    const tips = [
+        "Spaced repetition is a learning technique that incorporates increasing intervals of time between subsequent review of previously learned material.",
+        "The Pomodoro Technique uses a timer to break down work into intervals, traditionally 25 minutes in length, separated by short breaks.",
+        "Teaching someone else is one of the best ways to learn a new concept (The Feynman Technique).",
+        "Sleep is crucial for memory consolidation. Pulling an all-nighter is often counterproductive.",
+        "Active recall (testing yourself) is far more effective than passive re-reading.",
+        "Interleaving practice (mixing different subjects or topics) improves long-term retention compared to blocked practice.",
+        "Exercise increases blood flow to the brain and can improve cognitive performance.",
+        "Setting specific, measurable goals (SMART goals) helps maintain motivation.",
+        "Taking handwritten notes can improve conceptual understanding better than typing.",
+        "Mnemonic devices like acronyms or rhymes can help encode information into long-term memory."
+    ];
+
+    const tipElement = document.getElementById('daily-tip');
+    const newTipBtn = document.getElementById('new-tip-btn');
+
+    function showRandomTip() {
+        const randomIndex = Math.floor(Math.random() * tips.length);
+        tipElement.textContent = tips[randomIndex];
+        
+        // Add a subtle animation effect
+        tipElement.style.opacity = 0;
+        setTimeout(() => {
+            tipElement.style.opacity = 1;
+        }, 50);
+    }
+
+    if (newTipBtn) {
+        newTipBtn.addEventListener('click', showRandomTip);
+    }
+    
+    // Show initial tip
+    if (tipElement) {
+        showRandomTip();
+        tipElement.style.transition = "opacity 0.5s ease-in-out";
+    }
+
+
+    // --- Filtering Logic ---
+    const filterBtns = document.querySelectorAll('.filter-btn');
+    const cards = document.querySelectorAll('.card');
+
+    filterBtns.forEach(btn => {
+        btn.addEventListener('click', () => {
+            // Remove active class from all buttons
+            filterBtns.forEach(b => b.classList.remove('active'));
+            // Add active class to clicked button
+            btn.classList.add('active');
+
+            const filterValue = btn.getAttribute('data-filter');
+
+            cards.forEach(card => {
+                if (filterValue === 'all' || card.getAttribute('data-category') === filterValue) {
+                    card.style.display = 'flex';
+                    // Add animation for appearing elements
+                    card.style.animation = 'fadeIn 0.5s ease-in-out';
+                } else {
+                    card.style.display = 'none';
+                }
+            });
+        });
+    });
+});