vodorod/parcer
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #484 from getmaxun/resize-fix

Browse Source 
fix: remote browser height sizing
This commit is contained in:
Karishma Shukla
2025-03-20 03:18:27 +05:30
committed by GitHub
parent f3f9346789 b10e00f803
commit 52fa4a0049
1 changed files with 38 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

57
src/helpers/dimensionUtils.ts
View File

@@ -9,12 +9,23 @@ export const WIDTH_BREAKPOINTS = {
}; };
export const HEIGHT_BREAKPOINTS = { export const HEIGHT_BREAKPOINTS = {
xs: 0, xs: 0,
sm: 700, sm: 700,
md: 800, md: 750,
lg: 900, lg: 800,
xl: 1080, xl: 850,
xxl: 1440 xxl: 900,
xxxl: 950,
xxxxl: 1000,
xxxxxl: 1050,
xxxxxxl: 1100,
xxxxxxxl: 1150,
xxxxxxxxl: 1200,
xxxxxxxxxl: 1250,
xxxxxxxxxxl: 1300,
xxxxxxxxxxxl: 1350,
xxxxxxxxxxxxl: 1400,
xxxxxxxxxxxxxl: 1440
}; };
export interface AppDimensions { export interface AppDimensions {
@@ -34,19 +45,27 @@ export const getResponsiveDimensions = (): AppDimensions => {
const browserWidth = windowWidth * 0.7; const browserWidth = windowWidth * 0.7;
const outputPreviewWidth = windowWidth * 0.716; const outputPreviewWidth = windowWidth * 0.716;
let heightFraction = 0.64; const heightBreakpoints = [
{ height: HEIGHT_BREAKPOINTS.xxxxxxxxxxxxxl, fraction: 0.82 },
if (windowHeight >= HEIGHT_BREAKPOINTS.xxl) { { height: HEIGHT_BREAKPOINTS.xxxxxxxxxxxxl, fraction: 0.81 },
heightFraction = 0.82; { height: HEIGHT_BREAKPOINTS.xxxxxxxxxxxl, fraction: 0.80 },
} else if (windowHeight >= HEIGHT_BREAKPOINTS.xl) { { height: HEIGHT_BREAKPOINTS.xxxxxxxxxxl, fraction: 0.79 },
heightFraction = 0.76; { height: HEIGHT_BREAKPOINTS.xxxxxxxxxl, fraction: 0.78 },
} else if (windowHeight >= HEIGHT_BREAKPOINTS.lg) { { height: HEIGHT_BREAKPOINTS.xxxxxxxxl, fraction: 0.77 },
heightFraction = 0.71; { height: HEIGHT_BREAKPOINTS.xxxxxxxl, fraction: 0.76 },
} else if (windowHeight >= HEIGHT_BREAKPOINTS.md) { { height: HEIGHT_BREAKPOINTS.xxxxxxl, fraction: 0.75 },
heightFraction = 0.64; { height: HEIGHT_BREAKPOINTS.xxxxxl, fraction: 0.74 },
} else if (windowHeight >= HEIGHT_BREAKPOINTS.sm) { { height: HEIGHT_BREAKPOINTS.xxxxl, fraction: 0.73 },
heightFraction = 0.62; { height: HEIGHT_BREAKPOINTS.xxxl, fraction: 0.72 },
} { height: HEIGHT_BREAKPOINTS.xxl, fraction: 0.71 },
{ height: HEIGHT_BREAKPOINTS.xl, fraction: 0.70 },
{ height: HEIGHT_BREAKPOINTS.lg, fraction: 0.68 },
{ height: HEIGHT_BREAKPOINTS.md, fraction: 0.66 },
{ height: HEIGHT_BREAKPOINTS.sm, fraction: 0.63 },
{ height: 0, fraction: 0.62 }
];
const heightFraction = heightBreakpoints.find(bp => windowHeight >= bp.height)?.fraction ?? 0.62;
const browserHeight = windowHeight * heightFraction; const browserHeight = windowHeight * heightFraction;