[superset] 04/04: tweak layout

[su...@apache.org]

This is an automated email from the ASF dual-hosted git repository.

suddjian pushed a commit to branch viz-picker-categories
in repository https://gitbox.apache.org/repos/asf/superset.git

commit aecd0dbc04da5096064c0710801316cfdf619b21
Author: David Aaron Suddjian <aa...@gmail.com>
AuthorDate: Fri Jun 18 10:32:14 2021 -0700

    tweak layout
---
 .../explore/components/controls/VizTypeControl/index.tsx    | 13 ++++++++++---
 1 file changed, 10 insertions(+), 3 deletions(-)

diff --git a/superset-frontend/src/explore/components/controls/VizTypeControl/index.tsx b/superset-frontend/src/explore/components/controls/VizTypeControl/index.tsx
index 103ecac..5ced0ba 100644
--- a/superset-frontend/src/explore/components/controls/VizTypeControl/index.tsx
+++ b/superset-frontend/src/explore/components/controls/VizTypeControl/index.tsx
@@ -142,7 +142,7 @@ const UnpaddedModal = styled(Modal)`
 
 const VizPickerLayout = styled.div`
   display: grid;
-  grid-template-rows: auto auto 30%;
+  grid-template-rows: auto 1fr 30%;
   height: 70vh;
 `;
 
@@ -206,6 +206,13 @@ const CategoriesTabs = styled(Tabs)`
 const DetailsPane = styled.div`
   border-top: 1px solid ${({ theme }) => theme.colors.grayscale.light2};
   padding: ${({ theme }) => theme.gridUnit * 4}px;
+  display: grid;
+  grid-template-rows: auto 1fr;
+  overflow: hidden;
+`;
+
+const Description = styled.p`
+  overflow: auto;
 `;
 
 const SearchPane = styled.div`
@@ -387,10 +394,10 @@ const VizTypeControl = (props: VizTypeControlProps) => {
           </CategoriesTabs>
           <DetailsPane>
             <SectionTitle>{selectedVizMetadata?.name}</SectionTitle>
-            <p>
+            <Description>
               {selectedVizMetadata?.description ||
                 t('No description available.')}
-            </p>
+            </Description>
           </DetailsPane>
         </VizPickerLayout>
       </UnpaddedModal>