External/OpenCut
1
0
Fork 0
mirror of https://github.com/OpenCut-app/OpenCut.git synced 2026-07-13 21:52:53 +02:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #288 from simonorzel26/feat/select-all-projects-button-clickable

Browse Source 
feat: makes the select all project button entirely clickable and cleans up small css changes
This commit is contained in:
Maze
2025-07-16 13:29:36 +02:00
committed by GitHub
parent 5b10e84542 acd1e2e216
commit 025b0100d3
1 changed files with 15 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/web/src/app/projects/page.tsx
+15 -19
View File
@@ -173,28 +173,24 @@ export default function ProjectsPage() {
</div> </div>
{isSelectionMode && savedProjects.length > 0 && ( {isSelectionMode && savedProjects.length > 0 && (
<div className="mb-6 p-4 bg-muted/30 rounded-lg border"> <div
className="mb-6 p-4 bg-muted/30 rounded-lg border cursor-pointer hover:bg-muted/40 transition-colors"
onClick={() => handleSelectAll(!allSelected)}
>
<div className="flex items-center gap-3"> <div className="flex items-center gap-3">
<Checkbox <Checkbox
checked={allSelected} checked={allSelected}
ref={(el) => {
if (el) {
const checkboxElement = el.querySelector(
"input"
) as HTMLInputElement;
if (checkboxElement) {
checkboxElement.indeterminate = someSelected;
}
}
}}
onCheckedChange={handleSelectAll} onCheckedChange={handleSelectAll}
onClick={(e) => e.stopPropagation()}
/> />
<span className="text-sm font-medium"> <div className="flex-1 flex items-center justify-start gap-2">
{allSelected ? "Deselect All" : "Select All"} <span className="text-sm font-medium">
</span> {allSelected ? "Deselect All" : "Select All"}
<span className="text-sm text-muted-foreground"> </span>
({selectedProjects.size} of {savedProjects.length} selected) <span className="text-sm text-muted-foreground">
</span> ({selectedProjects.size} of {savedProjects.length} selected)
</span>
</div>
</div> </div>
</div> </div>
)} )}
@@ -296,7 +292,7 @@ function ProjectCard({
{/* Selection checkbox */} {/* Selection checkbox */}
{isSelectionMode && ( {isSelectionMode && (
<div className="absolute top-3 left-3 z-10"> <div className="absolute top-3 left-3 z-10">
<div className="w-5 h-5 rounded bg-background/80 backdrop-blur-sm border flex items-center justify-center"> <div className="w-5 h-5 rounded-full bg-background/80 backdrop-blur-sm border flex items-center justify-center">
<Checkbox <Checkbox
checked={isSelected} checked={isSelected}
onCheckedChange={(checked) => onCheckedChange={(checked) =>
@@ -326,7 +322,7 @@ function ProjectCard({
</div> </div>
</div> </div>
<CardContent className="px-0 pt-5 flex flex-col gap-1"> <CardContent className="px-0 pt-5 flex flex-col gap-1 p-2">
<div className="flex items-start justify-between"> <div className="flex items-start justify-between">
<h3 className="font-medium text-sm leading-snug group-hover:text-foreground/90 transition-colors line-clamp-2"> <h3 className="font-medium text-sm leading-snug group-hover:text-foreground/90 transition-colors line-clamp-2">
{project.name} {project.name}