self-hosted/focalboard
1
0
Fork 0
mirror of https://github.com/mattermost/focalboard.git synced 2025-02-01 19:14:35 +02:00
Code Issues Releases Activity

fix: gallary card and calendar title overflowing

Browse Source
This commit is contained in:
asimsedhain 2022-03-23 18:50:09 -05:00
parent ffd791e085
commit c54228e13c
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 { .fc-event-title {
display: -webkit-box; // stylelint-disable-line
font-size: 14px; font-size: 14px;
overflow: unset;
white-space: normal; white-space: normal;
overflow: hidden;
text-overflow: ellipsis;
-webkit-line-clamp: 5;
-webkit-box-orient: vertical; // stylelint-disable-line
} }
.fc-day-sat, .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 i
</div> </div>
<div> <div
class="octo-titletext"
>
title title
</div> </div>
</div> </div>
@ -148,7 +150,9 @@ exports[`src/components/gallery/GalleryCard with a comment content should match
> >
i i
</div> </div>
<div> <div
class="octo-titletext"
>
title title
</div> </div>
</div> </div>
@ -284,7 +288,9 @@ exports[`src/components/gallery/GalleryCard with an image content should match s
> >
i i
</div> </div>
<div> <div
class="octo-titletext"
>
title title
</div> </div>
</div> </div>
@ -314,7 +320,9 @@ exports[`src/components/gallery/GalleryCard with many contents return GalleryCar
> >
i i
</div> </div>
<div> <div
class="octo-titletext"
>
title title
</div> </div>
</div> </div>
@ -448,7 +456,9 @@ exports[`src/components/gallery/GalleryCard with many contents should match snap
> >
i i
</div> </div>
<div> <div
class="octo-titletext"
>
title title
</div> </div>
</div> </div>
@ -584,7 +594,9 @@ exports[`src/components/gallery/GalleryCard with many images content should matc
> >
i i
</div> </div>
<div> <div
class="octo-titletext"
>
title title
</div> </div>
</div> </div>
@ -623,7 +635,9 @@ exports[`src/components/gallery/GalleryCard without block content return Gallery
> >
i i
</div> </div>
<div> <div
class="octo-titletext"
>
title title
</div> </div>
</div> </div>
@ -662,7 +676,9 @@ exports[`src/components/gallery/GalleryCard without block content return Gallery
> >
i i
</div> </div>
<div> <div
class="octo-titletext"
>
title title
</div> </div>
</div> </div>
@ -701,7 +717,9 @@ exports[`src/components/gallery/GalleryCard without block content return Gallery
> >
i i
</div> </div>
<div> <div
class="octo-titletext"
>
title title
</div> </div>
</div> </div>
@ -740,7 +758,9 @@ exports[`src/components/gallery/GalleryCard without block content return Gallery
> >
i i
</div> </div>
<div> <div
class="octo-titletext"
>
title title
</div> </div>
</div> </div>
@ -870,7 +890,9 @@ exports[`src/components/gallery/GalleryCard without block content should match s
> >
i i
</div> </div>
<div> <div
class="octo-titletext"
>
title title
</div> </div>
</div> </div>

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

@ -81,6 +81,14 @@
.octo-icon { .octo-icon {
margin-right: 5px; 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 { .gallery-props {

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

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