ckaczor/azuredatastudio
1
0
Fork 0
mirror of https://github.com/ckaczor/azuredatastudio.git synced 2026-01-23 17:23:02 -05:00
Code Issues Packages Projects Releases Wiki Activity

align with portal button style (#14187)

Browse Source 
* 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
Download Patch File Download Diff File Expand all files Collapse all files

2
src/sql/workbench/contrib/assessment/browser/asmtResultsView.component.ts
View File

@@ -19,7 +19,6 @@ import { IInstantiationService } from 'vs/platform/instantiation/common/instanti
import { IDashboardService } from 'sql/platform/dashboard/browser/dashboardService';
import { IWorkbenchThemeService } from 'vs/workbench/services/themes/common/workbenchThemeService';
import { IColorTheme } from 'vs/platform/theme/common/themeService';
import { attachButtonStyler } from 'sql/platform/theme/common/styler';
import { RowDetailView, ExtendedItem } from 'sql/base/browser/ui/table/plugins/rowDetailView';
import {
IAssessmentComponent,
@@ -46,6 +45,7 @@ import { ITableStyles } from 'sql/base/browser/ui/table/interfaces';
import { TelemetryView } from 'sql/platform/telemetry/common/telemetryKeys';
import { LocalizedStrings } from 'sql/workbench/contrib/assessment/common/strings';
import { ConnectionManagementInfo } from 'sql/platform/connection/common/connectionManagementInfo';
import { attachButtonStyler } from 'vs/platform/theme/common/styler';
export const ASMTRESULTSVIEW_SELECTOR: string = 'asmt-results-view-component';
export const ROW_HEIGHT: number = 25;

11
src/sql/workbench/contrib/backup/browser/backup.component.ts
View File

@@ -11,7 +11,7 @@ import { Checkbox } from 'sql/base/browser/ui/checkbox/checkbox';
import { InputBox } from 'sql/base/browser/ui/inputBox/inputBox';
import { ListBox } from 'sql/base/browser/ui/listBox/listBox';
import { SelectBox } from 'sql/base/browser/ui/selectBox/selectBox';
import { attachButtonStyler, attachListBoxStyler, attachInputBoxStyler, attachSelectBoxStyler, attachCheckboxStyler } from 'sql/platform/theme/common/styler';
import { attachListBoxStyler, attachInputBoxStyler, attachSelectBoxStyler, attachCheckboxStyler } from 'sql/platform/theme/common/styler';
import { IConnectionProfile } from 'sql/platform/connection/common/interfaces';
import * as BackupConstants from 'sql/workbench/contrib/backup/common/constants';
import { IBackupService, TaskExecutionMode } from 'sql/platform/backup/common/backupService';
@@ -34,6 +34,7 @@ import { AngularDisposable } from 'sql/base/browser/lifecycle';
import { SIDE_BAR_BACKGROUND } from 'vs/workbench/common/theme';
import { fileFiltersSet } from 'sql/workbench/services/restore/common/constants';
import { IColorTheme } from 'vs/platform/theme/common/themeService';
import { attachButtonStyler } from 'vs/platform/theme/common/styler';
export const BACKUP_SELECTOR: string = 'backup-component';
@@ -292,11 +293,11 @@ export class BackupComponent extends AngularDisposable {
this.pathListBox.render(this.pathElement!.nativeElement);
// Set backup path add/remove buttons
this.addPathButton = this._register(new Button(this.addPathElement!.nativeElement));
this.addPathButton = this._register(new Button(this.addPathElement!.nativeElement, { secondary: true }));
this.addPathButton.label = '+';
this.addPathButton.title = localize('addFile', "Add a file");
this.removePathButton = this._register(new Button(this.removePathElement!.nativeElement));
this.removePathButton = this._register(new Button(this.removePathElement!.nativeElement, { secondary: true }));
this.removePathButton.label = '-';
this.removePathButton.title = localize('removeFile', "Remove files");
@@ -401,7 +402,7 @@ export class BackupComponent extends AngularDisposable {
private addFooterButtons(): void {
// Set script footer button
this.scriptButton = this._register(new Button(this.scriptButtonElement!.nativeElement));
this.scriptButton = this._register(new Button(this.scriptButtonElement!.nativeElement, { secondary: true }));
this.scriptButton.label = localize('backupComponent.script', "Script");
this.scriptButton.onDidClick(() => this.onScript());
this._register(attachButtonStyler(this.scriptButton, this.themeService));
@@ -415,7 +416,7 @@ export class BackupComponent extends AngularDisposable {
this.backupEnabled = false;
// Set cancel footer button
this.cancelButton = this._register(new Button(this.cancelButtonElement!.nativeElement));
this.cancelButton = this._register(new Button(this.cancelButtonElement!.nativeElement, { secondary: true }));
this.cancelButton.label = localize('backupComponent.cancel', "Cancel");
this.cancelButton.onDidClick(() => this.onCancel());
this._register(attachButtonStyler(this.cancelButton, this.themeService));

2
src/sql/workbench/contrib/jobManagement/browser/jobsView.component.ts
View File

@@ -30,10 +30,10 @@ import { escape } from 'sql/base/common/strings';
import { IWorkbenchThemeService } from 'vs/workbench/services/themes/common/workbenchThemeService';
import { tableBackground, cellBackground, cellBorderColor } from 'sql/platform/theme/common/colors';
import { TelemetryView } from 'sql/platform/telemetry/common/telemetryKeys';
import { attachButtonStyler } from 'sql/platform/theme/common/styler';
import { IColorTheme } from 'vs/platform/theme/common/themeService';
import { onUnexpectedError } from 'vs/base/common/errors';
import { IAdsTelemetryService } from 'sql/platform/telemetry/common/telemetry';
import { attachButtonStyler } from 'vs/platform/theme/common/styler';
export const JOBSVIEW_SELECTOR: string = 'jobsview-component';
export const ROW_HEIGHT: number = 45;

2
src/sql/workbench/contrib/jobManagement/browser/notebooksView.component.ts
View File

@@ -30,11 +30,11 @@ import { escape } from 'sql/base/common/strings';
import { IWorkbenchThemeService } from 'vs/workbench/services/themes/common/workbenchThemeService';
import { tableBackground, cellBackground, cellBorderColor } from 'sql/platform/theme/common/colors';
import { TelemetryView } from 'sql/platform/telemetry/common/telemetryKeys';
import { attachButtonStyler } from 'sql/platform/theme/common/styler';
import { Taskbar } from 'sql/base/browser/ui/taskbar/taskbar';
import { onUnexpectedError } from 'vs/base/common/errors';
import { IColorTheme } from 'vs/platform/theme/common/themeService';
import { IAdsTelemetryService } from 'sql/platform/telemetry/common/telemetry';
import { attachButtonStyler } from 'vs/platform/theme/common/styler';
export const NOTEBOOKSVIEW_SELECTOR: string = 'notebooksview-component';

3
src/sql/workbench/contrib/objectExplorer/browser/serverTreeView.ts
View File

@@ -8,7 +8,7 @@ import * as errors from 'vs/base/common/errors';
import { IInstantiationService, ServicesAccessor } from 'vs/platform/instantiation/common/instantiation';
import Severity from 'vs/base/common/severity';
import { IThemeService } from 'vs/platform/theme/common/themeService';
import { attachListStyler } from 'vs/platform/theme/common/styler';
import { attachButtonStyler, attachListStyler } from 'vs/platform/theme/common/styler';
import { ISelectionEvent, ITree } from 'vs/base/parts/tree/browser/tree';
import { Disposable } from 'vs/base/common/lifecycle';
import { localize } from 'vs/nls';
@@ -27,7 +27,6 @@ import { TreeSelectionHandler } from 'sql/workbench/services/objectExplorer/brow
import { IObjectExplorerService, IServerTreeView } from 'sql/workbench/services/objectExplorer/browser/objectExplorerService';
import { IConnectionProfile } from 'sql/platform/connection/common/interfaces';
import { Button } from 'sql/base/browser/ui/button/button';
import { attachButtonStyler } from 'sql/platform/theme/common/styler';
import { TreeNode, TreeItemCollapsibleState } from 'sql/workbench/services/objectExplorer/common/treeNode';
import { IErrorMessageService } from 'sql/platform/errorMessage/common/errorMessageService';
import { ServerTreeActionProvider } from 'sql/workbench/services/objectExplorer/browser/serverTreeActionProvider';

3
src/sql/workbench/contrib/resourceViewer/browser/resourceViewerTable.ts
View File

@@ -6,7 +6,7 @@
import 'vs/css!./media/resourceViewerTable';
import * as azdata from 'azdata';
import { Table } from 'sql/base/browser/ui/table/table';
import { attachTableStyler, attachButtonStyler } from 'sql/platform/theme/common/styler';
import { attachTableStyler } from 'sql/platform/theme/common/styler';
import { RowSelectionModel } from 'sql/base/browser/ui/table/plugins/rowSelectionModel.plugin';
import { IWorkbenchThemeService } from 'vs/workbench/services/themes/common/workbenchThemeService';
@@ -24,6 +24,7 @@ import { ColumnDefinition } from 'sql/workbench/browser/editor/resourceViewer/re
import { Emitter } from 'vs/base/common/event';
import { ContextMenuAnchor } from 'sql/workbench/contrib/resourceViewer/browser/resourceViewerEditor';
import { LoadingSpinnerPlugin } from 'sql/base/browser/ui/table/plugins/loadingSpinner.plugin';
import { attachButtonStyler } from 'vs/platform/theme/common/styler';
export class ResourceViewerTable extends Disposable {

2
src/sql/workbench/contrib/webview/browser/webViewDialog.ts
View File

@@ -6,7 +6,6 @@
import { Button } from 'sql/base/browser/ui/button/button';
import { Modal } from 'sql/workbench/browser/modal/modal';
import * as TelemetryKeys from 'sql/platform/telemetry/common/telemetryKeys';
import { attachButtonStyler } from 'sql/platform/theme/common/styler';
import { IThemeService } from 'vs/platform/theme/common/themeService';
import { Event, Emitter } from 'vs/base/common/event';
import { IContextKeyService } from 'vs/platform/contextkey/common/contextkey';
@@ -20,6 +19,7 @@ import { ITextResourcePropertiesService } from 'vs/editor/common/services/textRe
import { IAdsTelemetryService } from 'sql/platform/telemetry/common/telemetry';
import { attachModalDialogStyler } from 'sql/workbench/common/styler';
import { ILayoutService } from 'vs/platform/layout/browser/layoutService';
import { attachButtonStyler } from 'vs/platform/theme/common/styler';
export class WebViewDialog extends Modal {

24
src/sql/workbench/contrib/welcome/page/browser/welcomePage.ts
View File

@@ -28,9 +28,9 @@ import { IWorkbenchExtensionEnablementService, EnablementState, IExtensionRecomm
import { ILifecycleService, StartupKind } from 'vs/platform/lifecycle/common/lifecycle';
import { Disposable } from 'vs/base/common/lifecycle';
import { splitName } from 'vs/base/common/labels';
import { registerThemingParticipant } from 'vs/platform/theme/common/themeService';
import { buttonSecondaryBackground, buttonSecondaryBorder, buttonSecondary, buttonSecondaryHoverColor, tileBorder, disabledButton, disabledButtonBackground, gradientOne, gradientTwo, gradientBackground, extensionPackHeaderShadow, extensionPackGradientColorOneColor, extensionPackGradientColorTwoColor, tileBoxShadow, hoverShadow } from 'sql/platform/theme/common/colorRegistry';
import { registerColor, foreground, textLinkActiveForeground, descriptionForeground, activeContrastBorder, buttonForeground, menuBorder, menuForeground, editorWidgetBorder, selectBackground, buttonHoverBackground, selectBorder, iconForeground, textLinkForeground, inputBackground, focusBorder, listFocusBackground, listFocusForeground } from 'vs/platform/theme/common/colorRegistry';
import { IThemeService, registerThemingParticipant } from 'vs/platform/theme/common/themeService';
import { tileBorder, gradientOne, gradientTwo, gradientBackground, extensionPackHeaderShadow, extensionPackGradientColorOneColor, extensionPackGradientColorTwoColor, tileBoxShadow, hoverShadow } from 'sql/platform/theme/common/colorRegistry';
import { registerColor, foreground, textLinkActiveForeground, descriptionForeground, activeContrastBorder, buttonForeground, menuBorder, menuForeground, editorWidgetBorder, selectBackground, buttonHoverBackground, selectBorder, iconForeground, textLinkForeground, inputBackground, focusBorder, listFocusBackground, listFocusForeground, buttonSecondaryBackground, buttonSecondaryBorder, buttonDisabledForeground, buttonDisabledBackground, buttonSecondaryForeground, buttonSecondaryHoverBackground } from 'vs/platform/theme/common/colorRegistry';
import { IExtensionsWorkbenchService } from 'vs/workbench/contrib/extensions/common/extensions';
import { IEditorInputFactory, EditorInput } from 'vs/workbench/common/editor';
import { INotificationService, Severity } from 'vs/platform/notification/common/notification';
@@ -52,6 +52,7 @@ import { Button } from 'sql/base/browser/ui/button/button';
import { IContextMenuService } from 'vs/platform/contextview/browser/contextView';
import { ICommandAction, MenuItemAction } from 'vs/platform/actions/common/actions';
import { IContextKeyService } from 'vs/platform/contextkey/common/contextkey';
import { attachButtonStyler } from 'vs/platform/theme/common/styler';
const configurationKey = 'workbench.startupEditor';
const oldConfigurationKey = 'workbench.welcome.enabled';
const telemetryFrom = 'welcomePage';
@@ -247,7 +248,8 @@ class WelcomePage extends Disposable {
@IWorkbenchLayoutService protected layoutService: IWorkbenchLayoutService,
@ICommandService private readonly commandService: ICommandService,
@IContextMenuService private readonly contextMenuService: IContextMenuService,
@IContextKeyService private readonly contextKeyService: IContextKeyService) {
@IContextKeyService private readonly contextKeyService: IContextKeyService,
@IThemeService private themeService: IThemeService) {
super();
this._register(lifecycleService.onShutdown(() => this.dispose()));
const recentlyOpened = this.workspacesService.getRecentlyOpened();
@@ -569,6 +571,7 @@ class WelcomePage extends Disposable {
extensionPacks.forEach((extension) => {
const installText = localize('welcomePage.install', "Install");
let dropdownBtn = this._register(new Button(btnContainer));
this._register(attachButtonStyler(dropdownBtn, this.themeService));
dropdownBtn.label = installText;
const classes = ['btn'];
const getDropdownBtn = container.querySelector('.extensionPack .monaco-button:first-of-type') as HTMLAnchorElement;
@@ -598,6 +601,7 @@ class WelcomePage extends Disposable {
installedButton.label = installedText;
installedButton.enabled = false;
const getInstalledButton = container.querySelector('.extensionPack .monaco-button:nth-of-type(2)') as HTMLAnchorElement;
this._register(attachButtonStyler(installedButton, this.themeService));
getInstalledButton.innerText = localize('welcomePage.installed', "Installed");
getInstalledButton.title = extension.isKeymap ? localize('welcomePage.installedKeymap', "{0} keymap is already installed", extension.name) : localize('welcomePage.installedExtensionPack', "{0} support is already installed", extension.name);
@@ -874,7 +878,7 @@ registerThemingParticipant((theme, collector) => {
}
const buttonHoverBackgroundColor = theme.getColor(buttonHoverBackground);
if (buttonHoverBackgroundColor) {
collector.addRule(`.monaco-workbench .part.editor > .content .welcomePageContainer .btn-primary:hover { background: ${buttonHoverBackgroundColor}}`);
collector.addRule(`.monaco-workbench .part.editor > .content .welcomePageContainer .btn-primary:hover { background-color: ${buttonHoverBackgroundColor}}`);
}
const buttonSecondaryBackgroundColor = theme.getColor(buttonSecondaryBackground);
if (buttonSecondaryBackgroundColor) {
@@ -884,13 +888,13 @@ registerThemingParticipant((theme, collector) => {
if (buttonSecondaryBorderColor) {
collector.addRule(`.monaco-workbench .part.editor > .content .welcomePageContainer .btn-secondary .monaco-button{ border: 1px solid ${buttonSecondaryBorderColor}}`);
}
const buttonSecondaryColor = theme.getColor(buttonSecondary);
const buttonSecondaryColor = theme.getColor(buttonSecondaryForeground);
if (buttonSecondaryColor) {
collector.addRule(`.monaco-workbench .part.editor > .content .welcomePageContainer .btn-secondary { color: ${buttonSecondaryColor} !important}`);
}
const buttonSecondaryHover = theme.getColor(buttonSecondaryHoverColor);
const buttonSecondaryHover = theme.getColor(buttonSecondaryHoverBackground);
if (buttonSecondaryColor) {
collector.addRule(`.monaco-workbench .part.editor > .content .welcomePageContainer .btn-secondary:hover:not(.disabled) { color: ${buttonSecondaryHover};}`);
collector.addRule(`.monaco-workbench .part.editor > .content .welcomePageContainer .btn-secondary:hover:not(.disabled) { background-color: ${buttonSecondaryHover};}`);
}
const selectBackgroundColor = theme.getColor(selectBackground);
if (selectBackgroundColor) {
@@ -933,11 +937,11 @@ registerThemingParticipant((theme, collector) => {
if (descriptionColor) {
collector.addRule(`.monaco-workbench .part.editor > .content .welcomePage .detail { color: ${descriptionColor}; }`);
}
const disabledButtonColor = theme.getColor(disabledButton);
const disabledButtonColor = theme.getColor(buttonDisabledForeground);
if (disabledButtonColor) {
collector.addRule(`.monaco-workbench .part.editor > .content .welcomePage .btn:disabled { color: ${disabledButtonColor}; }`);
}
const disabledButtonBackgroundColor = theme.getColor(disabledButtonBackground);
const disabledButtonBackgroundColor = theme.getColor(buttonDisabledBackground);
if (disabledButtonColor) {
collector.addRule(`.monaco-workbench .part.editor > .content .welcomePage .btn:disabled { background: ${disabledButtonBackgroundColor}; }`);
}