https://event-fungames.netlify.app/a11y-boot.js

1// Setzt die Accessibility-/Theme-Klassen VOR dem ersten Paint.
2// Ohne dieses Skript würden die Einstellungen erst im useEffect des
3// AccessibilityWidgets greifen – Dark Mode, große Schrift und OpenDyslexic
4// blitzen dann kurz im Standard-Look auf (FOUC).
5//
6// Externes same-origin-Skript (CSP 'self'), bewusst kein inline-Script.
7// Muss synchron im <head> stehen und die gleichen Klassen setzen wie
8// applySettings() in src/components/ui/AccessibilityWidget.tsx.
9(function () {
10  var root = document.documentElement;
11  var s = {};
12  try {
13    s = JSON.parse(localStorage.getItem('accessibility-settings') || '{}') || {};
14  } catch (e) {
15    s = {};
16  }
17
18  var fontSize = s.fontSize;
19  if (fontSize === 'small' || fontSize === 'large' || fontSize === 'xlarge') {
20    root.classList.add('text-' + fontSize);
21  }
22
23  if (s.contrastMode === 'high') root.classList.add('contrast-high');
24  if (s.reduceMotion) root.classList.add('reduce-motion');
25  if (s.highlightLinks) root.classList.add('highlight-links');
26  if (s.readableFont) root.classList.add('readable-font');
27
28  var scheme = s.colorScheme;
29  if (scheme !== 'light' && scheme !== 'dark') {
30    scheme =
31      window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches
32        ? 'dark'
33        : 'light';
34  }
35  root.classList.add('theme-' + scheme);
36  root.style.colorScheme = scheme;
37})();