ckaczor/azuredatastudio
1
0
Fork 0
mirror of https://github.com/ckaczor/azuredatastudio.git synced 2026-01-25 09:35:37 -05:00
Code Issues Packages Projects Releases Wiki Activity

fix connection dialog scroll issue (#12956)

Browse Source
This commit is contained in:
Alan Ren
2020-10-16 11:09:30 -07:00
committed by GitHub
parent 767465edbf
commit 49983a6f05
3 changed files with 20 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
src/sql/workbench/services/connection/browser/connectionDialogWidget.ts
View File

@@ -56,6 +56,8 @@ export class ConnectionDialogWidget extends Modal {
private _noRecentConnection: HTMLElement;
private _savedConnection: HTMLElement;
private _noSavedConnection: HTMLElement;
private _recentConnectionActionBarContainer: HTMLElement;
private _connectionTypeContainer: HTMLElement;
private _connectionDetailTitle: HTMLElement;
private _connectButton: Button;
private _closeButton: Button;
@@ -93,8 +95,6 @@ export class ConnectionDialogWidget extends Modal {
private _connecting = false;
private orthogonalSize = 0;
constructor(
private providerDisplayNameOptions: string[],
private selectedProviderType: string,
@@ -198,6 +198,7 @@ export class ConnectionDialogWidget extends Modal {
DOM.hide(this._savedConnection);
this._panel = new TabbedPanel(this._body);
this._panel.element.style.margin = '0px 10px';
attachTabbedPanelStyler(this._panel, this._themeService);
this._recentConnectionTabId = this._panel.pushTab({
identifier: 'recent_connection',
@@ -206,7 +207,9 @@ export class ConnectionDialogWidget extends Modal {
render: c => {
c.append(recentConnectionTab);
},
layout: () => { },
layout: (dimension: DOM.Dimension) => {
this._recentConnectionTree.layout(dimension.height - DOM.getTotalHeight(this._recentConnectionActionBarContainer));
},
focus: () => this._recentConnectionTree.domFocus()
}
});
@@ -215,7 +218,9 @@ export class ConnectionDialogWidget extends Modal {
identifier: 'saved_connection',
title: localize('savedConnectionTitle', "Saved Connections"),
view: {
layout: () => { },
layout: (dimension: DOM.Dimension) => {
this._savedConnectionTree.layout(dimension.height, dimension.width);
},
render: c => {
c.append(savedConnectionTab);
},
@@ -284,8 +289,8 @@ export class ConnectionDialogWidget extends Modal {
this._connectionDetailTitle.innerText = localize('connectionDetailsTitle', "Connection Details");
const tableContainer = DOM.append(this._body, DOM.$('.connection-type'));
const table = DOM.append(tableContainer, DOM.$('table.connection-table-content'));
this._connectionTypeContainer = DOM.append(this._body, DOM.$('.connection-type'));
const table = DOM.append(this._connectionTypeContainer, DOM.$('table.connection-table-content'));
DialogHelper.appendInputSelectBox(
DialogHelper.appendRow(table, connectTypeLabel, 'connection-label', 'connection-input'), this._providerTypeSelectBox);
@@ -379,8 +384,8 @@ export class ConnectionDialogWidget extends Modal {
private createRecentConnectionList(): void {
const recentConnectionContainer = DOM.append(this._recentConnection, DOM.$('.connection-recent-content'));
const container = DOM.append(recentConnectionContainer, DOM.$('.recent-titles-container'));
const actionsContainer = DOM.append(container, DOM.$('.connection-history-actions'));
this._recentConnectionActionBarContainer = DOM.append(recentConnectionContainer, DOM.$('.recent-titles-container'));
const actionsContainer = DOM.append(this._recentConnectionActionBarContainer, DOM.$('.connection-history-actions'));
this._actionbar = this._register(new ActionBar(actionsContainer, { animated: false }));
const clearAction = this.instantiationService.createInstance(ClearRecentConnectionsAction, ClearRecentConnectionsAction.ID, ClearRecentConnectionsAction.LABEL);
clearAction.useConfirmationMessage = true;
@@ -506,10 +511,7 @@ export class ConnectionDialogWidget extends Modal {
}
protected layout(height: number): void {
// Height is the overall height. Since we're laying out a specific component, always get its actual height
const width = DOM.getContentWidth(this._body);
this.orthogonalSize = width;
this._panel.layout(new DOM.Dimension(this.orthogonalSize, height - 38 - 35 - 326)); // height - connection title - connection type input - connection widget
this._panel.layout(new DOM.Dimension(this._panel.element.clientWidth, this._panel.element.clientHeight));
}
/**

5
src/sql/workbench/services/connection/browser/media/connectionDialog.css
View File

@@ -167,8 +167,3 @@
/* Hide twisties */
display: none !important;
}
.connection-dialog .tabbedPanel .tabList,
.connection-dialog .tabbedPanel .tabBody {
padding-left: 10px;
}