diff options
| author | Cλctys <git@cactys.dev> | 2023-12-01 01:14:36 +0100 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2023-11-30 16:14:36 -0800 |
| commit | 5839d2a30ca19499617190970e7a6376f3724df5 (patch) | |
| tree | 4e2bb2296f1174bd5bd2e891d4c5759a73b96661 /src/lib/hooks/useWebMediaQueries.tsx | |
| parent | 85b2b390df579d718ae061f53f7853a18bc0ca65 (diff) | |
| download | voidsky-5839d2a30ca19499617190970e7a6376f3724df5.tar.zst | |
Fix scuffed web styles caused by overlapping viewport breakpoint boundaries (#1985)
* fixed lack of styles on 1300px web viewport width by adjusting tablet breakpoints * fixed lack of styles on 800px web viewport width by adjusting mobile breakpoints * changed `maxWidth` values in viewports to `n - 1` format
Diffstat (limited to 'src/lib/hooks/useWebMediaQueries.tsx')
| -rw-r--r-- | src/lib/hooks/useWebMediaQueries.tsx | 4 |
1 files changed, 2 insertions, 2 deletions
diff --git a/src/lib/hooks/useWebMediaQueries.tsx b/src/lib/hooks/useWebMediaQueries.tsx index 3f43a0aaf..71a96a89b 100644 --- a/src/lib/hooks/useWebMediaQueries.tsx +++ b/src/lib/hooks/useWebMediaQueries.tsx @@ -3,8 +3,8 @@ import {isNative} from 'platform/detection' export function useWebMediaQueries() { const isDesktop = useMediaQuery({minWidth: 1300}) - const isTablet = useMediaQuery({minWidth: 800, maxWidth: 1300}) - const isMobile = useMediaQuery({maxWidth: 800}) + const isTablet = useMediaQuery({minWidth: 800, maxWidth: 1300 - 1}) + const isMobile = useMediaQuery({maxWidth: 800 - 1}) const isTabletOrMobile = isMobile || isTablet const isTabletOrDesktop = isDesktop || isTablet if (isNative) { |