UI - МЕЖПРОЕКТНАЯ КОММУНИКАЦИЯ: выравнивание геометрии карточек внутреннего контура
This commit is contained in:
parent
ae124e50e5
commit
bd7a7d96fe
|
|
@ -108,68 +108,72 @@ export const InternalContourKanbanCard = observer(function InternalContourKanban
|
||||||
);
|
);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={cn("relative flex min-h-[220px] flex-col gap-4", foregroundClasses)}>
|
<div className={cn("relative flex min-h-[220px] flex-col px-1", foregroundClasses)}>
|
||||||
<div
|
<div className="space-y-0.5">
|
||||||
className="absolute right-0 top-0 flex items-center gap-2"
|
<div className="flex items-center justify-between gap-3">
|
||||||
onClick={handleEventPropagation}
|
<div className="flex min-w-0 flex-1 items-center gap-3">
|
||||||
>
|
<div className="shrink-0">
|
||||||
{quickActions({
|
<Avatar
|
||||||
issue,
|
src={getFileURL(creatorDetails?.avatar_url ?? "")}
|
||||||
parentRef: cardRef,
|
name={creatorName}
|
||||||
customActionButton,
|
size="md"
|
||||||
})}
|
showTooltip={!isMobile}
|
||||||
<PriorityDropdown
|
|
||||||
value={issue.priority}
|
|
||||||
onChange={(priority) => updateIssue?.(issue.project_id ?? null, issue.id, { priority })}
|
|
||||||
disabled={isReadOnly || !updateIssue}
|
|
||||||
button={
|
|
||||||
<div
|
|
||||||
className={cn(
|
|
||||||
"flex h-8 w-8 items-center justify-center rounded-full border-0 shadow-none outline-none",
|
|
||||||
iconBubbleClasses
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
<PriorityIcon priority={issue.priority} className="h-3.5 w-3.5" />
|
|
||||||
</div>
|
|
||||||
}
|
|
||||||
/>
|
|
||||||
<StateDropdown
|
|
||||||
projectId={issue.project_id ?? undefined}
|
|
||||||
stateIds={projectStateIds ?? []}
|
|
||||||
value={issue.state_id}
|
|
||||||
onChange={(stateId) => updateIssue?.(issue.project_id ?? null, issue.id, { state_id: stateId })}
|
|
||||||
disabled={isReadOnly || !updateIssue}
|
|
||||||
button={
|
|
||||||
<div className={cn("flex h-8 w-8 items-center justify-center rounded-full", iconBubbleClasses)}>
|
|
||||||
<StateGroupIcon
|
|
||||||
stateGroup={selectedState?.group ?? "backlog"}
|
|
||||||
color={statusIconColor}
|
|
||||||
className="h-3.5 w-3.5"
|
|
||||||
percentage={selectedState?.order}
|
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
}
|
<div className={cn("truncate text-body-sm-medium leading-5", foregroundClasses)}>{creatorName}</div>
|
||||||
/>
|
</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="flex items-center gap-3 pr-28">
|
<div className="flex shrink-0 items-center gap-2" onClick={handleEventPropagation}>
|
||||||
<Avatar
|
{quickActions({
|
||||||
src={getFileURL(creatorDetails?.avatar_url ?? "")}
|
issue,
|
||||||
name={creatorName}
|
parentRef: cardRef,
|
||||||
size="md"
|
customActionButton,
|
||||||
showTooltip={!isMobile}
|
})}
|
||||||
/>
|
<PriorityDropdown
|
||||||
<div className="min-w-0">
|
value={issue.priority}
|
||||||
<div className={cn("truncate text-body-sm-medium", foregroundClasses)}>{creatorName}</div>
|
onChange={(priority) => updateIssue?.(issue.project_id ?? null, issue.id, { priority })}
|
||||||
<div className={cn("truncate text-[11px] font-medium", subtleTextClasses)}>{sourceContourName}</div>
|
disabled={isReadOnly || !updateIssue}
|
||||||
|
button={
|
||||||
|
<div
|
||||||
|
className={cn(
|
||||||
|
"flex h-8 w-8 items-center justify-center rounded-full border-0 shadow-none outline-none",
|
||||||
|
iconBubbleClasses
|
||||||
|
)}
|
||||||
|
>
|
||||||
|
<PriorityIcon priority={issue.priority} className="h-3.5 w-3.5" />
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
<StateDropdown
|
||||||
|
projectId={issue.project_id ?? undefined}
|
||||||
|
stateIds={projectStateIds ?? []}
|
||||||
|
value={issue.state_id}
|
||||||
|
onChange={(stateId) => updateIssue?.(issue.project_id ?? null, issue.id, { state_id: stateId })}
|
||||||
|
disabled={isReadOnly || !updateIssue}
|
||||||
|
button={
|
||||||
|
<div className={cn("flex h-8 w-8 items-center justify-center rounded-full", iconBubbleClasses)}>
|
||||||
|
<StateGroupIcon
|
||||||
|
stateGroup={selectedState?.group ?? "backlog"}
|
||||||
|
color={statusIconColor}
|
||||||
|
className="h-3.5 w-3.5"
|
||||||
|
percentage={selectedState?.order}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className={cn("truncate -mt-0.5 pl-8 text-[11px] font-medium leading-4", subtleTextClasses)}>
|
||||||
|
{sourceContourName}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="flex flex-1 items-center justify-center px-5 text-center">
|
<div className="flex flex-1 items-center justify-center px-5 py-4 text-center">
|
||||||
<div className="line-clamp-4 max-w-full text-lg font-semibold leading-6">{issue.name}</div>
|
<div className="line-clamp-4 max-w-full text-lg font-semibold leading-6">{issue.name}</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="flex items-end justify-between gap-3">
|
<div className="flex items-center justify-between gap-3">
|
||||||
<MemberDropdown
|
<MemberDropdown
|
||||||
projectId={issue.project_id ?? undefined}
|
projectId={issue.project_id ?? undefined}
|
||||||
value={issue.assignee_ids}
|
value={issue.assignee_ids}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue