minor fix
This commit is contained in:
@ -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;
|
||||||
|
|||||||
@ -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 }) => (
|
||||||
|
|||||||
Reference in New Issue
Block a user