fix(dashboardv2): table styling and form (#24493)

* fixed table header

* readd lineheight 1

Co-authored-by: Dora Chan <dora.lchan@gmail.com>

src/sentry/static/sentry/app/components/dashboards/widgetQueryFields.tsx

@@ -71,6 +71,7 @@ function WidgetQueryFields({displayType, errors, fields, fieldOptions, onChange}
         data-test-id="columns"
         label={t('Columns')}
         inline={false}
+        style={{padding: `8px 0`}}
         flexibleControlStateSize
         stacked
         error={errors?.fields}

src/sentry/static/sentry/app/components/panels/panelTable.tsx

@@ -161,6 +161,10 @@ export const PanelTableHeader = styled('div')`
   border-radius: ${p => p.theme.borderRadius} ${p => p.theme.borderRadius} 0 0;
   background: ${p => p.theme.backgroundSecondary};
   line-height: 1;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  min-height: 45px;
 `;
 
 export default PanelTable;

src/sentry/static/sentry/app/views/dashboardsV2/widgetCard.tsx

@@ -316,6 +316,7 @@ const MoreOptions = styled('span')`
 
 const DropdownTarget = styled('div')`
   display: flex;
+  cursor: pointer;
 `;
 
 const ContextWrapper = styled('div')`

src/sentry/static/sentry/app/views/dashboardsV2/widgetCardChart.tsx

@@ -372,11 +372,15 @@ const ChartWrapper = styled('div')`
 `;
 
 const StyledSimpleTableChart = styled(SimpleTableChart)`
-  /* align with other card charts */
-  height: 216px;
   margin-top: ${space(1.5)};
   border-bottom-left-radius: ${p => p.theme.borderRadius};
   border-bottom-right-radius: ${p => p.theme.borderRadius};
+  font-size: ${p => p.theme.fontSizeMedium};
+  box-shadow: none;
+
+  > div {
+    padding: ${space(1)} ${space(3)};
+  }
 `;
 
 export default withTheme(WidgetCardChart);