fix: kanban layout UI (#3023)

* fix: quick add placement

* fix: assignee avatar size in kanban header

* fix: issue detail sidebar scroll

* fix: extra margin around links

* formatting
This commit is contained in:
Lakhan Baheti 2023-12-07 18:13:54 +05:30 committed by sriram veeraghanta
parent 539c7a3455
commit 8409a84004
3 changed files with 22 additions and 20 deletions

View File

@ -109,8 +109,8 @@ const GroupByKanBan: React.FC<IGroupByKanBan> = observer((props) => {
)}
<div
className={`min-h-[150px] ${
verticalAlignPosition(_list) ? `w-[0px] overflow-hidden` : `w-full transition-all`
className={`${
verticalAlignPosition(_list) ? `min-h-[150px] w-[0px] overflow-hidden` : `w-full transition-all`
}`}
>
<Droppable droppableId={`${getValueFromObject(_list, listKey) as string}__${sub_group_id}`}>
@ -122,7 +122,7 @@ const GroupByKanBan: React.FC<IGroupByKanBan> = observer((props) => {
{...provided.droppableProps}
ref={provided.innerRef}
>
{issues ? (
{issues && !verticalAlignPosition(_list) ? (
<KanbanIssueBlocksList
sub_group_id={sub_group_id}
columnId={getValueFromObject(_list, listKey) as string}

View File

@ -22,7 +22,7 @@ export interface IAssigneesHeader {
addIssuesToView?: (issueIds: string[]) => Promise<IIssue>;
}
export const Icon = ({ user }: any) => <Avatar name={user.display_name} src={user.avatar} size="base" />;
export const Icon = ({ user }: any) => <Avatar name={user.display_name} src={user.avatar} size="md" />;
export const AssigneesHeader: FC<IAssigneesHeader> = observer((props) => {
const {

View File

@ -638,7 +638,7 @@ export const IssueDetailsSidebar: React.FC<Props> = observer((props) => {
</div>
)}
{(fieldsToShow.includes("all") || fieldsToShow.includes("link")) && (
<div className={`min-h-[116px] py-1 text-xs ${uneditable ? "opacity-60" : ""}`}>
<div className={`py-1 text-xs ${uneditable ? "opacity-60" : ""}`}>
<div className="flex items-center justify-between gap-2">
<h4>Links</h4>
{isAllowed && (
@ -654,21 +654,23 @@ export const IssueDetailsSidebar: React.FC<Props> = observer((props) => {
</button>
)}
</div>
<div className="mt-2 space-y-2">
{issueDetail?.issue_link && issueDetail.issue_link.length > 0 ? (
<LinksList
links={issueDetail.issue_link}
handleDeleteLink={handleDeleteLink}
handleEditLink={handleEditLink}
userAuth={{
isGuest: currentProjectRole === 5,
isViewer: currentProjectRole === 10,
isMember: currentProjectRole === 15,
isOwner: currentProjectRole === 20,
}}
/>
) : null}
</div>
{issueDetail?.issue_link && issueDetail.issue_link.length > 0 && (
<div className="mt-2 space-y-2">
{
<LinksList
links={issueDetail.issue_link}
handleDeleteLink={handleDeleteLink}
handleEditLink={handleEditLink}
userAuth={{
isGuest: currentProjectRole === 5,
isViewer: currentProjectRole === 10,
isMember: currentProjectRole === 15,
isOwner: currentProjectRole === 20,
}}
/>
}
</div>
)}
</div>
)}
</div>