From ed2bcea906e82b4b90aaca52f4d00bb336bddef1 Mon Sep 17 00:00:00 2001
From: Michel Weststrate <mweststrate@fb.com>
Date: Thu, 21 May 2020 03:34:05 -0700
Subject: [PATCH] Fix horizontal scrolling issue

Summary: Fixed a layout issue in the list items of GraphQL, background style / line didn't tend to continue when scrolling, because flexbox doesn't grow all lines similarly. Tables do.

Reviewed By: jonathoma

Differential Revision: D21662000

fbshipit-source-id: 767d2d7ffd7e5dacf2c49aa67babbb47a331282c
---
 desktop/app/src/ui/components/Scrollable.tsx | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/desktop/app/src/ui/components/Scrollable.tsx b/desktop/app/src/ui/components/Scrollable.tsx
index d7157f352..3a0248b5c 100644
--- a/desktop/app/src/ui/components/Scrollable.tsx
+++ b/desktop/app/src/ui/components/Scrollable.tsx
@@ -9,12 +9,16 @@
 
 import React from 'react';
 import styled from '@emotion/styled';
+import {BackgroundProperty} from 'csstype';
 
-const Scrollable: React.FC<{children: React.ReactNode}> = styled('div')({
+type Props = {children: React.ReactNode; background?: BackgroundProperty<any>};
+
+const Scrollable: React.FC<Props> = styled('div')<Props>(({background}) => ({
   width: '100%',
   height: '100%',
   overflow: 'auto',
-});
+  background,
+}));
 Scrollable.displayName = 'Scrollable';
 
 export default Scrollable;