align with portal button style (#14187)

* align with portal button style

* fix welcome page

* image button

* more fixes

* use withProperties

* add comment back

* add border radius
This commit is contained in:
Alan Ren
2021-02-08 15:12:54 -08:00
committed by GitHub
parent 7a0ac71b98
commit a3cddbc8aa
67 changed files with 384 additions and 251 deletions

View File

@@ -168,11 +168,13 @@ export class AzureSettingsPage extends BasePage {
this.signInButton = view.modelBuilder.button().withProperties<azdata.ButtonProperties>({
label: localizedConstants.signIn,
width: '100px'
width: '100px',
secondary: true
}).component();
this.refreshButton = view.modelBuilder.button().withProperties<azdata.ButtonProperties>({
label: localizedConstants.refresh,
width: '100px'
width: '100px',
secondary: true
}).component();
this.signInButton.onDidClick(async (event) => {

View File

@@ -107,11 +107,13 @@ export class AzureSettingsPage extends BasePage {
this.signInButton = view.modelBuilder.button().withProperties<azdata.ButtonProperties>({
label: localizedConstants.signIn,
width: '100px'
width: '100px',
secondary: true
}).component();
this.refreshButton = view.modelBuilder.button().withProperties<azdata.ButtonProperties>({
label: localizedConstants.refresh,
width: '100px'
width: '100px',
secondary: true
}).component();
this.signInButton.onDidClick(async (event) => {

View File

@@ -87,7 +87,7 @@ export class TargetClusterContextPage extends ResourceTypePage {
configFileLabel.width = labelWidth;
this.configFileInput = this.view!.modelBuilder.inputBox().withProperties({ width: '300px' }).component();
this.configFileInput.enabled = false;
this.browseFileButton = this.view!.modelBuilder.button().withProperties({ label: localize('deployCluster.browseText', "Browse"), width: '100px' }).component();
this.browseFileButton = this.view!.modelBuilder.button().withProperties({ label: localize('deployCluster.browseText', "Browse"), width: '100px', secondary: true }).component();
let configFileContainer = this.view!.modelBuilder.flexContainer()
.withLayout({ flexFlow: 'row', alignItems: 'baseline' })
.withItems([configFileLabel, this.configFileInput, this.browseFileButton], { CSSStyles: { 'margin-right': '10px' } }).component();

View File

@@ -868,7 +868,11 @@ function processFilePickerField(context: FieldContext): FilePickerInputs {
input.labelComponent = label;
context.onNewInputComponentCreated(context.fieldInfo.variableName || context.fieldInfo.label, input);
input.component.enabled = false;
const browseFileButton = context.view!.modelBuilder.button().withProperties<azdata.ButtonProperties>({ label: loc.browse, width: buttonWidth }).component();
const browseFileButton = context.view!.modelBuilder.button().withProps({
label: loc.browse,
width: buttonWidth,
secondary: true
}).component();
const fieldInfo = context.fieldInfo as FilePickerFieldInfo;
let filter: { [name: string]: string[] } | undefined = undefined;
if (fieldInfo.filter) {
@@ -1163,8 +1167,8 @@ function createAzureAccountDropdown(context: AzureAccountFieldContext): AzureAcc
accountDropdown.component.fireOnTextChange = true;
accountDropdown.labelComponent = label;
context.onNewInputComponentCreated(context.fieldInfo.variableName || context.fieldInfo.label, accountDropdown);
const signInButton = context.view!.modelBuilder.button().withProperties<azdata.ButtonProperties>({ label: loc.signIn, width: '100px' }).component();
const refreshButton = context.view!.modelBuilder.button().withProperties<azdata.ButtonProperties>({ label: loc.refresh, width: '100px' }).component();
const signInButton = context.view!.modelBuilder.button().withProps({ label: loc.signIn, width: '100px', secondary: true }).component();
const refreshButton = context.view!.modelBuilder.button().withProps({ label: loc.refresh, width: '100px', secondary: true }).component();
addLabelInputPairToContainer(context.view, context.components, label, accountDropdown.component, context.fieldInfo);
const buttons = createFlexContainer(context.view!, [signInButton, refreshButton], true, undefined, undefined, undefined, { 'margin-right': '10px' });

View File

@@ -142,6 +142,7 @@ export class ToolsAndEulaPage extends ResourceTypePage {
'display': 'none',
},
width: '100px',
secondary: true
}).component();
this.wizard.registerDisposable(this._installToolButton.onDidClick(() => {