ما التقنيات اللازمة لزر الوضع الداكن والفاتح؟

زر يبدّل الموقع بين الوضع الداكن والفاتح يحتاج الثلاثة معًا: HTML وCSS وJavaScript:

• HTML لإنشاء الزر.
• CSS لتعريف ألوان كل وضع.
• JavaScript للتبديل بين الوضعين عند النقر.

مثال بسيط

<button id="theme-toggle">Dark mode</button>

body { background: #fff; color: #111; }
body.dark { background: #111; color: #eee; }

document.getElementById('theme-toggle').addEventListener('click', () => {
  document.body.classList.toggle('dark');
});

ولتحسين التجربة، احفظ اختيار الزائر في localStorage حتى يبقى في زيارته القادمة.