style: various little tweaks to home screen stylin' (apache#11650)

* adding bottom padding * making light gray backgrounds match * vertical centering of empty state content. * linting ✨ * fixing card radii * fixing corner radius... thumb was covering corner border.
auxten · Nov 20, 2020 · fac2368 · fac2368
1 parent 3d3dbb2
commit fac2368
Show file tree

Hide file tree

Showing 4 changed files with 8 additions and 3 deletions.
diff --git a/superset-frontend/src/components/ListViewCard/index.tsx b/superset-frontend/src/components/ListViewCard/index.tsx
@@ -37,6 +37,8 @@ const ActionsWrapper = styled.div`
 
 const StyledCard = styled(Card)`
   border: 1px solid #d9dbe4;
+  border-radius: ${({ theme }) => theme.gridUnit}px;
+  overflow: hidden;
 
   .ant-card-body {
     padding: ${({ theme }) => theme.gridUnit * 4}px

diff --git a/superset-frontend/src/views/CRUD/welcome/ActivityTable.tsx b/superset-frontend/src/views/CRUD/welcome/ActivityTable.tsx
@@ -68,8 +68,8 @@ const ActivityContainer = styled.div`
   }
   grid-gap: ${({ theme }) => theme.gridUnit * 8}px;
   justify-content: left;
-  padding: ${({ theme }) => theme.gridUnit * 2}px
-    ${({ theme }) => theme.gridUnit * 4}px;
+  padding: ${({ theme }) => theme.gridUnit * 6}px;
+  padding-top: ${({ theme }) => theme.gridUnit * 2}px;
   .ant-card-meta-avatar {
     margin-top: ${({ theme }) => theme.gridUnit * 3}px;
     margin-left: ${({ theme }) => theme.gridUnit * 2}px;

diff --git a/superset-frontend/src/views/CRUD/welcome/EmptyState.tsx b/superset-frontend/src/views/CRUD/welcome/EmptyState.tsx
@@ -29,6 +29,9 @@ interface EmptyStateProps {
 }
 const EmptyContainer = styled.div`
   min-height: 200px;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-around;
 `;
 const ButtonContainer = styled.div`
   Button {

diff --git a/superset-frontend/stylesheets/less/variables.less b/superset-frontend/stylesheets/less/variables.less
@@ -49,7 +49,7 @@
 @gray-dark: #484848;
 @gray-light: #cfd8dc;
 @gray: #879399;
-@gray-bg: #f5f5f5;
+@gray-bg: #f7f7f7;
 @gray-heading: #a3a3a3;
 @menu-hover: #f2f3f5;
 @lightest: #ffffff;