diff --git a/frontend/src/component/personalDashboard/FlagMetricsChart.tsx b/frontend/src/component/personalDashboard/FlagMetricsChart.tsx index 3e2b98eac97c..fa213ee548c9 100644 --- a/frontend/src/component/personalDashboard/FlagMetricsChart.tsx +++ b/frontend/src/component/personalDashboard/FlagMetricsChart.tsx @@ -141,11 +141,10 @@ const EnvironmentSelect: FC<{ ); }; -const ExposureAndSelectors = styled(Box)(({ theme }) => ({ +const MetricsSelectors = styled(Box)(({ theme }) => ({ display: 'flex', justifyContent: 'flex-end', gap: theme.spacing(2), - width: '100%', })); const ChartContainer = styled('div')(({ theme }) => ({ @@ -157,6 +156,14 @@ const ChartContainer = styled('div')(({ theme }) => ({ const StyledExposure = styled(FlagExposure)({ alignItems: 'center', + justifySelf: 'start', +}); + +const ExposureAndMetricsRow = styled('div')({ + display: 'flex', + flexFlow: 'row', + justifyContent: 'space-between', + width: '100%', }); export const FlagMetricsChart: FC<{ @@ -174,24 +181,26 @@ export const FlagMetricsChart: FC<{ return ( - + - {environment ? ( - + {environment ? ( + + ) : null} + - ) : null} - - + + {noData ? (