From fa7e8a6b371ad7373d35878fe371f710ddba5eff Mon Sep 17 00:00:00 2001 From: Daniel Kohli Date: Mon, 25 Oct 2021 14:12:12 -0700 Subject: [PATCH] Add max-width Style Prop to Tabs.tsx Summary: - We're using the `Tabs` component from `flipper-plugin` and upon adding them, we noticed that our view being displayed within the tabs no longer scrolled and the tab internally was being stretched far off the screen. (D31538124) - After egp did some digging, he discovered that by adding the `maxWidth` style property to the inner `Layout.Container`, the tab no longer stretched and the scrolling was restored. - We played around by adding wrapper elements around the contents of our Tab and adding the same style prop, but this did not yield the same result. ***Would Love some input from the Flipper team as to the best way to ensure that this won't break other's plugins. Thank you!*** Reviewed By: mweststrate Differential Revision: D31672790 fbshipit-source-id: 99cab1873f359f4c1827e4c94f2527636884c237 --- desktop/flipper-plugin/src/ui/Tabs.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/desktop/flipper-plugin/src/ui/Tabs.tsx b/desktop/flipper-plugin/src/ui/Tabs.tsx index 34e3953b4..e0ac7b90a 100644 --- a/desktop/flipper-plugin/src/ui/Tabs.tsx +++ b/desktop/flipper-plugin/src/ui/Tabs.tsx @@ -72,7 +72,7 @@ export const Tab: React.FC< > = function Tab({pad, gap, children, ...baseProps}) { return ( - + {children}