Fix styling on dropdowns

2020-11-16 16:14:19 -05:00
parent 4040d4fcb2
commit 885526474e
2 changed files with 11 additions and 9 deletions
@@ -192,21 +192,24 @@ export const CostInsightsPage = () => {
      px={3}
      marginTop={10}
      display="flex"
-      flexDirection="row"
      justifyContent="space-between"
+      alignItems="center"
+      minHeight={40}
    >
-      <Box minHeight={40} width="75%" pt={2}>
+      <Box>
        <Typography variant="h4">Cost Overview</Typography>
        <Typography classes={classes}>
          Billing data as of {lastCompleteBillingDate}
        </Typography>
      </Box>
-      <Box minHeight={40} maxHeight={60} display="flex">
-        <CurrencySelect
-          currency={currency}
-          currencies={config.currencies}
-          onSelect={setCurrency}
-        />
+      <Box display="flex">
+        <Box mr={1}>
+          <CurrencySelect
+            currency={currency}
+            currencies={config.currencies}
+            onSelect={setCurrency}
+          />
+        </Box>
        <ProjectSelect
          project={pageFilters.project}
          projects={projects || []}
@@ -57,7 +57,6 @@ export const CurrencySelect = ({
      onChange={handleOnChange}
      value={currency.kind || NULL_VALUE}
      renderValue={renderValue}
-      style={{ marginRight: '15px' }}
    >
      {currencies.map((c: Currency) => (
        <MenuItem