thunderstrike/plane
thunderstrike/plane
2
0
Fork 0
forked from github/plane
Code Pull Requests Activity

[WEB-609] fix: header text overflow issue in kanban layout (#3848)

Browse Source 
* fix: kanban header text overflow

* chore: updated condition
This commit is contained in:
guru_sainath 2024-02-29 20:29:02 +05:30 committed by GitHub
parent 5cfebb8dae
commit e6f33eb262
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 20 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
web/components/issues/issue-layouts/kanban/default.tsx
View File

@ -101,8 +101,15 @@ const GroupByKanBan: React.FC<IGroupByKanBan> = observer((props) => {
const groupList = showEmptyGroup ? list : groupWithIssues; const groupList = showEmptyGroup ? list : groupWithIssues;
const visibilityGroupBy = (_list: IGroupByColumn) => const visibilityGroupBy = (_list: IGroupByColumn) => {
sub_group_by ? false : kanbanFilters?.group_by.includes(_list.id) ? true : false; if (sub_group_by) {
if (kanbanFilters?.sub_group_by.includes(_list.id)) return true;
return false;
} else {
if (kanbanFilters?.group_by.includes(_list.id)) return true;
return false;
}
};
const isGroupByCreatedBy = group_by === "created_by"; const isGroupByCreatedBy = group_by === "created_by";

14
web/components/issues/issue-layouts/kanban/headers/group-by-card.tsx
View File

@ -106,13 +106,21 @@ export const HeaderGroupByCard: FC<IHeaderGroupByCard> = observer((props) => {
{icon ? icon : <Circle width={14} strokeWidth={2} />} {icon ? icon : <Circle width={14} strokeWidth={2} />}
</div> </div>
<div className={`flex items-center gap-1 ${verticalAlignPosition ? `flex-col` : `w-full flex-row`}`}>
<div <div
className={`line-clamp-1 font-medium text-custom-text-100 ${verticalAlignPosition ? `vertical-lr` : ``}`} className={`relative overflow-hidden flex items-center gap-1 ${
verticalAlignPosition ? `flex-col` : `w-full flex-row`
}`}
>
<div
className={`inline-block truncate line-clamp-1 font-medium text-custom-text-100 overflow-hidden ${
verticalAlignPosition ? `vertical-lr max-h-[400px]` : ``
}`}
> >
{title} {title}
</div> </div>
<div className={`text-sm font-medium text-custom-text-300 ${verticalAlignPosition ? `` : `pl-2`}`}> <div
className={`flex-shrink-0 text-sm font-medium text-custom-text-300 ${verticalAlignPosition ? `` : `pl-2`}`}
>
{count || 0} {count || 0}
</div> </div>
</div> </div>