Mirrors/unleash.unleash
1
0
Fork 0
mirror of https://github.com/Unleash/unleash.git synced 2025-10-27 11:02:16 +01:00
Code Issues Projects Releases Wiki Activity

fix: Adjust meta data icons (#7026)

Browse Source
This commit is contained in:
Mateusz Kwasniewski 2024-05-10 11:46:32 +02:00 committed by GitHub
parent 8a2b977ac0
commit 60a67d4775
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 18 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/component/feature/FeatureView/FeatureEnvironmentSeen/FeatureEnvironmentSeen.tsx
View File

@ -17,7 +17,7 @@ interface IFeatureEnvironmentSeenProps {
const StyledContainer = styled('div')(({ theme }) => ({ const StyledContainer = styled('div')(({ theme }) => ({
display: 'flex', display: 'flex',
padding: theme.spacing(1.5), padding: theme.spacing(1),
})); }));
const StyledBox = styled(Box)(({ theme }) => ({ const StyledBox = styled(Box)(({ theme }) => ({

6
frontend/src/component/feature/FeatureView/FeatureOverview/FeatureOverviewMetaData/DependencyActions.tsx
View File

@ -11,6 +11,7 @@ import {
styled, styled,
Tooltip, Tooltip,
Typography, Typography,
Box,
} from '@mui/material'; } from '@mui/material';
import Delete from '@mui/icons-material/Delete'; import Delete from '@mui/icons-material/Delete';
import Edit from '@mui/icons-material/Edit'; import Edit from '@mui/icons-material/Edit';
@ -40,9 +41,10 @@ export const DependencyActions: FC<{
}; };
return ( return (
<span> <Box>
<Tooltip title='Dependency actions' arrow describeChild> <Tooltip title='Dependency actions' arrow describeChild>
<IconButton <IconButton
sx={{ mr: 0.25 }}
id={id} id={id}
aria-controls={open ? menuId : undefined} aria-controls={open ? menuId : undefined}
aria-haspopup='true' aria-haspopup='true'
@ -112,6 +114,6 @@ export const DependencyActions: FC<{
/> />
</MenuList> </MenuList>
</StyledPopover> </StyledPopover>
</span> </Box>
); );
}; };

28
frontend/src/component/feature/FeatureView/FeatureOverview/FeatureOverviewMetaData/FeatureOverviewMetaData.tsx
View File

@ -59,11 +59,9 @@ const StyledBody = styled('div')(({ theme }) => ({
fontSize: theme.fontSizes.smallBody, fontSize: theme.fontSizes.smallBody,
})); }));
const StyledBodyItem = styled('span')(({ theme }) => ({ const BodyItemWithIcon = styled('div')(({ theme }) => ({}));
padding: theme.spacing(0.5, 0),
}));
const StyledRow = styled('div')(({ theme }) => ({ const SpacedBodyItem = styled('div')(({ theme }) => ({
display: 'flex', display: 'flex',
justifyContent: 'space-between', justifyContent: 'space-between',
padding: theme.spacing(1, 0), padding: theme.spacing(1, 0),
@ -72,6 +70,7 @@ const StyledRow = styled('div')(({ theme }) => ({
const StyledDescriptionContainer = styled('div')(({ theme }) => ({ const StyledDescriptionContainer = styled('div')(({ theme }) => ({
display: 'flex', display: 'flex',
alignItems: 'center', alignItems: 'center',
justifyContent: 'space-between',
})); }));
const StyledDetailsContainer = styled('div')(({ theme }) => ({ const StyledDetailsContainer = styled('div')(({ theme }) => ({
@ -133,14 +132,14 @@ const FeatureOverviewMetaData = () => {
<StyledHeader>{capitalize(type || '')} toggle</StyledHeader> <StyledHeader>{capitalize(type || '')} toggle</StyledHeader>
</StyledMetaDataHeader> </StyledMetaDataHeader>
<StyledBody> <StyledBody>
<StyledRow data-loading> <SpacedBodyItem data-loading>
<StyledLabel>Project:</StyledLabel> <StyledLabel>Project:</StyledLabel>
<span>{project}</span> <span>{project}</span>
</StyledRow> </SpacedBodyItem>
<ConditionallyRender <ConditionallyRender
condition={featureLifecycleEnabled} condition={featureLifecycleEnabled}
show={ show={
<StyledRow data-loading> <SpacedBodyItem data-loading>
<StyledLabel>Lifecycle:</StyledLabel> <StyledLabel>Lifecycle:</StyledLabel>
<FeatureLifecycle <FeatureLifecycle
feature={feature} feature={feature}
@ -150,14 +149,14 @@ const FeatureOverviewMetaData = () => {
} }
onUncomplete={refetchFeature} onUncomplete={refetchFeature}
/> />
</StyledRow> </SpacedBodyItem>
} }
/> />
<ConditionallyRender <ConditionallyRender
condition={Boolean(description)} condition={Boolean(description)}
show={ show={
<StyledBodyItem data-loading> <BodyItemWithIcon data-loading sx={{ pt: 1 }}>
<StyledLabel>Description:</StyledLabel> <StyledLabel>Description:</StyledLabel>
<StyledDescriptionContainer> <StyledDescriptionContainer>
<StyledDescription> <StyledDescription>
@ -175,10 +174,10 @@ const FeatureOverviewMetaData = () => {
<Edit /> <Edit />
</PermissionIconButton> </PermissionIconButton>
</StyledDescriptionContainer> </StyledDescriptionContainer>
</StyledBodyItem> </BodyItemWithIcon>
} }
elseShow={ elseShow={
<span data-loading> <div data-loading>
<StyledDescriptionContainer> <StyledDescriptionContainer>
No description.{' '} No description.{' '}
<PermissionIconButton <PermissionIconButton
@ -193,10 +192,10 @@ const FeatureOverviewMetaData = () => {
<Edit /> <Edit />
</PermissionIconButton> </PermissionIconButton>
</StyledDescriptionContainer> </StyledDescriptionContainer>
</span> </div>
} }
/> />
<StyledBodyItem> <BodyItemWithIcon>
<StyledDetailsContainer> <StyledDetailsContainer>
<StyledDetail> <StyledDetail>
<StyledLabel>Created at:</StyledLabel> <StyledLabel>Created at:</StyledLabel>
@ -211,10 +210,9 @@ const FeatureOverviewMetaData = () => {
<FeatureEnvironmentSeen <FeatureEnvironmentSeen
featureLastSeen={feature.lastSeenAt} featureLastSeen={feature.lastSeenAt}
environments={lastSeenEnvironments} environments={lastSeenEnvironments}
sx={{ p: 0 }}
/> />
</StyledDetailsContainer> </StyledDetailsContainer>
</StyledBodyItem> </BodyItemWithIcon>
<ConditionallyRender <ConditionallyRender
condition={showDependentFeatures} condition={showDependentFeatures}
show={<DependencyRow feature={feature} />} show={<DependencyRow feature={feature} />}