Connection Dialog: Database dropdown followup issues fix (#662)

* databases now sorted order in dropdown

* fixed bug ESC bug for conn dialog

* pressing ESC now only closes dropdown instead of conn dialog

* changed dropdown arrow to look similar to other arrows

* align dropdown tree and spacing for all dropdowns

* fixed bug where pressing esc would close conn dialog after option is chosen
This commit is contained in:
Aditya Bist
2018-02-13 12:38:51 -08:00
committed by GitHub
parent 4b51d9b386
commit 040549d264
10 changed files with 84 additions and 18 deletions

View File

@@ -198,7 +198,7 @@ export class Dropdown extends Disposable {
}
}, 0);
let height = filteredLength * this._renderer.getHeight(undefined, undefined) > this._options.maxHeight ? this._options.maxHeight : filteredLength * this._renderer.getHeight(undefined, undefined);
this.$treeContainer.style('height', height + 'px').style('width', DOM.getContentWidth(this.$input.getHTMLElement()) + 'px');
this.$treeContainer.style('height', height + 'px').style('width', DOM.getContentWidth(this.$input.getHTMLElement()) - 2 + 'px');
this._tree.layout(parseInt(this.$treeContainer.style('height')));
this._tree.refresh();
}
@@ -239,7 +239,7 @@ export class Dropdown extends Disposable {
this._filter.filterString = '';
this._dataSource.options = vals.map(i => { return { value: i }; });
let height = this._dataSource.options.length * 22 > this._options.maxHeight ? this._options.maxHeight : this._dataSource.options.length * 22;
this.$treeContainer.style('height', height + 'px').style('width', DOM.getContentWidth(this.$input.getHTMLElement()) + 'px');
this.$treeContainer.style('height', height + 'px').style('width', DOM.getContentWidth(this.$input.getHTMLElement()) - 2 + 'px');
this._tree.layout(parseInt(this.$treeContainer.style('height')));
this._tree.setInput(new DropdownModel());
this._input.validate();

View File

@@ -25,3 +25,13 @@
.dropdown-tree .list-row {
margin-left: -33px;
}
.connection-input .dropdown .monaco-action-bar .action-label.icon.dropdown-arrow {
background-position: 50%;
background-size: cover;
}
.connection-input .monaco-action-bar .action-item .icon {
width: 8px;
height: 8px;
}