mirror of
https://github.com/ckaczor/azuredatastudio.git
synced 2026-01-20 09:35:38 -05:00
Adding visual label to find node widget (#23197)
This commit is contained in:
@@ -69,7 +69,12 @@ However we always want it to be the width of the container it is resizing.
|
||||
flex-direction: row;
|
||||
padding: 5px;
|
||||
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 */
|
||||
|
||||
@@ -53,11 +53,20 @@ export class NodeSearchWidget extends ExecutionPlanWidgetBase {
|
||||
@IThemeService public readonly themeService: IThemeService
|
||||
) {
|
||||
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
|
||||
this._propertyNameSelectBoxContainer = DOM.$('.search-widget-property-name-select-box .dropdown-container');
|
||||
this.container.appendChild(this._propertyNameSelectBoxContainer);
|
||||
this._propertyNameSelectBoxContainer.style.width = '150px';
|
||||
this._propertyNameSelectBoxContainer.style.width = '120px';
|
||||
|
||||
const propDropdownOptions = this._executionPlanDiagram.getUniqueElementProperties();
|
||||
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
|
||||
public focus() {
|
||||
this._searchTextInputBox.focus();
|
||||
this._propertyNameSelectBox.focus();
|
||||
}
|
||||
|
||||
public searchNodes(): void {
|
||||
|
||||
Reference in New Issue
Block a user