1
0
mirror of https://github.com/Unleash/unleash.git synced 2025-11-10 01:19:53 +01:00

feat: start now button with background (#10897)

This commit is contained in:
Mateusz Kwasniewski 2025-10-31 12:24:56 +01:00 committed by GitHub
parent d721499bd4
commit 45fc547049
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 8 additions and 18 deletions

View File

@ -34,7 +34,7 @@ const StyledTimeContainer = styled('span')(({ theme }) => ({
borderRadius: theme.shape.borderRadiusLarge,
}));
const StyledIcon = styled(HourglassEmptyOutlinedIcon)(({ theme }) => ({
const StyledHourglassIcon = styled(HourglassEmptyOutlinedIcon)(({ theme }) => ({
fontSize: 18,
color: theme.palette.primary.main,
}));
@ -75,14 +75,12 @@ export const MilestoneNextStartTime = ({
activeMilestoneId,
);
const text = projectedStartTime
? `Starting ${formatSmartDate(projectedStartTime)}`
: 'Waiting to start';
if (!projectedStartTime) return null;
return (
<StyledTimeContainer>
<StyledIcon />
{text}
<StyledHourglassIcon />
{`Starting ${formatSmartDate(projectedStartTime)}`}
</StyledTimeContainer>
);
};

View File

@ -18,7 +18,9 @@ const StyledStatusButton = styled('button', {
paddingRight: theme.spacing(1),
cursor: 'pointer',
backgroundColor:
status === 'active' ? theme.palette.success.light : 'transparent',
status === 'active'
? theme.palette.success.light
: theme.palette.neutral.light,
'&:focus-visible': {
outline: `2px solid ${theme.palette.primary.main}`,
},
@ -41,10 +43,6 @@ const StyledStatusButton = styled('button', {
: status === 'paused'
? theme.palette.text.primary
: theme.palette.primary.main,
textDecoration:
status === 'not-started' || status === 'completed'
? 'underline'
: 'none',
'& svg': {
color:
status === 'active'
@ -105,12 +103,6 @@ export const ReleasePlanMilestoneStatus = ({
const statusIcon = getStatusIcon(status);
const disabled = status === 'active' || status === 'paused';
// Hide the play icon when progressions are enabled and milestone is not active/paused
const shouldShowIcon =
status === 'active' ||
status === 'paused' ||
!milestoneProgressionsEnabled;
return (
<StyledStatusButton
status={status}
@ -120,7 +112,7 @@ export const ReleasePlanMilestoneStatus = ({
}}
disabled={disabled}
>
{shouldShowIcon && statusIcon}
{statusIcon}
{statusText}
</StyledStatusButton>
);