github/plane
0
0
Fork 1
mirror of https://github.com/makeplane/plane synced 2024-06-14 14:31:34 +00:00
Code Issues Packages Projects Releases Wiki 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 visibilityGroupBy = (_list: IGroupByColumn) =>
sub_group_by ? false : kanbanFilters?.group_by.includes(_list.id) ? true : false;
const visibilityGroupBy = (_list: IGroupByColumn) => {
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";

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} />}
</div>
<div className={`flex items-center gap-1 ${verticalAlignPosition ? `flex-col` : `w-full flex-row`}`}>
<div
className={`relative overflow-hidden flex items-center gap-1 ${
verticalAlignPosition ? `flex-col` : `w-full flex-row`
}`}
>
<div
className={`line-clamp-1 font-medium text-custom-text-100 ${verticalAlignPosition ? `vertical-lr` : ``}`}
className={`inline-block truncate line-clamp-1 font-medium text-custom-text-100 overflow-hidden ${
verticalAlignPosition ? `vertical-lr max-h-[400px]` : ``
}`}
>
{title}
</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}
</div>
</div>