Remove properties widget height calculations (#10152)

* Remove height calculations

* Remove custom height setting

* Fix compile errors
This commit is contained in:
Charles Gagnon
2020-04-24 11:36:45 -07:00
committed by GitHub
parent 1e8a9c47cb
commit a018058169
11 changed files with 43 additions and 44 deletions

View File

@@ -0,0 +1,9 @@
/*---------------------------------------------------------------------------------------------
* Copyright (c) Microsoft Corporation. All rights reserved.
* Licensed under the Source EULA. See License.txt in the project root for license information.
*--------------------------------------------------------------------------------------------*/
modelview-properties-container properties-container {
display: inline-block;
width: 100%;
}

View File

@@ -3,6 +3,7 @@
* Licensed under the Source EULA. See License.txt in the project root for license information.
*--------------------------------------------------------------------------------------------*/
import 'vs/css!./media/propertiesContainer';
import {
Component, Input, Inject, ChangeDetectorRef, forwardRef,
ViewChild, ElementRef, OnDestroy

View File

@@ -21,7 +21,6 @@ import { DASHBOARD_BORDER } from 'vs/workbench/common/theme';
import { IColorTheme } from 'vs/platform/theme/common/themeService';
import { IWorkbenchThemeService } from 'vs/workbench/services/themes/common/workbenchThemeService';
import { contrastBorder } from 'vs/platform/theme/common/colorRegistry';
import { PropertiesWidgetComponent } from 'sql/workbench/contrib/dashboard/browser/widgets/properties/propertiesWidget.component';
@Component({
selector: 'dashboard-home-container',
@@ -30,8 +29,7 @@ import { PropertiesWidgetComponent } from 'sql/workbench/contrib/dashboard/brows
<div class="fullsize" style="display: flex; flex-direction: column">
<div>
<div #propertiesContainer>
<dashboard-widget-wrapper #propertiesClass *ngIf="properties" [collapsable]="true" [bottomCollapse]="true" [toggleMore]="false" [_config]="properties"
class="properties" [style.height.px]="_propertiesClass?.collapsed ? '30' : getHeight()">
<dashboard-widget-wrapper #propertiesClass *ngIf="properties" [collapsable]="true" [bottomCollapse]="true" [toggleMore]="false" [_config]="properties" class="properties">
</dashboard-widget-wrapper>
</div>
<widget-content style="flex: 1" [scrollContent]="false" [widgets]="widgets" [originalConfig]="tab.originalConfig" [context]="tab.context">
@@ -45,8 +43,6 @@ export class DashboardHomeContainer extends DashboardWidgetContainer {
@ViewChild('propertiesClass') private _propertiesClass: DashboardWidgetWrapper;
@ViewChild('propertiesContainer') private _propertiesContainer: ElementRef;
private height = 75; // default initial height
constructor(
@Inject(forwardRef(() => ChangeDetectorRef)) _cd: ChangeDetectorRef,
@Inject(forwardRef(() => CommonServiceInterface)) protected dashboardService: DashboardServiceInterface,
@@ -85,14 +81,6 @@ export class DashboardHomeContainer extends DashboardWidgetContainer {
}));
}
public getHeight(): number {
if (this._propertiesClass && (<PropertiesWidgetComponent>this._propertiesClass.component).height) {
this.height = (<PropertiesWidgetComponent>this._propertiesClass.component).height;
}
return this.height;
}
private updateTheme(theme: IColorTheme): void {
const border = theme.getColor(DASHBOARD_BORDER);
if (theme.getColor(contrastBorder)) {

View File

@@ -17,5 +17,5 @@
<ng-template component-host>
</ng-template>
</ng-template>
<span #bottomActionbar class="bottomActionbar"></span>
<span #bottomActionbar class="bottomActionbar {{collapsed ? 'collapsed' : ''}}"></span>
</div>

View File

@@ -40,17 +40,18 @@ dashboard-widget-wrapper .noTitle {
}
dashboard-widget-wrapper .actionbar {
flex: 0 0 auto;
align-self: end;
}
dashboard-widget-wrapper .bottomActionbar {
flex: 0 0 auto;
align-self: center;
margin-top: -27px;
display: none;
}
dashboard-widget-wrapper .bottomActionbar.collapsed {
margin-top: -27px;
}
dashboard-widget-wrapper .bottomActionbar .actions-container .action-item a.action-label.codicon-chevron-up {
padding-left: 5px;
}

View File

@@ -16,7 +16,6 @@ import { Registry } from 'vs/platform/registry/common/platform';
import { ILogService } from 'vs/platform/log/common/log';
import { subscriptionToDisposable } from 'sql/base/browser/lifecycle';
import { PropertiesContainer, PropertyItem } from 'sql/base/browser/ui/propertiesContainer/propertiesContainer.component';
import { convertSizeToNumber } from 'sql/base/browser/dom';
export interface PropertiesConfig {
properties: Array<Property>;
@@ -53,8 +52,8 @@ const dashboardRegistry = Registry.as<IDashboardRegistry>(DashboardExtensions.Da
@Component({
selector: 'properties-widget',
template: `
<loading-spinner [loading]="_loading" [loadingMessage]="loadingMessage" [loadingCompletedMessage]="loadingCompletedMessage"></loading-spinner>
<properties-container></properties-container>`
<loading-spinner *ngIf="_loading" [loading]="_loading" [loadingMessage]="loadingMessage" [loadingCompletedMessage]="loadingCompletedMessage"></loading-spinner>
<properties-container [style.display]="_loading ? 'none' : ''"></properties-container>`
})
export class PropertiesWidgetComponent extends DashboardWidget implements IDashboardWidget, OnInit {
@ViewChild(PropertiesContainer) private _propertiesContainer: PropertiesContainer;
@@ -207,10 +206,6 @@ export class PropertiesWidgetComponent extends DashboardWidget implements IDashb
value: propertyObject
};
});
if (this._inited) {
this._changeRef.detectChanges();
}
}
private getConditionResult(item: FlavorProperties, conditionItem: ConditionProperties): boolean {
@@ -248,8 +243,4 @@ export class PropertiesWidgetComponent extends DashboardWidget implements IDashb
}
return val;
}
public get height(): number {
return convertSizeToNumber(this._propertiesContainer.height);
}
}