57 lines
1.3 KiB
TypeScript
57 lines
1.3 KiB
TypeScript
import Box from '@mui/material/Box'
|
||
import { useTheme } from '@mui/material/styles'
|
||
import { IS_DEMO_MODE } from '@/shared/config'
|
||
|
||
export function DemoOverlay() {
|
||
const theme = useTheme()
|
||
const isDark = theme.palette.mode === 'dark'
|
||
|
||
if (!IS_DEMO_MODE) return null
|
||
|
||
return (
|
||
<>
|
||
<Box
|
||
aria-hidden="true"
|
||
sx={{
|
||
position: 'fixed',
|
||
inset: 0,
|
||
display: 'flex',
|
||
alignItems: 'center',
|
||
justifyContent: 'center',
|
||
pointerEvents: 'none',
|
||
zIndex: 9990,
|
||
fontSize: '10vw',
|
||
fontWeight: 900,
|
||
color: isDark ? 'rgba(255,255,255,0.04)' : 'rgba(0,0,0,0.04)',
|
||
transform: 'rotate(-30deg)',
|
||
userSelect: 'none',
|
||
}}
|
||
>
|
||
ДЕМО
|
||
</Box>
|
||
|
||
<Box
|
||
aria-hidden="true"
|
||
sx={{
|
||
position: 'fixed',
|
||
bottom: 16,
|
||
right: 16,
|
||
pointerEvents: 'none',
|
||
zIndex: 9991,
|
||
px: 2,
|
||
py: 0.75,
|
||
borderRadius: 1,
|
||
fontSize: 12,
|
||
fontWeight: 600,
|
||
letterSpacing: '0.04em',
|
||
color: isDark ? 'rgba(255,255,255,0.6)' : '#fff',
|
||
bgcolor: isDark ? 'rgba(255,255,255,0.08)' : 'rgba(0,0,0,0.6)',
|
||
userSelect: 'none',
|
||
}}
|
||
>
|
||
ДЕМО-РЕЖИМ
|
||
</Box>
|
||
</>
|
||
)
|
||
}
|