minor fix

This commit is contained in:
aurinex
2025-12-14 22:22:05 +05:00
parent ae4a67dcdf
commit 645de4248e
2 changed files with 36 additions and 18 deletions

View File

@ -12,6 +12,19 @@
url('../../assets/fonts/benzin-bold.svg#benzin-bold') format('svg'); /* Chrome < 4, Legacy iOS */ url('../../assets/fonts/benzin-bold.svg#benzin-bold') format('svg'); /* Chrome < 4, Legacy iOS */
} }
:root {
--ui-scale: 1;
}
#root {
transform: scale(var(--ui-scale));
transform-origin: top left;
/* компенсация, чтобы после scale не появлялись пустые области/скроллы */
width: calc(100% / var(--ui-scale));
height: calc(100% / var(--ui-scale));
}
body { body {
position: relative; position: relative;
color: white; color: white;

View File

@ -157,8 +157,18 @@ const NotificationPositionPicker = ({
); );
}; };
const mapNotifPosition = (
p: SettingsState['notificationPosition'],
): NotificationPosition => {
const [vertical, horizontal] = p.split('-') as ['top' | 'bottom', 'left' | 'center' | 'right'];
return { vertical, horizontal };
};
const Settings = () => { const Settings = () => {
const [lastSavedSettings, setLastSavedSettings] = useState<SettingsState>(() => {
if (typeof window === 'undefined') return defaultSettings;
return safeParseSettings(localStorage.getItem(STORAGE_KEY)) ?? defaultSettings;
});
const [notifOpen, setNotifOpen] = useState(false); const [notifOpen, setNotifOpen] = useState(false);
const [notifMsg, setNotifMsg] = useState<React.ReactNode>(''); const [notifMsg, setNotifMsg] = useState<React.ReactNode>('');
const [notifSeverity, setNotifSeverity] = useState< const [notifSeverity, setNotifSeverity] = useState<
@ -176,22 +186,22 @@ const Settings = () => {
}); });
const dirty = useMemo(() => { const dirty = useMemo(() => {
if (typeof window === 'undefined') return false; return JSON.stringify(settings) !== JSON.stringify(lastSavedSettings);
const saved = safeParseSettings(localStorage.getItem(STORAGE_KEY)) ?? defaultSettings; }, [settings, lastSavedSettings]);
return JSON.stringify(saved) !== JSON.stringify(settings);
}, [settings]);
const save = () => { const save = () => {
try { try {
localStorage.setItem(STORAGE_KEY, JSON.stringify(settings)); localStorage.setItem(STORAGE_KEY, JSON.stringify(settings));
setLastSavedSettings(settings);
window.dispatchEvent(new CustomEvent('settings-updated')); window.dispatchEvent(new CustomEvent('settings-updated'));
// если уведомления выключены — НЕ показываем нотификацию // если уведомления выключены — НЕ показываем нотификацию
if (!isNotificationsEnabled()) return; if (!isNotificationsEnabled()) return;
setNotifMsg('Настройки успешно сохранены!'); setNotifMsg('Настройки успешно сохранены!');
setNotifSeverity('info'); setNotifSeverity('info');
setNotifPos(getNotifPositionFromSettings()); setNotifPos(mapNotifPosition(settings.notificationPosition));
setNotifOpen(true); setNotifOpen(true);
} catch (e) { } catch (e) {
console.error('Не удалось сохранить настройки', e); console.error('Не удалось сохранить настройки', e);
@ -200,6 +210,8 @@ const Settings = () => {
const reset = () => { const reset = () => {
setSettings(defaultSettings); setSettings(defaultSettings);
setLastSavedSettings(defaultSettings);
try { try {
localStorage.setItem(STORAGE_KEY, JSON.stringify(defaultSettings)); localStorage.setItem(STORAGE_KEY, JSON.stringify(defaultSettings));
} catch (e) { } catch (e) {
@ -208,28 +220,21 @@ const Settings = () => {
}; };
const checkNotif = () => { const checkNotif = () => {
if (!settings.notifications) return; // если выключены — не показываем
setNotifMsg('Проверка уведомления!'); setNotifMsg('Проверка уведомления!');
setNotifSeverity('info'); setNotifSeverity('info');
setNotifPos(getNotifPositionFromSettings()); setNotifPos(mapNotifPosition(settings.notificationPosition)); // 👈 важно
setNotifOpen(true); setNotifOpen(true);
} };
// Apply a few settings instantly
useEffect(() => { useEffect(() => {
if (typeof document === 'undefined') return; if (typeof document === 'undefined') return;
// UI scale (простая версия) const scale = settings.uiScale / 100;
document.documentElement.style.zoom = `${settings.uiScale}%`; document.documentElement.style.setProperty('--ui-scale', String(scale));
// Reduce motion
document.body.classList.toggle('reduce-motion', settings.reduceMotion); document.body.classList.toggle('reduce-motion', settings.reduceMotion);
// Blur effects (можно использовать этот класс в sx, если захочешь)
document.body.classList.toggle('no-blur', !settings.blurEffects); document.body.classList.toggle('no-blur', !settings.blurEffects);
// Persist
save();
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [settings.uiScale, settings.reduceMotion, settings.blurEffects]); }, [settings.uiScale, settings.reduceMotion, settings.blurEffects]);
const SectionTitle = ({ children }: { children: string }) => ( const SectionTitle = ({ children }: { children: string }) => (