fix chart expansion bg color

CrocSwap · Sep 18, 2024 · 511e87b · 511e87b
1 parent 1c73d3f
commit 511e87b
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 4 deletions.
diff --git a/src/pages/platformAmbient/Trade/TradeCharts/TradeCharts.tsx b/src/pages/platformAmbient/Trade/TradeCharts/TradeCharts.tsx
@@ -103,6 +103,10 @@ function TradeCharts(props: propsIF) {
     const { pathname } = useLocation();
     const smallScreen = useMediaQuery('(max-width: 768px)');
 
+    const isFuta = ['futa'].includes(platformName)
+
+
+
     const isMarketOrLimitModule =
         pathname.includes('market') || pathname.includes('limit');
 
@@ -295,7 +299,7 @@ function TradeCharts(props: propsIF) {
                     />
                 </div>
             )}
-            {!['futa'].includes(platformName) && (
+            {!isFuta && (
                 <div className={styles.mobile_settings_row}>
                     <p className={styles.mobile_settings_header}>Curve/Depth:</p>
                     <CurveDepth overlayMethods={chartSettings.poolOverlay} />
@@ -338,10 +342,10 @@ function TradeCharts(props: propsIF) {
                 fullWidth
                 style={{
                     padding:
-                        isChartFullScreen || ['futa'].includes(platformName)
+                        isChartFullScreen || isFuta
                             ? '1rem'
                             : '0',
-                    background: isChartFullScreen ? 'var(--dark2)' : '',
+                    background: isChartFullScreen ? isFuta ? 'var(--dark1)' : 'var(--dark2)' : '',
                 }}
                 ref={chartCanvasRef}
             >

diff --git a/src/styled/Components/Trade.ts b/src/styled/Components/Trade.ts
@@ -55,7 +55,7 @@ export const ResizableContainer = styled(Resizable)<{
     align-items: center;
     overflow: hidden;
   
-    max-height: ${({ isFuta }) => (isFuta ? '100%' : 'calc(100% - 54px)')};
+    max-height: ${({ isFuta }) => (isFuta ? 'calc(100% - 5px)' : 'calc(100% - 54px)')};
     min-height: 0px;
   
     ${({ showResizeable }) =>