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:
parent
d721499bd4
commit
45fc547049
@ -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>
|
||||
);
|
||||
};
|
||||
|
||||
@ -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>
|
||||
);
|
||||
|
||||
Loading…
Reference in New Issue
Block a user