ckaczor/azuredatastudio
1
0
Fork 0
mirror of https://github.com/ckaczor/azuredatastudio.git synced 2026-02-16 18:46:40 -05:00
Code Issues Packages Projects Releases Wiki Activity

Adding visual label to find node widget (#23197)

Browse Source
This commit is contained in:
Aasim Khan
2023-05-24 10:21:38 -07:00
committed by GitHub
parent 9f3ce333af
commit a1c5adf4b2
2 changed files with 17 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
src/sql/workbench/contrib/executionPlan/browser/media/executionPlan.css
View File

@@ -69,7 +69,12 @@ However we always want it to be the width of the container it is resizing.
flex-direction: row; flex-direction: row;
padding: 5px; padding: 5px;
height: auto; height: auto;
width: 420px; width: 460px;
}
.eps-container .execution-plan .plan .plan-action-container .search-node-widget .property-name-label {
flex: 0 60px;
line-height: 26px
} }
/* input bar styling in search node action view */ /* input bar styling in search node action view */

13
src/sql/workbench/contrib/executionPlan/browser/widgets/nodeSearchWidget.ts
View File

@@ -53,11 +53,20 @@ export class NodeSearchWidget extends ExecutionPlanWidgetBase {
@IThemeService public readonly themeService: IThemeService @IThemeService public readonly themeService: IThemeService
) { ) {
super(DOM.$('.search-node-widget'), 'searchWidget'); super(DOM.$('.search-node-widget'), 'searchWidget');
const labelId = 'search-node-widget-label';
const dialogLabel = localize('executionPlanFindNodeLabel', 'Find nodes');
this.container.setAttribute('role', 'dialog');
this.container.setAttribute('aria-labelledby', labelId);
const label = DOM.$('label.property-name-label');
label.innerText = dialogLabel;
label.id = labelId;
this.container.appendChild(label);
// property name dropdown // property name dropdown
this._propertyNameSelectBoxContainer = DOM.$('.search-widget-property-name-select-box .dropdown-container'); this._propertyNameSelectBoxContainer = DOM.$('.search-widget-property-name-select-box .dropdown-container');
this.container.appendChild(this._propertyNameSelectBoxContainer); this.container.appendChild(this._propertyNameSelectBoxContainer);
this._propertyNameSelectBoxContainer.style.width = '150px'; this._propertyNameSelectBoxContainer.style.width = '120px';
const propDropdownOptions = this._executionPlanDiagram.getUniqueElementProperties(); const propDropdownOptions = this._executionPlanDiagram.getUniqueElementProperties();
this._propertyNameSelectBox = this._register(new SelectBox(propDropdownOptions, propDropdownOptions[0], this.contextViewService, this._propertyNameSelectBoxContainer)); this._propertyNameSelectBox = this._register(new SelectBox(propDropdownOptions, propDropdownOptions[0], this.contextViewService, this._propertyNameSelectBoxContainer));
@@ -148,7 +157,7 @@ export class NodeSearchWidget extends ExecutionPlanWidgetBase {
// Initial focus is set to the search text input box // Initial focus is set to the search text input box
public focus() { public focus() {
this._searchTextInputBox.focus(); this._propertyNameSelectBox.focus();
} }
public searchNodes(): void { public searchNodes(): void {