feat: Enhance project display with hoverable overflow for additional projects
This commit is contained in:
@@ -226,8 +226,27 @@ export default function ProjectCalendarPage() {
|
|||||||
</Link>
|
</Link>
|
||||||
))}
|
))}
|
||||||
{dayProjects.length > 3 && (
|
{dayProjects.length > 3 && (
|
||||||
<div className="text-xs text-gray-500 p-1">
|
<div className="relative group">
|
||||||
+{dayProjects.length - 3} więcej
|
<div className="text-xs text-gray-500 p-1 cursor-pointer">
|
||||||
|
+{dayProjects.length - 3} więcej
|
||||||
|
</div>
|
||||||
|
<div className="absolute left-0 top-full mt-1 bg-white border border-gray-200 rounded shadow-lg p-2 z-10 opacity-0 group-hover:opacity-100 transition-opacity pointer-events-none group-hover:pointer-events-auto max-w-xs">
|
||||||
|
<div className="space-y-1">
|
||||||
|
{dayProjects.slice(3).map(project => (
|
||||||
|
<Link
|
||||||
|
key={project.project_id}
|
||||||
|
href={`/projects/${project.project_id}`}
|
||||||
|
className="block"
|
||||||
|
>
|
||||||
|
<div className={`text-xs p-1 rounded truncate ${
|
||||||
|
statusColors[project.project_status] || statusColors.registered
|
||||||
|
} hover:opacity-80 transition-opacity`}>
|
||||||
|
{project.project_name}
|
||||||
|
</div>
|
||||||
|
</Link>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user