From a7960ecbb875e591589a3a662bac1a244a83641e Mon Sep 17 00:00:00 2001
From: Rohit <rohit.rajan031101@gmail.com>
Date: Tue, 18 Mar 2025 22:22:54 +0530
Subject: [PATCH] feat: add more height breakpoints

---
 src/helpers/dimensionUtils.ts | 67 ++++++++++++++++++++++++++---------
 1 file changed, 50 insertions(+), 17 deletions(-)

diff --git a/src/helpers/dimensionUtils.ts b/src/helpers/dimensionUtils.ts
index 13630729..73c600cf 100644
--- a/src/helpers/dimensionUtils.ts
+++ b/src/helpers/dimensionUtils.ts
@@ -9,12 +9,23 @@ export const WIDTH_BREAKPOINTS = {
 };
 
 export const HEIGHT_BREAKPOINTS = {
-  xs: 0,      
-  sm: 700,    
-  md: 800,    
-  lg: 900,    
-  xl: 1080,   
-  xxl: 1440   
+  xs: 0,
+  sm: 700,
+  md: 750,
+  lg: 800,
+  xl: 850,
+  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 {
@@ -34,18 +45,40 @@ export const getResponsiveDimensions = (): AppDimensions => {
   const browserWidth = windowWidth * 0.7;
   const outputPreviewWidth = windowWidth * 0.716;
   
-  let heightFraction = 0.64; 
+  let heightFraction = 0.62; 
   
-  if (windowHeight >= HEIGHT_BREAKPOINTS.xxl) {
-    heightFraction = 0.82; 
-  } else if (windowHeight >= HEIGHT_BREAKPOINTS.xl) {
-    heightFraction = 0.76; 
-  } else if (windowHeight >= HEIGHT_BREAKPOINTS.lg) {
-    heightFraction = 0.71; 
-  } else if (windowHeight >= HEIGHT_BREAKPOINTS.md) {
-    heightFraction = 0.64; 
-  } else if (windowHeight >= HEIGHT_BREAKPOINTS.sm) {
-    heightFraction = 0.62; 
+  if (windowHeight >= HEIGHT_BREAKPOINTS.xxxxxxxxxxxxxl) { 
+    heightFraction = 0.82;
+  } else if (windowHeight >= HEIGHT_BREAKPOINTS.xxxxxxxxxxxxl) { 
+    heightFraction = 0.81;
+  } else if (windowHeight >= HEIGHT_BREAKPOINTS.xxxxxxxxxxxl) { 
+    heightFraction = 0.80;
+  } else if (windowHeight >= HEIGHT_BREAKPOINTS.xxxxxxxxxxl) { 
+    heightFraction = 0.79;
+  } else if (windowHeight >= HEIGHT_BREAKPOINTS.xxxxxxxxxl) { 
+    heightFraction = 0.78;
+  } else if (windowHeight >= HEIGHT_BREAKPOINTS.xxxxxxxxl) { 
+    heightFraction = 0.77;
+  } else if (windowHeight >= HEIGHT_BREAKPOINTS.xxxxxxxl) { 
+    heightFraction = 0.76;
+  } else if (windowHeight >= HEIGHT_BREAKPOINTS.xxxxxxl) { 
+    heightFraction = 0.75;
+  } else if (windowHeight >= HEIGHT_BREAKPOINTS.xxxxxl) { 
+    heightFraction = 0.74;
+  } else if (windowHeight >= HEIGHT_BREAKPOINTS.xxxxl) { 
+    heightFraction = 0.73;
+  } else if (windowHeight >= HEIGHT_BREAKPOINTS.xxxl) { 
+    heightFraction = 0.72;
+  } else if (windowHeight >= HEIGHT_BREAKPOINTS.xxl) { 
+    heightFraction = 0.71;
+  } else if (windowHeight >= HEIGHT_BREAKPOINTS.xl) { 
+    heightFraction = 0.70;
+  } else if (windowHeight >= HEIGHT_BREAKPOINTS.lg) { 
+    heightFraction = 0.68;
+  } else if (windowHeight >= HEIGHT_BREAKPOINTS.md) { 
+    heightFraction = 0.66;
+  } else if (windowHeight >= HEIGHT_BREAKPOINTS.sm) { 
+    heightFraction = 0.63;
   }
   
   const browserHeight = windowHeight * heightFraction;