diff --git a/front/src/App.tsx b/front/src/App.tsx index 63b7370..5a221c0 100644 --- a/front/src/App.tsx +++ b/front/src/App.tsx @@ -1,5 +1,3 @@ -import { useEffect } from 'react'; - import { ErrorBoundary } from '@/errors/ErrorBoundary'; import { AudioPlayer } from './components'; @@ -8,19 +6,6 @@ import { AppRoutes } from './scene/AppRoutes'; import { ServiceContextProvider } from './service/ServiceContext'; export const App = () => { - // Prevent reload the page when scroll on mobile - useEffect(() => { - const preventRefresh = (event: { preventDefault: () => void }) => { - if (window.scrollY === 0) { - event.preventDefault(); - } - }; - document.addEventListener('touchmove', preventRefresh, { passive: false }); - return () => { - document.removeEventListener('touchmove', preventRefresh); - }; - }, []); - return ( diff --git a/front/src/theme/theme.ts b/front/src/theme/theme.ts index 44ae56c..bfa57e5 100644 --- a/front/src/theme/theme.ts +++ b/front/src/theme/theme.ts @@ -9,12 +9,20 @@ import { colors } from './colors'; const baseTheme: SystemConfig = { globalCss: { + ':root': { + // permit to "firefox" not reload the page when scroll on top + overscrollBehavior: 'contain', + }, body: { + // permit to "chromium" not reload the page when scroll on top + overscrollBehavior: 'contain', + // Prevents text selection + userSelect: 'none', + // Other ... overflowY: 'none', bg: { _light: 'back.50', _dark: 'back.700' }, color: { _light: 'text.900', _dark: 'text.50' }, fontFamily: 'Roboto, Helvetica, Arial, "sans-serif"', - userSelect: 'none' /* Prevents text selection */, }, svg: { width: '32px',