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

fix: cap rendered change request title height to 3 lines (#10922)

Browse Source 
Caps the rendered change request title height to 3 lines and makes the
edit button rectangular-ish instead of circular. This will work better
as it can grow arbitrarily tall.

## Title capping
Before:
<img width="753" height="1260" alt="image"
src="https://github.com/user-attachments/assets/8ae278f9-cc97-4803-8c29-4f3fede99b52"
/>


After:
<img width="1506" height="216" alt="image"
src="https://github.com/user-attachments/assets/c5ca04e9-b1c7-4d36-b023-86f6fbb322db"
/>

## Edit button border fix
Before:
<img width="1441" height="251" alt="image"
src="https://github.com/user-attachments/assets/40df8747-a68f-4d36-af67-888c841cfcad"
/>


After:
<img width="1455" height="247" alt="image"
src="https://github.com/user-attachments/assets/c63380cb-ebe8-481d-a959-087dbf79b9fc"
/>
This commit is contained in:
Thomas Heartman 2025-11-05 13:31:00 +01:00 committed by GitHub
parent a4885c45a3
commit 88a42ac849
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 8 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
frontend/src/component/changeRequest/ChangeRequestOverview/ChangeRequestHeader/ChangeRequestHeader.tsx
View File

@ -14,6 +14,7 @@ import {
import { Separator } from '../../ChangeRequestSidebar/ChangeRequestSidebar.tsx'; import { Separator } from '../../ChangeRequestSidebar/ChangeRequestSidebar.tsx';
import { ChangeRequestTitle } from '../../ChangeRequestSidebar/EnvironmentChangeRequest/ChangeRequestTitle.tsx'; import { ChangeRequestTitle } from '../../ChangeRequestSidebar/EnvironmentChangeRequest/ChangeRequestTitle.tsx';
import { UpdateCount } from 'component/changeRequest/UpdateCount'; import { UpdateCount } from 'component/changeRequest/UpdateCount';
import { Truncator } from 'component/common/Truncator/Truncator.tsx';
export const ChangeRequestHeader: FC<{ changeRequest: ChangeRequestType }> = ({ export const ChangeRequestHeader: FC<{ changeRequest: ChangeRequestType }> = ({
changeRequest, changeRequest,
@ -27,7 +28,7 @@ export const ChangeRequestHeader: FC<{ changeRequest: ChangeRequestType }> = ({
setTitle={setTitle} setTitle={setTitle}
> >
<StyledHeader variant='h1' component='h2' sx={{ mr: 1.5 }}> <StyledHeader variant='h1' component='h2' sx={{ mr: 1.5 }}>
{title} <Truncator lines={3}>{title}</Truncator>
</StyledHeader> </StyledHeader>
</ChangeRequestTitle> </ChangeRequestTitle>
<StyledInnerContainer> <StyledInnerContainer>

8
frontend/src/component/changeRequest/ChangeRequestSidebar/EnvironmentChangeRequest/ChangeRequestTitle.tsx
View File

@ -25,6 +25,10 @@ export const StyledHeader = styled(Typography)(({ theme }) => ({
fontSize: theme.fontSizes.mainHeader, fontSize: theme.fontSizes.mainHeader,
})); }));
const StyledIconButton = styled(IconButton)(({ theme }) => ({
borderRadius: theme.shape.borderRadius,
}));
export const ChangeRequestTitle: FC<{ export const ChangeRequestTitle: FC<{
environmentChangeRequest: ChangeRequestType; environmentChangeRequest: ChangeRequestType;
title: string; title: string;
@ -74,9 +78,9 @@ export const ChangeRequestTitle: FC<{
<ConditionallyRender <ConditionallyRender
condition={isDisabled} condition={isDisabled}
show={ show={
<IconButton onClick={toggleEditState}> <StyledIconButton onClick={toggleEditState}>
<Edit /> <Edit />
</IconButton> </StyledIconButton>
} }
/> />
<ConditionallyRender <ConditionallyRender