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

refactor: minor ui improvements

This commit is contained in:
FredrikOseberg 2025-10-23 14:26:11 +02:00
parent 32a950763b
commit f3679327c0
No known key found for this signature in database
GPG Key ID: 282FD8A6D8F9BCF0
4 changed files with 14 additions and 6 deletions

View File

@ -11,7 +11,7 @@ const StyledConnection = styled('div')(({ theme }) => ({
width: 2,
height: theme.spacing(2),
backgroundColor: theme.palette.divider,
marginLeft: theme.spacing(3.25),
marginLeft: theme.spacing(3.5),
}));
interface MilestoneListRendererCoreProps {

View File

@ -4,10 +4,11 @@ import type { MilestoneStatus } from './ReleasePlanMilestoneStatus.tsx';
const StyledAutomationContainer = styled('div', {
shouldForwardProp: (prop) => prop !== 'status',
})<{ status?: MilestoneStatus }>(({ theme, status }) => ({
border: `${status === 'active' ? '1.25px' : '1px'} solid ${status === 'active' ? theme.palette.success.border : theme.palette.divider}`,
border: `${status === 'active' ? '1.5px' : '1px'} solid ${status === 'active' ? theme.palette.success.border : theme.palette.divider}`,
borderTop: `1px solid ${theme.palette.divider}`,
borderRadius: `0 0 ${theme.shape.borderRadiusLarge}px ${theme.shape.borderRadiusLarge}px`,
padding: theme.spacing(1.5, 2),
paddingLeft: theme.spacing(2.25),
backgroundColor:
status === 'completed'
? theme.palette.background.default

View File

@ -23,10 +23,10 @@ const StyledAccordion = styled(Accordion, {
shouldForwardProp: (prop) => prop !== 'status' && prop !== 'hasAutomation',
})<{ status: MilestoneStatus; hasAutomation?: boolean }>(
({ theme, status, hasAutomation }) => ({
border: `${status === 'active' ? '1.25px' : '1px'} solid ${status === 'active' ? theme.palette.success.border : theme.palette.divider}`,
border: `${status === 'active' ? '1.5px' : '1px'} solid ${status === 'active' ? theme.palette.success.border : theme.palette.divider}`,
borderBottom: hasAutomation
? 'none'
: `${status === 'active' ? '1.25px' : '1px'} solid ${status === 'active' ? theme.palette.success.border : theme.palette.divider}`,
: `${status === 'active' ? '1.5px' : '1px'} solid ${status === 'active' ? theme.palette.success.border : theme.palette.divider}`,
overflow: 'hidden',
boxShadow: 'none',
margin: 0,
@ -58,6 +58,11 @@ const StyledTitleContainer = styled('div')(({ theme }) => ({
gap: theme.spacing(0.5),
}));
const StyledMilestoneLabel = styled('span')(({ theme }) => ({
fontSize: '0.75rem',
color: theme.palette.text.secondary,
}));
const StyledTitle = styled('span', {
shouldForwardProp: (prop) => prop !== 'status',
})<{ status?: MilestoneStatus }>(({ theme, status }) => ({
@ -121,6 +126,7 @@ export const ReleasePlanMilestone = ({
<StyledAccordion status={status} hasAutomation={hasAutomation}>
<StyledAccordionSummary>
<StyledTitleContainer>
<StyledMilestoneLabel>Milestone</StyledMilestoneLabel>
<StyledTitle status={status}>
{milestone.name}
</StyledTitle>
@ -175,6 +181,7 @@ export const ReleasePlanMilestone = ({
>
<StyledAccordionSummary expandIcon={<ExpandMore />}>
<StyledTitleContainer>
<StyledMilestoneLabel>Milestone</StyledMilestoneLabel>
<StyledTitle status={status}>
{milestone.name}
</StyledTitle>

View File

@ -19,7 +19,7 @@ const StyledConnection = styled('div', {
backgroundColor: isCompleted
? theme.palette.divider
: theme.palette.primary.main,
marginLeft: theme.spacing(3.25),
marginLeft: theme.spacing(3.5),
}));
export interface PendingProgressionChange {
@ -133,7 +133,7 @@ export const ReleasePlanMilestoneItem = ({
getPendingProgressionData(milestone, getPendingProgressionChange);
const shouldShowAutomation =
isNotLastMilestone && milestoneProgressionsEnabled;
isNotLastMilestone && milestoneProgressionsEnabled && !readonly;
const automationSection = shouldShowAutomation ? (
<MilestoneAutomation