Microsoft/vscode
1
0
Fork 0
mirror of https://github.com/microsoft/vscode.git synced 2026-04-24 10:38:59 +01:00
Code Issues Packages Projects Releases Wiki Activity

Right align actions tree view (#295266)

Browse Source 
* WIP: keep actions visible when tree has horizontal scroll
Fixes #251722

* feat(npm): fixed conssitency of right side aligned buttons

* Fix TreeView action alignment during horizontal scrolling

Offset actions using --list-scroll-right-offset so they remain
aligned to the viewport edge. Apply only to rows containing
action items and adjust spacing for correct visual alignment.

* fixed extra space issue on nodes having file decoraters

* Remove known variable - will add back in a separate PR

---------

Co-authored-by: Alex Ross <38270282+alexr00@users.noreply.github.com>
This commit is contained in:
Sam Shubham
2026-02-17 21:48:40 +05:30
committed by GitHub
parent 6e848fc475
commit a102af468e
2 changed files with 40 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/vs/base/browser/ui/list/listView.ts
View File

@@ -370,6 +370,7 @@ export class ListView<T> implements IListView<T> {
this.scrollableElementWidthDelayer.cancel();
this.scrollableElement.setScrollDimensions({ width: this.renderWidth, scrollWidth: this.renderWidth });
this.rowsContainer.style.width = '';
this.domNode.style.removeProperty('--list-scroll-right-offset');
}
}
@@ -894,6 +895,11 @@ export class ListView<T> implements IListView<T> {
this.scrollableElement.setScrollDimensions({
width: typeof width === 'number' ? width : getContentWidth(this.domNode)
});
const scrollPos = this.scrollableElement.getScrollPosition();
const scrollDims = this.scrollableElement.getScrollDimensions();
const rightOffset = Math.max(0, scrollDims.scrollWidth - scrollPos.scrollLeft - this.renderWidth);
this.domNode.style.setProperty('--list-scroll-right-offset', `${Math.max(rightOffset - 12, 0)}px`);
}
}
@@ -935,6 +941,8 @@ export class ListView<T> implements IListView<T> {
if (this.horizontalScrolling && scrollWidth !== undefined) {
this.rowsContainer.style.width = `${Math.max(scrollWidth, this.renderWidth)}px`;
const rightOffset = Math.max(0, scrollWidth - (renderLeft ?? 0) - this.renderWidth);
this.domNode.style.setProperty('--list-scroll-right-offset', `${Math.max(rightOffset - 12, 0)}px`);
}
this.lastRenderTop = renderTop;