Mirrors/unleash.unleash
1
0
Fork 0
mirror of https://github.com/Unleash/unleash.git synced 2025-01-25 00:07:47 +01:00
Code Issues Projects Releases Wiki Activity

fix: insights health info link placement (#7750)

Browse Source 
Fixing link placement on smaller screens.
This commit is contained in:
Tymoteusz Czech 2024-08-05 10:39:48 +02:00 committed by GitHub
parent afa34867c1
commit 11612931b9
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 11 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
frontend/src/component/insights/componentsStat/HealthStats/HealthStats.tsx
View File

@ -10,6 +10,13 @@ interface IHealthStatsProps {
title?: ReactNode;
}
const StyledContainer = styled(Box)(({ theme }) => ({
position: 'relative',
display: 'flex',
flexDirection: 'column',
height: '100%',
}));
const StyledStatsRow = styled(Box)(({ theme }) => ({
display: 'flex',
alignItems: 'center',
@ -19,6 +26,7 @@ const StyledStatsRow = styled(Box)(({ theme }) => ({
const ExplanationRow = styled(StyledStatsRow)(({ theme }) => ({
flex: 1,
justifyContent: 'flex-end',
alignItems: 'flex-end',
}));
const StyledIcon = styled(InstanceHealthIcon)(({ theme }) => ({
@ -40,7 +48,7 @@ const StyledSection = styled('div')(({ theme }) => ({
}));
const FlagsSection = styled(StyledSection)(({ theme }) => ({
height: '100%',
flexGrow: 1,
display: 'flex',
flexDirection: 'column',
}));
@ -62,7 +70,7 @@ export const HealthStats: FC<IHealthStatsProps> = ({
potentiallyStale,
title,
}) => (
<div>
<StyledContainer>
<StyledHeader>
<StyledSection>{title}</StyledSection>
<StyledSection>{/* TODO: trend */}</StyledSection>
@ -99,5 +107,5 @@ export const HealthStats: FC<IHealthStatsProps> = ({
</Link>
</ExplanationRow>
</FlagsSection>
</div>
</StyledContainer>
);