eliott/worldmonitor
1
0
Fork 0
mirror of https://github.com/koala73/worldmonitor.git synced 2026-04-25 17:14:57 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat(panels): improve drag UX and add close buttons to live panels (#1550)

Browse Source 
* feat(panels): improve drag UX and add close buttons to live panels

* fix: address PR feedback from koala73 and SebastienMelki

* fix: remove unused variable in llm-health probe

---------

Co-authored-by: rayanhabib07 <rayanhabib07@gmail.com>
This commit is contained in:
Elie Habib
2026-03-14 08:49:03 +04:00
committed by GitHub
parent 0e1ee80096
commit 1390ae56de
5 changed files with 338 additions and 70 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
src/styles/main.css
View File

@@ -1280,11 +1280,51 @@ body.panel-resize-active iframe {
display: none;
}
.panel.dragging {
opacity: 0.5;
transform: scale(1.02);
box-shadow: 0 8px 24px rgba(0, 255, 136, 0.2);
will-change: transform, opacity;
.panel.dragging-source {
opacity: 0.4;
transform: scale(0.98);
transition: opacity 0.2s ease, transform 0.2s ease;
pointer-events: none;
}
.panel-drag-ghost {
filter: drop-shadow(0 10px 40px rgba(0, 0, 0, 0.4));
border: 1px solid var(--accent);
animation: dragGhostPulse 0.3s ease-out;
opacity: 0.8;
transform: scale(1.02); /* no rotation */
}
@keyframes dragGhostPulse {
0% {
opacity: 0.7;
transform: scale(0.98);
}
100% {
opacity: 0.8;
transform: scale(1.02);
}
}
.panel-drop-indicator {
display: block;
position: fixed;
pointer-events: none;
height: 4px;
background: var(--accent);
border-radius: 2px;
box-shadow: 0 0 8px var(--accent);
opacity: 0;
transition: opacity 0.15s ease;
z-index: 9999;
}
/* Hover highlight for potential drop target */
.panel-drop-target {
outline: 2px dashed var(--accent);
outline-offset: -2px;
background: color-mix(in srgb, var(--accent) 20%, transparent);
transition: background 0.15s ease, outline 0.15s ease;
}
.panel-header {