chore: sidebar fix and ui improvement (#2527)

* fix: cycle sidebar overlapping fix

* style: issue sidebar related to and duplicate icon fix
This commit is contained in:
Anmol Singh Bhatia 2023-10-23 18:07:38 +05:30 committed by GitHub
parent fcf9851ee4
commit 08f7ac6da7
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 7 additions and 8 deletions

View File

@ -293,9 +293,9 @@ export const CycleDetailsSidebar: React.FC<Props> = observer((props) => {
/> />
)} )}
<div <div
className={`absolute top-0 z-20 ${ className={`fixed top-[66px] ${
isOpen ? "right-0" : "-right-[24rem]" isOpen ? "right-0" : "-right-[24rem]"
} h-full w-[24rem] overflow-y-auto border-l border-custom-border-100 bg-custom-sidebar-background-100 pt-5 pb-10 duration-300`} } h-full w-[24rem] overflow-y-auto border-l border-custom-border-200 bg-custom-sidebar-background-100 pt-5 pb-10 duration-300`}
> >
{cycleDetails ? ( {cycleDetails ? (
<> <>

View File

@ -9,7 +9,6 @@ import useUser from "hooks/use-user";
// icons // icons
import { X, CopyPlus } from "lucide-react"; import { X, CopyPlus } from "lucide-react";
// components // components
import { BlockerIcon } from "@plane/ui";
import { ExistingIssuesListModal } from "components/core"; import { ExistingIssuesListModal } from "components/core";
// services // services
import { IssueService } from "services/issue"; import { IssueService } from "services/issue";
@ -116,7 +115,7 @@ export const SidebarDuplicateSelect: React.FC<Props> = (props) => {
? duplicateIssuesRelation.map((relation) => ( ? duplicateIssuesRelation.map((relation) => (
<div <div
key={relation.issue_detail?.id} key={relation.issue_detail?.id}
className="group flex cursor-pointer items-center gap-1 rounded-2xl border border-custom-border-200 px-1.5 py-0.5 text-xs text-yellow-500 duration-300 hover:border-yellow-500/20 hover:bg-yellow-500/20" className="group flex cursor-pointer items-center gap-1 rounded-2xl border border-custom-border-200 px-1.5 py-0.5 text-xs duration-300 "
> >
<a <a
href={`/${workspaceSlug}/projects/${relation.issue_detail?.project_detail.id}/issues/${relation.issue_detail?.id}`} href={`/${workspaceSlug}/projects/${relation.issue_detail?.project_detail.id}/issues/${relation.issue_detail?.id}`}
@ -124,7 +123,7 @@ export const SidebarDuplicateSelect: React.FC<Props> = (props) => {
rel="noopener noreferrer" rel="noopener noreferrer"
className="flex items-center gap-1" className="flex items-center gap-1"
> >
<BlockerIcon height={10} width={10} /> <CopyPlus height={10} width={10} />
{`${relation.issue_detail?.project_detail.identifier}-${relation.issue_detail?.sequence_id}`} {`${relation.issue_detail?.project_detail.identifier}-${relation.issue_detail?.sequence_id}`}
</a> </a>
<button <button

View File

@ -8,7 +8,7 @@ import useToast from "hooks/use-toast";
import useUser from "hooks/use-user"; import useUser from "hooks/use-user";
// icons // icons
import { X } from "lucide-react"; import { X } from "lucide-react";
import { BlockerIcon, RelatedIcon } from "@plane/ui"; import { RelatedIcon } from "@plane/ui";
// components // components
import { ExistingIssuesListModal } from "components/core"; import { ExistingIssuesListModal } from "components/core";
// services // services
@ -116,7 +116,7 @@ export const SidebarRelatesSelect: React.FC<Props> = (props) => {
? relatedToIssueRelation.map((relation) => ( ? relatedToIssueRelation.map((relation) => (
<div <div
key={relation.issue_detail?.id} key={relation.issue_detail?.id}
className="group flex cursor-pointer items-center gap-1 rounded-2xl border border-custom-border-200 px-1.5 py-0.5 text-xs text-yellow-500 duration-300 hover:border-yellow-500/20 hover:bg-yellow-500/20" className="group flex cursor-pointer items-center gap-1 rounded-2xl border border-custom-border-200 px-1.5 py-0.5 text-xs duration-300"
> >
<a <a
href={`/${workspaceSlug}/projects/${relation.issue_detail?.project_detail.id}/issues/${relation.issue_detail?.id}`} href={`/${workspaceSlug}/projects/${relation.issue_detail?.project_detail.id}/issues/${relation.issue_detail?.id}`}
@ -124,7 +124,7 @@ export const SidebarRelatesSelect: React.FC<Props> = (props) => {
rel="noopener noreferrer" rel="noopener noreferrer"
className="flex items-center gap-1" className="flex items-center gap-1"
> >
<BlockerIcon height={10} width={10} /> <RelatedIcon height={10} width={10} />
{`${relation.issue_detail?.project_detail.identifier}-${relation.issue_detail?.sequence_id}`} {`${relation.issue_detail?.project_detail.identifier}-${relation.issue_detail?.sequence_id}`}
</a> </a>
<button <button