Hugging Face's logo

Spaces:
uitestng
/
modern-redesign
Running

App Files Community
modern-redesign
File size: 3,484 Bytes 
32c7050
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
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
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
 
(function () {
  const prefersDark = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;
  const stored = localStorage.getItem('theme'); // 'light' | 'dark'
  const theme = stored || (prefersDark ? 'dark' : 'light');
  applyTheme(theme);

  // Elements
  const mobileMenuBtn = document.getElementById('mobile-menu-button');
  const mobileMenu = document.getElementById('mobile-menu');
  const themeToggle = document.getElementById('theme-toggle');
  const themeIcon = document.getElementById('theme-icon');
  const themeToggleMobile = document.getElementById('theme-toggle-mobile');
  const themeIconMobile = document.getElementById('theme-icon-mobile');
  const yearEl = document.getElementById('year');
  const contactForm = document.getElementById('contact-form');
  const toast = document.getElementById('toast-content');
  const toastClose = document.getElementById('toast-close');

  // Set current year
  if (yearEl) yearEl.textContent = new Date().getFullYear();

  // Mobile menu toggle
  if (mobileMenuBtn && mobileMenu) {
    mobileMenuBtn.addEventListener('click', () => {
      const isOpen = !mobileMenu.classList.contains('hidden');
      mobileMenu.classList.toggle('hidden', isOpen);
      mobileMenuBtn.setAttribute('aria-expanded', String(!isOpen));
      // Change icon between menu and x
      const icon = mobileMenuBtn.querySelector('i');
      if (icon) {
        icon.setAttribute('data-feather', isOpen ? 'menu' : 'x');
        if (window.feather) feather.replace();
      }
    });

    // Close on link click
    mobileMenu.querySelectorAll('a').forEach((a) => {
      a.addEventListener('click', () => {
        mobileMenu.classList.add('hidden');
        mobileMenuBtn.setAttribute('aria-expanded', 'false');
        const icon = mobileMenuBtn.querySelector('i');
        if (icon) {
          icon.setAttribute('data-feather', 'menu');
          if (window.feather) feather.replace();
        }
      });
    });
  }

  // Theme toggle handlers
  function setIcon(mode) {
    if (themeIcon) themeIcon.setAttribute('data-feather', mode === 'dark' ? 'moon' : 'sun');
    if (themeIconMobile) themeIconMobile.setAttribute('data-feather', mode === 'dark' ? 'moon' : 'sun');
    if (window.feather) feather.replace();
  }

  function applyTheme(mode) {
    document.documentElement.classList.toggle('dark', mode === 'dark');
    localStorage.setItem('theme', mode);
    setIcon(mode);
  }

  function toggleTheme() {
    const next = document.documentElement.classList.contains('dark') ? 'light' : 'dark';
    applyTheme(next);
  }

  if (themeToggle) themeToggle.addEventListener('click', toggleTheme);
  if (themeToggleMobile) themeToggleMobile.addEventListener('click', toggleTheme);

  // Contact form handler (demo)
  if (contactForm) {
    contactForm.addEventListener('submit', (e) => {
      e.preventDefault();
      showToast('Message sent! We’ll get back to you shortly.');
      contactForm.reset();
    });
  }

  if (toastClose) {
    toastClose.addEventListener('click', hideToast);
  }

  function showToast(message) {
    if (!toast) return;
    const text = toast.querySelector('.font-semibold');
    if (text) text.textContent = message || 'Done';
    toast.classList.remove('hidden');
    toast.classList.add('show');
    setTimeout(hideToast, 3500);
  }

  function hideToast() {
    if (!toast) return;
    toast.classList.remove('show');
    setTimeout(() => toast.classList.add('hidden'), 200);
  }
})();