Salastil/odysseus
1
0
Fork 0
mirror of https://github.com/pewdiepie-archdaemon/odysseus.git synced 2026-06-15 17:25:26 -04:00
Code Issues Packages Projects Releases Wiki Activity

Fix docked-modal close: chat stays offset / reopen overlaps / no animation (#1158)

Browse Source 
Docking a modal to a window edge pushes the chat aside (body padding via
right-dock-active + --right-dock-w). Three problems on close/reopen:

1. Chat stayed offset after closing a docked modal. The close-watcher only
   reacted to the `.hidden` class or DOM removal, but the draggable modals
   (calendar, plan, workspace, document, …) close via inline `display:none`.
   Watch the `style` attribute too and treat `display:none` as closed.

2. Reopening a previously-docked singleton modal floated it off to the side,
   overlapping the chat. The reused element kept its docked inline geometry.
   Clear the content's inline position/size on close so it reopens at its CSS
   default (centered).

3. Undock wasn't animated. The transition lived on `.right/left-dock-active`,
   so removing the class dropped the transition with it and padding snapped to
   0. Move the transition to the base `body` so the push animates both ways.

Files: static/js/modalSnap.js, static/style.css.
Checks: node --check static/js/modalSnap.js; verified in-browser (dock → close
→ chat animates back; reopen → centered, no overlap).
This commit is contained in:
Kenny Van de Maele
2026-06-02 15:38:20 +02:00
committed by GitHub
parent 096468a29f
commit 68efa8ee53
2 changed files with 34 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
static/style.css
+5 -2
View File
@@ -87,6 +87,11 @@ html, body { overflow-x: hidden; height: 100%; margin: 0; overscroll-behavior: n
body {
background-color: var(--bg);
color: var(--fg);
/* Animate the dock push BOTH ways. Keeping the transition on the base body
(not on .right/left-dock-active) means removing the class on undock also
animates padding back to 0 — otherwise the chat snapped back instantly. */
transition: padding-left 160ms cubic-bezier(0.22, 0.61, 0.36, 1),
padding-right 160ms cubic-bezier(0.22, 0.61, 0.36, 1);
font-family: var(--font-family, 'Fira Code', monospace);
display: flex;
height: 100%;
@@ -14546,11 +14551,9 @@ body [data-act="from-sender"] {
fit instead of being hidden behind the panel. */
body.right-dock-active {
padding-right: var(--right-dock-w, 0px);
transition: padding-right 160ms cubic-bezier(0.22, 0.61, 0.36, 1);
}
body.left-dock-active {
padding-left: var(--left-dock-w, 0px);
transition: padding-left 160ms cubic-bezier(0.22, 0.61, 0.36, 1);
}
.modal.modal-right-docked {
align-items: stretch;