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

chore: fix project name overflow (#7575)

Browse Source 
Fix overflow in long project names. Show ellipsis where it overflows.


![image](https://github.com/Unleash/unleash/assets/17786332/4723134b-b667-47ab-83e8-02cb3cda9093)


![image](https://github.com/Unleash/unleash/assets/17786332/7f4f0b5b-bc03-460d-8ba1-e0cda51e9a5c)


![image](https://github.com/Unleash/unleash/assets/17786332/8b6528f0-2ed8-4a26-9d22-42fa356583c8)
This commit is contained in:
Thomas Heartman 2024-07-11 10:00:38 +02:00 committed by GitHub
parent 7b7c78fe5d
commit d7adee3f64
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 5 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
frontend/src/component/project/Project/Project.styles.ts
View File

@ -3,12 +3,12 @@ import { FavoriteIconButton } from 'component/common/FavoriteIconButton/Favorite
export const StyledDiv = styled('div')(() => ({ export const StyledDiv = styled('div')(() => ({
display: 'flex', display: 'flex',
overflow: 'hidden',
})); }));
export const StyledTopRow = styled('div')(() => ({ export const StyledTopRow = styled('div')(() => ({
display: 'flex', display: 'grid',
flexDirection: 'row', gridTemplateColumns: '1fr auto',
justifyContent: 'space-between',
width: '100%', width: '100%',
})); }));
@ -21,6 +21,7 @@ export const StyledName = styled('span')(({ theme }) => ({
fontSize: theme.typography.h1.fontSize, fontSize: theme.typography.h1.fontSize,
textOverflow: 'ellipsis', textOverflow: 'ellipsis',
whiteSpace: 'nowrap', whiteSpace: 'nowrap',
overflow: 'hidden',
})); }));
export const StyledTitle = styled('span')(({ theme }) => ({ export const StyledTitle = styled('span')(({ theme }) => ({
@ -60,6 +61,7 @@ export const StyledProjectTitle = styled('span')(({ theme }) => ({
justifyContent: 'space-between', justifyContent: 'space-between',
alignItems: 'center', alignItems: 'center',
gap: theme.spacing(2), gap: theme.spacing(2),
overflow: 'hidden',
})); }));
export const StyledSeparator = styled('div')(({ theme }) => ({ export const StyledSeparator = styled('div')(({ theme }) => ({