sinvo/docmost
1
0
Fork 0
mirror of https://github.com/docmost/docmost.git synced 2026-08-29 18:14:58 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(base): add right-side scroll headroom on inline embed grid

Browse Source 
Mirror the leftward padding with --embed-grid-pad-right = extendRight,
applied as padding-right on .grid. The user can now pan past the last
column into empty space — same shape as Notion's behavior. Standalone
full-page bases are unaffected (var unset → 0).
This commit is contained in:
Philipinho
2026-04-27 04:44:47 +01:00
parent 583d2d37c4
commit 00e9d1d724
2 changed files with 8 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/client/src/features/base/styles/grid.module.css
+4
View File
@@ -29,6 +29,10 @@
* scrollable region — the user can pan left into it. Standalone * scrollable region — the user can pan left into it. Standalone
* full-page bases never set the var, so it's a no-op there. */ * full-page bases never set the var, so it's a no-op there. */
padding-left: var(--embed-grid-pad-left, 0); padding-left: var(--embed-grid-pad-left, 0);
/* Symmetric right-side padding lets the user scroll past the last
* column into empty space, so wide tables don't end abruptly at
* the viewport edge. */
padding-right: var(--embed-grid-pad-right, 0);
} }
.headerRow { .headerRow {
apps/client/src/features/editor/components/base-embed/base-embed-view.tsx
+4
View File
@@ -28,6 +28,10 @@ function applyExtension(wrapper: HTMLDivElement) {
wrapper.style.setProperty("--embed-extend-l", `${extendLeft}px`); wrapper.style.setProperty("--embed-extend-l", `${extendLeft}px`);
wrapper.style.setProperty("--embed-extend-r", `${extendRight}px`); wrapper.style.setProperty("--embed-extend-r", `${extendRight}px`);
wrapper.style.setProperty("--embed-grid-pad-left", `${extendLeft}px`); wrapper.style.setProperty("--embed-grid-pad-left", `${extendLeft}px`);
// Symmetric right-side padding so the user can pan past the last
// column into empty space — same behaviour as Notion, gives the
// table breathing room on the right when scrolled fully right.
wrapper.style.setProperty("--embed-grid-pad-right", `${extendRight}px`);
// Drop the standalone "panel" frame: inline databases read as part // Drop the standalone "panel" frame: inline databases read as part
// of the document, with only cell separators as gridlines. // of the document, with only cell separators as gridlines.
wrapper.style.setProperty("--grid-outer-border", "none"); wrapper.style.setProperty("--grid-outer-border", "none");