fix: adjust ProjectSelector layout for improved responsiveness and scrolling behavior

This commit is contained in:
2025-06-23 18:30:33 +05:00
parent 4c2369ce88
commit 6ea1e84414
+4 -4
View File
@@ -49,7 +49,7 @@ function ProjectSelector({
</div> </div>
</button> </button>
{isOpen && ( {isOpen && (
<div className="fixed z-1 top-1/2 -translate-y-1/2 left-1/2 -translate-x-1/2 rounded-[2.222vw] bg-white p-[1.389vw] flex flex-col gap-[2.778vw] w-[25vw]"> <div className="fixed z-1 h-[calc(100vh-16vw)] top-1/2 -translate-y-1/2 left-1/2 -translate-x-1/2 rounded-[2.222vw] bg-white p-[1.389vw] flex flex-col gap-[2.778vw] w-[25vw]">
<div className="flex justify-between items-center"> <div className="flex justify-between items-center">
<Button variant="secondary" size="small"> <Button variant="secondary" size="small">
<div className="text-[#7D7D7D] size-[0.972vw]"> <div className="text-[#7D7D7D] size-[0.972vw]">
@@ -70,8 +70,8 @@ function ProjectSelector({
</span> </span>
</Button> </Button>
</div> </div>
<div className="flex flex-col gap-[1.667vw]"> <div className="flex flex-col gap-[1.667vw] h-[calc(100%-5vw)] [scrollbar-width:thin]">
<div className="flex flex-col"> <div className="flex flex-col overflow-y-auto h-[calc(100%-5vw)] [scrollbar-width:thin]">
{projects.map((project) => ( {projects.map((project) => (
<button <button
key={project.id} key={project.id}
@@ -79,7 +79,7 @@ function ProjectSelector({
e.preventDefault(); e.preventDefault();
setPointedProject(project); setPointedProject(project);
}} }}
className="flex justify-between items-center not-last:border-b py-[0.883vw] border-[#F6F6F6] cursor-pointer" className="flex justify-between items-center not-last:border-b py-[0.883vw] border-[#F6F6F6] cursor-pointer px-[0.833vw]"
> >
<div className="flex items-center gap-[0.556vw]"> <div className="flex items-center gap-[0.556vw]">
<img <img