shot1 and shot2 added

shot-2/js/theme.js

@@ -0,0 +1,57 @@
+// Theme switching functionality
+document.addEventListener('DOMContentLoaded', () => {
+    const themeToggle = document.getElementById('theme-toggle');
+    const body = document.body;
+    const DARK_THEME = 'dark-theme';
+    const LIGHT_THEME = 'light-theme';
+    const THEME_KEY = '7sys-theme-preference';
+
+    // Initialize stars background
+    createStars();
+
+    // Load saved theme preference
+    const savedTheme = localStorage.getItem(THEME_KEY);
+    if (savedTheme) {
+        body.className = savedTheme;
+    }
+
+    // Theme toggle handler
+    themeToggle.addEventListener('click', () => {
+        const newTheme = body.classList.contains(DARK_THEME) ? LIGHT_THEME : DARK_THEME;
+        body.className = newTheme;
+        localStorage.setItem(THEME_KEY, newTheme);
+    });
+
+    // Create animated stars background
+    function createStars() {
+        const starsContainer = document.querySelector('.stars-background');
+        const STARS_COUNT = 50;
+
+        for (let i = 0; i < STARS_COUNT; i++) {
+            const star = document.createElement('div');
+            star.className = 'star';
+            star.style.cssText = `
+                position: absolute;
+                width: ${Math.random() * 3}px;
+                height: ${Math.random() * 3}px;
+                background: ${body.classList.contains(DARK_THEME) ? '#fff' : '#1a365d'};
+                left: ${Math.random() * 100}%;
+                top: ${Math.random() * 100}%;
+                opacity: ${Math.random()};
+                border-radius: 50%;
+                animation: twinkle ${2 + Math.random() * 3}s infinite ease-in-out;
+            `;
+            starsContainer.appendChild(star);
+        }
+    }
+
+    // Add twinkling animation to stylesheet
+    const style = document.createElement('style');
+    style.textContent = `
+        @keyframes twinkle {
+            0%, 100% { opacity: 0.2; }
+            50% { opacity: 1; }
+        }
+    `;
+    document.head.appendChild(style);
+});