.Add types for ModelView CSS properties (#7465)

This commit is contained in:
Charles Gagnon
2019-10-02 11:21:18 -07:00
committed by GitHub
parent 1ea09c7add
commit 79e2c56ec8
13 changed files with 41 additions and 39 deletions

View File

@@ -648,7 +648,6 @@ export class JobDialog extends AgentDialog<JobData> {
private createRowContainer(view: azdata.ModelView): azdata.FlexBuilder {
return view.modelBuilder.flexContainer().withLayout({
flexFlow: 'row',
alignItems: 'left',
justifyContent: 'space-between'
});
}

View File

@@ -301,7 +301,6 @@ export class NotebookDialog extends AgentDialog<NotebookData> {
private createRowContainer(view: azdata.ModelView): azdata.FlexBuilder {
return view.modelBuilder.flexContainer().withLayout({
flexFlow: 'row',
alignItems: 'left',
justifyContent: 'space-between'
});
}

View File

@@ -57,8 +57,7 @@ export class BdcDashboard {
{
flexFlow: 'column',
width: '100%',
height: '100%',
alignItems: 'left'
height: '100%'
}).component();
// ###########
@@ -104,8 +103,7 @@ export class BdcDashboard {
{
flexFlow: 'row',
width: '100%',
height: '100%',
alignItems: 'left'
height: '100%'
}).component();
rootContainer.addItem(this.mainAreaContainer, { flex: '0 0 100%' });
@@ -118,8 +116,7 @@ export class BdcDashboard {
{
flexFlow: 'column',
width: navWidth,
height: '100%',
alignItems: 'left'
height: '100%'
}
).component();

View File

@@ -53,8 +53,7 @@ export class BdcDashboardOverviewPage {
{
flexFlow: 'column',
width: '100%',
height: '100%',
alignItems: 'left'
height: '100%'
}).component();
// ##############
@@ -109,7 +108,7 @@ export class BdcDashboardOverviewPage {
overviewHeaderContainer.addItem(this.lastUpdatedLabel, { CSSStyles: { 'margin-left': '45px' } });
const overviewContainer = view.modelBuilder.flexContainer().withLayout({ flexFlow: 'column', width: '100%', height: '100%', alignItems: 'left' }).component();
const overviewContainer = view.modelBuilder.flexContainer().withLayout({ flexFlow: 'column', width: '100%', height: '100%' }).component();
// Service Status header row
const serviceStatusHeaderRow = view.modelBuilder.flexContainer().withLayout({ flexFlow: 'row' }).component();
@@ -144,7 +143,7 @@ export class BdcDashboardOverviewPage {
.component();
rootContainer.addItem(endpointsLabel, { CSSStyles: { 'padding-left': '10px', ...cssStyles.title } });
const endpointsContainer = view.modelBuilder.flexContainer().withLayout({ flexFlow: 'column', width: '100%', height: '100%', alignItems: 'left' }).component();
const endpointsContainer = view.modelBuilder.flexContainer().withLayout({ flexFlow: 'column', width: '100%', height: '100%' }).component();
// Service endpoints header row
const endpointsHeaderRow = view.modelBuilder.flexContainer().withLayout({ flexFlow: 'row' }).component();

View File

@@ -60,8 +60,7 @@ export class BdcDashboardResourceStatusPage {
{
flexFlow: 'column',
width: '100%',
height: '100%',
alignItems: 'left'
height: '100%'
}).component();
// ##############################

View File

@@ -35,16 +35,14 @@ export class BdcServiceStatusPage {
{
flexFlow: 'column',
width: '100%',
height: '100%',
alignItems: 'left'
height: '100%'
}).component();
this.resourceHeader = this.modelView.modelBuilder.flexContainer().withLayout(
{
flexFlow: 'row',
width: '100%',
height: '25px',
alignItems: 'left'
height: '25px'
}
).component();

View File

@@ -15,14 +15,12 @@ export function registerBooksWidget(bookContributionProvider: BookContributionPr
const container = view.modelBuilder.flexContainer().withLayout({
flexFlow: 'column',
width: '100%',
height: '100%',
alignItems: 'left'
height: '100%'
}).component();
const bookslocationContainer = view.modelBuilder.flexContainer().withLayout({
flexFlow: 'column',
width: '270px',
height: '100%',
alignItems: 'left',
position: 'absolute'
}).component();

View File

@@ -65,7 +65,7 @@ export function registerServiceEndpoints(context: vscode.ExtensionContext): void
.sort((e1, e2) => e1.endpoint.localeCompare(e2.endpoint));
endpointsArray.unshift(...sqlServerMasterEndpoints);
const container = view.modelBuilder.flexContainer().withLayout({ flexFlow: 'column', width: '100%', height: '100%', alignItems: 'left' }).component();
const container = view.modelBuilder.flexContainer().withLayout({ flexFlow: 'column', width: '100%', height: '100%' }).component();
endpointsArray.forEach(endpointInfo => {
const endPointRow = view.modelBuilder.flexContainer().withLayout({ flexFlow: 'row' }).component();
const nameCell = view.modelBuilder.text().withProperties<azdata.TextComponentProperties>({ value: endpointInfo.description }).component();
@@ -103,7 +103,7 @@ export function registerServiceEndpoints(context: vscode.ExtensionContext): void
container.addItem(endPointRow, { CSSStyles: { 'padding-left': '10px', 'border-top': 'solid 1px #ccc', 'box-sizing': 'border-box', 'user-select': 'text' } });
});
const endpointsContainer = view.modelBuilder.flexContainer().withLayout({ flexFlow: 'column', width: '540px', height: '100%', alignItems: 'left', position: 'absolute' }).component();
const endpointsContainer = view.modelBuilder.flexContainer().withLayout({ flexFlow: 'column', width: '540px', height: '100%', position: 'absolute' }).component();
endpointsContainer.addItem(container, { CSSStyles: { 'padding-top': '25px', 'padding-left': '5px' } });
await view.initializeModel(endpointsContainer);

View File

@@ -214,7 +214,7 @@ function processFields(fieldInfoArray: FieldInfo[], components: azdata.Component
export function createFlexContainer(view: azdata.ModelView, items: azdata.Component[], rowLayout: boolean = true): azdata.FlexContainer {
const flexFlow = rowLayout ? 'row' : 'column';
const alignItems = rowLayout ? 'center' : '';
const alignItems = rowLayout ? 'center' : undefined;
const itemsStyle = rowLayout ? { CSSStyles: { 'margin-right': '5px' } } : {};
return view.modelBuilder.flexContainer().withItems(items, itemsStyle).withLayout({ flexFlow: flexFlow, alignItems: alignItems }).component();
}

View File

@@ -54,7 +54,7 @@ export class ResourceTypePickerDialog extends DialogBase {
const tableWidth = 1126;
this._view = view;
this.resourceTypeService.getResourceTypes().forEach(resourceType => this.addCard(resourceType));
const cardsContainer = view.modelBuilder.flexContainer().withItems(this._resourceTypeCards, { flex: '0 0 auto', CSSStyles: { 'margin-bottom': '10px' } }).withLayout({ flexFlow: 'row', alignItems: 'left' }).component();
const cardsContainer = view.modelBuilder.flexContainer().withItems(this._resourceTypeCards, { flex: '0 0 auto', CSSStyles: { 'margin-bottom': '10px' } }).withLayout({ flexFlow: 'row' }).component();
this._resourceDescriptionLabel = view.modelBuilder.text().withProperties<azdata.TextComponentProperties>({ value: this._selectedResourceType ? this._selectedResourceType.description : undefined }).component();
this._optionsContainer = view.modelBuilder.flexContainer().withLayout({ flexFlow: 'column' }).component();
this._agreementContainer = view.modelBuilder.divContainer().component();