github/dbx
4
0 Fork 0
mirror of https://github.com/t8y2/dbx.git synced 2026-11-15 14:52:36 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(desktop): unify grouped tab bar portal across special pages

Browse Source
This commit is contained in:
二丫讲梵 authored and GitHub committed 2026-09-06 20:39:34 +08:00
1 parent 3123e962c8
commit 148345494e
27 files changed
+1352 -590
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

apps/desktop/src/components/layout/sqlEditorWorkspace.css
+6 -44
View File
@@ -1,30 +1,15 @@
/*
* Motion for layout transitions inside the SQL editor workspace.
*
* Pane SIZE changes (split, result-pane collapse/expand) are smoothed by
* splitpanes' stock pane transition, which globals.css kills for horizontal
* splitpanes — re-enabled here for this workspace only (drag still disables
* it via the higher-specificity rule below). The entrance effects cover the
* content that would otherwise pop in: groups created by a split, and the
* shared result surface re-mounting on a query tab.
*
* Product motion rules: transform/opacity only, ease-out-quart, 150-250ms,
* no load choreography (groups present at first render never animate), and
* everything degrades to instant under prefers-reduced-motion.
* New editor groups animate when split. Query results and their pane sizes
* update immediately, including when restoring a collapsed result pane.
*/
.sql-editor-workspace {
--sql-workspace-ease-out: cubic-bezier(0.25, 1, 0.5, 1);
}
/* Pane size transitions: only the outer editor/result split animates pane
sizes (the result-pane collapse/expand glide). Group panes never animate
their sizes — splits use the entrance keyframes below — so they stay on
stock splitpanes behavior (transition, disabled while dragging). */
/* Override splitpanes' stock transition so ready results are not clipped
while the result pane expands. */
.sql-editor-workspace .sql-editor-workspace-split.splitpanes--ready > .splitpanes__pane {
transition: width 0.2s ease-out, height 0.2s ease-out !important;
}
.sql-editor-workspace .sql-editor-workspace-split.splitpanes--ready.splitpanes--dragging > .splitpanes__pane {
transition: none !important;
}
@@ -47,28 +32,12 @@
}
}
/* Shared result surface: rises into place while its pane expands, and fades
out faster than the pane collapses. */
.sql-editor-workspace .result-surface-enter-active {
transition: opacity 180ms var(--sql-workspace-ease-out), transform 180ms var(--sql-workspace-ease-out);
}
.sql-editor-workspace .result-surface-enter-from {
opacity: 0;
transform: translateY(10px);
}
.sql-editor-workspace .result-surface-leave-active {
transition: opacity 120ms var(--sql-workspace-ease-out);
}
.sql-editor-workspace .result-surface-leave-to {
opacity: 0;
}
/* The splitter between the editor and result panes stays in the splitpanes
flow even when the result pane is collapsed; fade it out and disable it so
flow even when the result pane is collapsed; hide it and disable it so
the closed state is visually clean and cannot be dragged open into an
empty pane. */
.sql-editor-workspace-split > .splitpanes__splitter {
transition: opacity 150ms var(--sql-workspace-ease-out);
transition: none;
}
.sql-editor-workspace-split.result-pane-collapsed > .splitpanes__splitter {
opacity: 0;
@@ -79,11 +48,4 @@
.sql-editor-workspace .workspace-pane-enter {
animation: none;
}
.sql-editor-workspace .result-surface-enter-active,
.sql-editor-workspace .result-surface-leave-active {
transition: none;
}
.sql-editor-workspace .sql-editor-workspace-split.splitpanes--ready > .splitpanes__pane {
transition: none !important;
}
}