Michael/LogiFlow
1
0 Fork 0
mirror of https://github.com/R0m1k3/LogiFlow.git synced 2026-10-11 17:27:31 +02:00
Code Issues Packages Projects Releases Wiki Activity

Adjust calendar display to position quick create button next to advertisements

Browse Source 
Refactor CalendarGrid component to conditionally render and position the quick create button alongside advertisements within the calendar view, improving UI layout based on user feedback.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: fba33a9c-2c78-4001-992e-48eb46f716ef
Replit-Commit-Checkpoint-Type: full_checkpoint
This commit is contained in:
michaelschal committed 2025-09-04 14:03:51 +00:00
1 parent cac82ad602
commit abb720d797
2 files changed
+35 -33
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

.replit
-1
View File
@@ -37,4 +37,3 @@ args = "npm run dev"
waitForPort = 5000
[agent]
integrations = ["javascript_database==1.0.0", "javascript_object_storage==1.0.0", "javascript_log_in_with_replit==1.0.0"]
client/src/components/CalendarGrid.tsx
+35 -32
View File
@@ -536,39 +536,42 @@ export default function CalendarGrid({
</div>
</div>
{/* Publicities avec design épuré */}
{dayPublicities.length > 0 && (
<div className="absolute top-2 right-2 flex flex-col items-end gap-1">
{dayPublicities.slice(0, 2).map((pub, idx) => (
<div
key={`${pub.id}-${idx}`}
className="bg-purple-300 text-purple-800 text-xs px-2 py-1 font-bold shadow-md cursor-help transform hover:scale-105 transition-transform duration-150 border border-purple-400"
title={`Pub ${pub.pubNumber}: ${pub.designation}${pub.participations ? ` - Magasins: ${pub.participations.map((pg: any) => pg.group?.name).join(', ')}` : ''}`}
>
{pub.pubNumber}
</div>
))}
{dayPublicities.length > 2 && (
<div className="bg-purple-400 text-purple-900 text-xs px-2 py-1 font-bold shadow-md cursor-help transform hover:scale-105 transition-transform duration-150 border border-purple-500">
+{dayPublicities.length - 2}
</div>
)}
</div>
)}
{/* Quick Create Button épuré */}
{/* Publicities et Quick Create Button ensemble */}
{isCurrentMonth && (
<div className={`absolute ${dayPublicities.length === 0 ? 'top-2 right-2' : 'bottom-2 right-2'} opacity-0 group-hover:opacity-100 transition-all duration-200`}>
<Button
size="sm"
className="w-6 h-6 bg-orange-300 text-orange-800 p-0 hover:bg-orange-400 shadow-md transform hover:scale-110 transition-all duration-150 border border-orange-500"
onClick={(e) => {
e.stopPropagation();
onDateClick(date);
}}
>
<Plus className="w-3 h-3" />
</Button>
<div className="absolute top-2 right-2 flex flex-col items-end gap-1">
{/* Publicities avec design épuré */}
{dayPublicities.length > 0 && (
<>
{dayPublicities.slice(0, 2).map((pub, idx) => (
<div
key={`${pub.id}-${idx}`}
className="bg-purple-300 text-purple-800 text-xs px-2 py-1 font-bold shadow-md cursor-help transform hover:scale-105 transition-transform duration-150 border border-purple-400"
title={`Pub ${pub.pubNumber}: ${pub.designation}${pub.participations ? ` - Magasins: ${pub.participations.map((pg: any) => pg.group?.name).join(', ')}` : ''}`}
>
{pub.pubNumber}
</div>
))}
{dayPublicities.length > 2 && (
<div className="bg-purple-400 text-purple-900 text-xs px-2 py-1 font-bold shadow-md cursor-help transform hover:scale-105 transition-transform duration-150 border border-purple-500">
+{dayPublicities.length - 2}
</div>
)}
</>
)}
{/* Quick Create Button à côté des publicités */}
<div className="opacity-0 group-hover:opacity-100 transition-all duration-200">
<Button
size="sm"
className="w-6 h-6 bg-orange-300 text-orange-800 p-0 hover:bg-orange-400 shadow-md transform hover:scale-110 transition-all duration-150 border border-orange-500"
onClick={(e) => {
e.stopPropagation();
onDateClick(date);
}}
>
<Plus className="w-3 h-3" />
</Button>
</div>
</div>
)}
</div>