self-hosted/focalboard
1
0
Fork 0
mirror of https://github.com/mattermost/focalboard.git synced 2024-11-24 08:22:29 +02:00
Code Issues Releases Activity

Merge pull request #2622 from asimsedhain/GH-2449

Browse Source 
GH-2449 Limits gallery card and calendar title to 5 lines
This commit is contained in:
Scott Bishel 2022-04-13 13:44:21 -06:00 committed by GitHub
commit dbaecd437c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 50 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
webapp/src/components/calendar/fullcalendar.scss
View File

@ -204,9 +204,13 @@
}
.fc-event-title {
display: -webkit-box; // stylelint-disable-line
font-size: 14px;
overflow: unset;
white-space: normal;
overflow: hidden;
text-overflow: ellipsis;
-webkit-line-clamp: 5;
-webkit-box-orient: vertical; // stylelint-disable-line
}
.fc-day-sat,

44
webapp/src/components/gallery/__snapshots__/galleryCard.test.tsx.snap
View File

@ -18,7 +18,9 @@ exports[`src/components/gallery/GalleryCard with a comment content return Galler
>
i
</div>
<div>
<div
class="octo-titletext"
>
title
</div>
</div>
@ -164,7 +166,9 @@ exports[`src/components/gallery/GalleryCard with a comment content should match
>
i
</div>
<div>
<div
class="octo-titletext"
>
title
</div>
</div>
@ -316,7 +320,9 @@ exports[`src/components/gallery/GalleryCard with an image content should match s
>
i
</div>
<div>
<div
class="octo-titletext"
>
title
</div>
</div>
@ -346,7 +352,9 @@ exports[`src/components/gallery/GalleryCard with many contents return GalleryCar
>
i
</div>
<div>
<div
class="octo-titletext"
>
title
</div>
</div>
@ -496,7 +504,9 @@ exports[`src/components/gallery/GalleryCard with many contents should match snap
>
i
</div>
<div>
<div
class="octo-titletext"
>
title
</div>
</div>
@ -648,7 +658,9 @@ exports[`src/components/gallery/GalleryCard with many images content should matc
>
i
</div>
<div>
<div
class="octo-titletext"
>
title
</div>
</div>
@ -687,7 +699,9 @@ exports[`src/components/gallery/GalleryCard without block content return Gallery
>
i
</div>
<div>
<div
class="octo-titletext"
>
title
</div>
</div>
@ -726,7 +740,9 @@ exports[`src/components/gallery/GalleryCard without block content return Gallery
>
i
</div>
<div>
<div
class="octo-titletext"
>
title
</div>
</div>
@ -765,7 +781,9 @@ exports[`src/components/gallery/GalleryCard without block content return Gallery
>
i
</div>
<div>
<div
class="octo-titletext"
>
title
</div>
</div>
@ -804,7 +822,9 @@ exports[`src/components/gallery/GalleryCard without block content return Gallery
>
i
</div>
<div>
<div
class="octo-titletext"
>
title
</div>
</div>
@ -950,7 +970,9 @@ exports[`src/components/gallery/GalleryCard without block content should match s
>
i
</div>
<div>
<div
class="octo-titletext"
>
title
</div>
</div>

8
webapp/src/components/gallery/galleryCard.scss
View File

@ -81,6 +81,14 @@
.octo-icon {
margin-right: 5px;
}
.octo-titletext {
display: -webkit-box; // stylelint-disable-line
overflow: hidden;
text-overflow: ellipsis;
-webkit-line-clamp: 5;
-webkit-box-orient: vertical; // stylelint-disable-line
}
}
.gallery-props {

5
webapp/src/components/gallery/galleryCard.tsx
View File

@ -156,7 +156,10 @@ const GalleryCard = (props: Props) => {
{props.visibleTitle &&
<div className='gallery-title'>
{ card.fields.icon ? <div className='octo-icon'>{card.fields.icon}</div> : undefined }
<div key='__title'>
<div
key='__title'
className='octo-titletext'
>
{card.title ||
<FormattedMessage
id='KanbanCard.untitled'