style: workspace sidebar scroll fix and improvement (#2934)

This commit is contained in:
Anmol Singh Bhatia 2023-11-29 13:32:35 +05:30 committed by GitHub
parent 404a61aee5
commit 537901f046
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -145,8 +145,10 @@ export const WorkspaceSidebarDropdown = observer(() => {
leaveTo="transform opacity-0 scale-95" leaveTo="transform opacity-0 scale-95"
> >
<Menu.Items className="fixed left-4 z-20 mt-1 flex flex-col w-full max-w-[17rem] origin-top-left rounded-md border border-custom-sidebar-border-200 bg-custom-sidebar-background-100 shadow-lg outline-none"> <Menu.Items className="fixed left-4 z-20 mt-1 flex flex-col w-full max-w-[17rem] origin-top-left rounded-md border border-custom-sidebar-border-200 bg-custom-sidebar-background-100 shadow-lg outline-none">
<div className="flex flex-col items-start justify-start gap-3 p-3 max-h-96 overflow-y-scroll"> <div className="flex flex-col items-start justify-start gap-3 px-3 max-h-96 overflow-y-scroll">
<span className="text-sm font-medium text-custom-sidebar-text-200">Workspace</span> <span className="sticky top-0 bg-custom-background-100 pt-3 z-10 w-full h-full text-sm font-medium text-custom-sidebar-text-200">
Workspace
</span>
{workspaces ? ( {workspaces ? (
<div className="flex h-full w-full flex-col items-start justify-start gap-1.5"> <div className="flex h-full w-full flex-col items-start justify-start gap-1.5">
{workspaces.length > 0 ? ( {workspaces.length > 0 ? (
@ -195,6 +197,7 @@ export const WorkspaceSidebarDropdown = observer(() => {
) : ( ) : (
<p>No workspace found!</p> <p>No workspace found!</p>
)} )}
<div className="sticky bottom-0 bg-custom-background-100 z-10 w-full h-full">
<Menu.Item <Menu.Item
as="button" as="button"
type="button" type="button"
@ -208,6 +211,7 @@ export const WorkspaceSidebarDropdown = observer(() => {
Create Workspace Create Workspace
</Menu.Item> </Menu.Item>
</div> </div>
</div>
) : ( ) : (
<div className="w-full"> <div className="w-full">
<Loader className="space-y-2"> <Loader className="space-y-2">