Merge pull request #2424 from pyth-network/cprussin/ui-76-fix-feed-component-drawer-stretching-on-large-screens

cprussin · web-flow · commit 0570f8c402ad · 2025-02-26T21:55:26.000-08:00
fix(insights): fix feed component drawer stretching on large screens
diff --git a/apps/insights/src/components/PriceComponentDrawer/index.module.scss b/apps/insights/src/components/PriceComponentDrawer/index.module.scss
@@ -1,6 +1,11 @@
 @use "@pythnetwork/component-library/theme";
 
 .priceComponentDrawer {
+  .priceComponentDrawerBody {
+    grid-template-rows: max-content max-content;
+    grid-template-columns: 100%;
+  }
+
   .badges {
     @include theme.breakpoint("lg") {
       display: none;
diff --git a/apps/insights/src/components/PriceComponentDrawer/index.tsx b/apps/insights/src/components/PriceComponentDrawer/index.tsx
@@ -149,6 +149,7 @@ export const PriceComponentDrawer = ({
       }
       isOpen={isFeedDrawerOpen}
       className={styles.priceComponentDrawer ?? ""}
+      bodyClassName={styles.priceComponentDrawerBody ?? ""}
     >
       {cluster === Cluster.PythtestConformance && (
         <InfoBox

Original file line number	Diff line number	Diff line change
`@@ -149,6 +149,7 @@ export const PriceComponentDrawer = ({`
`149`	`149`	`}`
`150`	`150`	`isOpen={isFeedDrawerOpen}`
`151`	`151`	`className={styles.priceComponentDrawer ?? ""}`
	`152`	`+ bodyClassName={styles.priceComponentDrawerBody ?? ""}`
`152`	`153`	`>`
`153`	`154`	`{cluster === Cluster.PythtestConformance && (`
`154`	`155`	`<InfoBox`