fix: cycle & module sidebar progress-stats scroll (#3932)

This commit is contained in:
Lakhan Baheti 2024-03-11 21:03:30 +05:30 committed by GitHub
parent 539afb0792
commit 27acd1bec1
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
5 changed files with 13 additions and 13 deletions

View File

@ -127,7 +127,7 @@ export const SidebarProgressStats: React.FC<Props> = ({
<Tab.Panels className="flex w-full items-center justify-between text-custom-text-200"> <Tab.Panels className="flex w-full items-center justify-between text-custom-text-200">
<Tab.Panel <Tab.Panel
as="div" as="div"
className="flex h-44 w-full flex-col gap-1.5 overflow-y-auto pt-3.5 vertical-scrollbar scrollbar-sm" className="flex w-full flex-col gap-1.5 overflow-y-auto pt-3.5 vertical-scrollbar scrollbar-sm"
> >
{distribution?.assignees.length > 0 ? ( {distribution?.assignees.length > 0 ? (
distribution.assignees.map((assignee, index) => { distribution.assignees.map((assignee, index) => {
@ -187,7 +187,7 @@ export const SidebarProgressStats: React.FC<Props> = ({
</Tab.Panel> </Tab.Panel>
<Tab.Panel <Tab.Panel
as="div" as="div"
className="flex h-44 w-full flex-col gap-1.5 overflow-y-auto pt-3.5 vertical-scrollbar scrollbar-sm" className="flex w-full flex-col gap-1.5 overflow-y-auto pt-3.5 vertical-scrollbar scrollbar-sm"
> >
{distribution?.labels.length > 0 ? ( {distribution?.labels.length > 0 ? (
distribution.labels.map((label, index) => ( distribution.labels.map((label, index) => (
@ -230,7 +230,7 @@ export const SidebarProgressStats: React.FC<Props> = ({
</Tab.Panel> </Tab.Panel>
<Tab.Panel <Tab.Panel
as="div" as="div"
className="flex h-44 w-full flex-col gap-1.5 overflow-y-auto pt-3.5 vertical-scrollbar scrollbar-sm" className="flex w-full flex-col gap-1.5 overflow-y-auto pt-3.5 vertical-scrollbar scrollbar-sm"
> >
{Object.keys(groupedIssues).map((group, index) => ( {Object.keys(groupedIssues).map((group, index) => (
<SingleProgressStats <SingleProgressStats

View File

@ -224,7 +224,7 @@ export const CycleDetailsSidebar: React.FC<Props> = observer((props) => {
const isEditingAllowed = !!currentProjectRole && currentProjectRole >= EUserWorkspaceRoles.MEMBER; const isEditingAllowed = !!currentProjectRole && currentProjectRole >= EUserWorkspaceRoles.MEMBER;
return ( return (
<> <div className="relative">
{cycleDetails && workspaceSlug && projectId && ( {cycleDetails && workspaceSlug && projectId && (
<CycleDeleteModal <CycleDeleteModal
cycle={cycleDetails} cycle={cycleDetails}
@ -236,7 +236,7 @@ export const CycleDetailsSidebar: React.FC<Props> = observer((props) => {
)} )}
<> <>
<div className="flex w-full items-center justify-between"> <div className="sticky z-10 top-0 flex items-center justify-between bg-custom-sidebar-background-100 py-5">
<div> <div>
<button <button
className="flex h-5 w-5 items-center justify-center rounded-full bg-custom-border-300" className="flex h-5 w-5 items-center justify-center rounded-full bg-custom-border-300"
@ -505,6 +505,6 @@ export const CycleDetailsSidebar: React.FC<Props> = observer((props) => {
</div> </div>
</div> </div>
</> </>
</> </div>
); );
}); });

View File

@ -242,7 +242,7 @@ export const ModuleDetailsSidebar: React.FC<Props> = observer((props) => {
const isEditingAllowed = !!currentProjectRole && currentProjectRole >= EUserProjectRoles.MEMBER; const isEditingAllowed = !!currentProjectRole && currentProjectRole >= EUserProjectRoles.MEMBER;
return ( return (
<> <div className="relative">
<LinkModal <LinkModal
isOpen={moduleLinkModal} isOpen={moduleLinkModal}
handleClose={() => { handleClose={() => {
@ -257,7 +257,7 @@ export const ModuleDetailsSidebar: React.FC<Props> = observer((props) => {
<DeleteModuleModal isOpen={moduleDeleteModal} onClose={() => setModuleDeleteModal(false)} data={moduleDetails} /> <DeleteModuleModal isOpen={moduleDeleteModal} onClose={() => setModuleDeleteModal(false)} data={moduleDetails} />
<> <>
<div className="flex w-full items-center justify-between"> <div className="sticky z-10 top-0 flex items-center justify-between bg-custom-sidebar-background-100 py-5">
<div> <div>
<button <button
className="flex h-5 w-5 items-center justify-center rounded-full bg-custom-border-300" className="flex h-5 w-5 items-center justify-center rounded-full bg-custom-border-300"
@ -590,6 +590,6 @@ export const ModuleDetailsSidebar: React.FC<Props> = observer((props) => {
</div> </div>
</div> </div>
</> </>
</> </div>
); );
}); });

View File

@ -67,7 +67,7 @@ const CycleDetailPage: NextPageWithLayout = observer(() => {
</div> </div>
{cycleId && !isSidebarCollapsed && ( {cycleId && !isSidebarCollapsed && (
<div <div
className="flex h-full w-[24rem] flex-shrink-0 flex-col gap-3.5 overflow-y-auto border-l border-custom-border-100 bg-custom-sidebar-background-100 px-6 py-3.5 duration-300 vertical-scrollbar scrollbar-sm" className="flex h-full w-[24rem] flex-shrink-0 flex-col gap-3.5 overflow-y-auto border-l border-custom-border-100 bg-custom-sidebar-background-100 px-6 duration-300 vertical-scrollbar scrollbar-sm"
style={{ style={{
boxShadow: boxShadow:
"0px 1px 4px 0px rgba(0, 0, 0, 0.06), 0px 2px 4px 0px rgba(16, 24, 40, 0.06), 0px 1px 8px -1px rgba(16, 24, 40, 0.06)", "0px 1px 4px 0px rgba(0, 0, 0, 0.06), 0px 2px 4px 0px rgba(16, 24, 40, 0.06), 0px 1px 8px -1px rgba(16, 24, 40, 0.06)",

View File

@ -66,7 +66,7 @@ const ModuleIssuesPage: NextPageWithLayout = observer(() => {
</div> </div>
{moduleId && !isSidebarCollapsed && ( {moduleId && !isSidebarCollapsed && (
<div <div
className="flex h-full w-[24rem] flex-shrink-0 flex-col gap-3.5 overflow-y-auto border-l border-custom-border-100 bg-custom-sidebar-background-100 px-6 py-3.5 duration-300 vertical-scrollbar scrollbar-sm" className="flex h-full w-[24rem] flex-shrink-0 flex-col gap-3.5 overflow-y-auto border-l border-custom-border-100 bg-custom-sidebar-background-100 px-6 duration-300 vertical-scrollbar scrollbar-sm"
style={{ style={{
boxShadow: boxShadow:
"0px 1px 4px 0px rgba(0, 0, 0, 0.06), 0px 2px 4px 0px rgba(16, 24, 40, 0.06), 0px 1px 8px -1px rgba(16, 24, 40, 0.06)", "0px 1px 4px 0px rgba(0, 0, 0, 0.06), 0px 2px 4px 0px rgba(16, 24, 40, 0.06), 0px 1px 8px -1px rgba(16, 24, 40, 0.06)",