feat: hide control ribbon when panel is expanded for cleaner UI

Enhanced the floating control panel behavior:
- Ribbon smoothly fades out (opacity: 0) when panel expands
- Ribbon becomes non-interactive (pointer-events: none) when hidden
- Added smooth opacity transition (0.3s ease) for elegant fade effect
- Maintains consistent transition timing with panel slide animation

This eliminates the redundant ribbon icon when the full panel is visible,
creating a cleaner and less cluttered interface while maintaining the
intuitive expand/collapse interaction.

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
2025-10-25 21:08:39 +02:00
parent ce7ce0470f
commit aefece1fe7

View File

@@ -416,6 +416,11 @@ class DocumentManager:
right: 0;
}
.markitect-control-panel.expanded .markitect-control-ribbon {
opacity: 0;
pointer-events: none;
}
/* Control ribbon - always visible */
.markitect-control-ribbon {
position: absolute;
@@ -431,7 +436,9 @@ class DocumentManager:
justify-content: center;
color: white;
font-size: 18px;
transition: all 0.3s ease;
transition: all 0.3s ease, opacity 0.3s ease;
opacity: 1;
pointer-events: auto;
}
.markitect-control-ribbon:hover {