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

Alanren/modal message high contrast fix (#3018)

Browse Source 
* make modal dialog message section HC aware

* handle warning icon
This commit is contained in:
Alan Ren
2018-10-26 15:38:51 -07:00
committed by GitHub
parent ff5a248240
commit 3237507bb2
18 changed files with 67 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
src/sql/base/browser/ui/modal/media/modal.css
View File

@@ -167,17 +167,20 @@
flex-direction: column;
}
.modal.flyout-dialog .dialog-message.error {
.vs .modal.flyout-dialog .dialog-message.error,
.vs-dark .modal.flyout-dialog .dialog-message.error {
background-color:#B62E00 !important;
color:#FFFFFF !important;
}
.modal.flyout-dialog .dialog-message.warning {
.vs .modal.flyout-dialog .dialog-message.warning,
.vs-dark .modal.flyout-dialog .dialog-message.warning {
background-color:#F9E385 !important;
color:#4A4A4A !important;
}
.modal.flyout-dialog .dialog-message.info {
.vs .modal.flyout-dialog .dialog-message.info,
.vs-dark .modal.flyout-dialog .dialog-message.info {
background-color:#0078D7 !important;
color:#FFFFFF !important;
}
@@ -243,6 +246,7 @@
font-size: 11px;
}
.hc-black .dialog-message.warning .close-message-icon,
.close-message-icon {
background: url('close_inverse.svg') center center no-repeat;
}
@@ -251,6 +255,7 @@
background: url('close.svg') center center no-repeat;
}
.hc-black .dialog-message.warning .copy-message-icon,
.copy-message-icon {
background: url('copy_inverse.svg') center center no-repeat;
}
@@ -259,6 +264,7 @@
background: url('copy.svg') center center no-repeat;
}
.hc-black .dialog-message.warning .message-details-icon,
.message-details-icon {
background: url('show_details_inverse.svg') center center no-repeat;
}
@@ -271,6 +277,10 @@
background: url('info_notification_inverse.svg') center center no-repeat;
}
.hc-black .dialog-message.warning .dialog-message-icon {
background: url('warning_notification_inverse.svg') center center no-repeat;
}
.dialog-message.warning .dialog-message-icon {
background: url('warning_notification.svg') center center no-repeat;
}

16
src/sql/base/browser/ui/modal/modal.ts
View File

@@ -3,7 +3,7 @@
* Licensed under the Source EULA. See License.txt in the project root for license information.
*--------------------------------------------------------------------------------------------*/
import 'vs/css!./media/modal';
import { IThemable } from 'vs/platform/theme/common/styler';
import { IThemable, attachButtonStyler } from 'vs/platform/theme/common/styler';
import { Color } from 'vs/base/common/color';
import { IPartService } from 'vs/workbench/services/part/common/partService';
import { KeyCode, KeyMod } from 'vs/base/common/keyCodes';
@@ -23,6 +23,7 @@ import * as TelemetryKeys from 'sql/common/telemetryKeys';
import { localize } from 'vs/nls';
import { MessageLevel } from 'sql/workbench/api/common/sqlExtHostTypes';
import * as os from 'os';
import { IThemeService } from 'vs/platform/theme/common/themeService';
export const MODAL_SHOWING_KEY = 'modalShowing';
export const MODAL_SHOWING_CONTEXT = new RawContextKey<Array<string>>(MODAL_SHOWING_KEY, []);
@@ -153,6 +154,7 @@ export abstract class Modal extends Disposable implements IThemable {
private _partService: IPartService,
private _telemetryService: ITelemetryService,
protected _clipboardService: IClipboardService,
protected _themeService: IThemeService,
_contextKeyService: IContextKeyService,
options?: IModalOptions
) {
@@ -228,6 +230,10 @@ export abstract class Modal extends Disposable implements IThemable {
this.setError(undefined);
});
});
attachButtonStyler(this._toggleMessageDetailButton, this._themeService);
attachButtonStyler(this._copyMessageButton, this._themeService);
attachButtonStyler(this._closeMessageButton, this._themeService);
});
messageContainer.div({ class: 'dialog-message-body' }, (messageBody) => {
messageBody.div({ class: 'dialog-message-summary' }, (summaryContainer) => {
@@ -601,6 +607,7 @@ export abstract class Modal extends Disposable implements IThemable {
this._modalDialog.style('border-style', border ? 'solid' : null);
this._modalDialog.style('border-color', border);
}
if (this._modalHeaderSection) {
this._modalHeaderSection.style('background-color', headerAndFooterBackground);
this._modalHeaderSection.style('border-bottom-width', border ? '1px' : null);
@@ -608,6 +615,13 @@ export abstract class Modal extends Disposable implements IThemable {
this._modalHeaderSection.style('border-bottom-color', border);
}
if (this._modalMessageSection) {
this._modalMessageSection.style('background-color', headerAndFooterBackground);
this._modalMessageSection.style('border-bottom-width', border ? '1px' : null);
this._modalMessageSection.style('border-bottom-style', border ? 'solid' : null);
this._modalMessageSection.style('border-bottom-color', border);
}
if (this._modalBodySection) {
this._modalBodySection.style.backgroundColor = bodyBackground;
}

8
src/sql/base/browser/ui/modal/optionsDialog.ts
View File

@@ -93,13 +93,13 @@ export class OptionsDialog extends Modal {
name: string,
options: IModalOptions,
@IPartService partService: IPartService,
@IWorkbenchThemeService private _themeService: IWorkbenchThemeService,
@IWorkbenchThemeService private _workbenchThemeService: IWorkbenchThemeService,
@IContextViewService private _contextViewService: IContextViewService,
@ITelemetryService telemetryService: ITelemetryService,
@IContextKeyService contextKeyService: IContextKeyService,
@IClipboardService clipboardService: IClipboardService
) {
super(title, name, partService, telemetryService, clipboardService, contextKeyService, options);
super(title, name, partService, telemetryService, clipboardService, _workbenchThemeService, contextKeyService, options);
}
public render() {
@@ -115,8 +115,8 @@ export class OptionsDialog extends Modal {
attachButtonStyler(this._okButton, this._themeService);
attachButtonStyler(this._closeButton, this._themeService);
let self = this;
this._register(self._themeService.onDidColorThemeChange(e => self.updateTheme(e)));
self.updateTheme(self._themeService.getColorTheme());
this._register(self._workbenchThemeService.onDidColorThemeChange(e => self.updateTheme(e)));
self.updateTheme(self._workbenchThemeService.getColorTheme());
}
protected renderBody(container: HTMLElement) {

4
src/sql/base/browser/ui/modal/webViewDialog.ts
View File

@@ -45,7 +45,7 @@ export class WebViewDialog extends Modal {
protected findInputFocusContextKey: IContextKey<boolean>;
constructor(
@IThemeService private _themeService: IThemeService,
@IThemeService themeService: IThemeService,
@IClipboardService clipboardService: IClipboardService,
@IPartService private _webViewPartService: IPartService,
@ITelemetryService telemetryService: ITelemetryService,
@@ -54,7 +54,7 @@ export class WebViewDialog extends Modal {
@IEnvironmentService private _environmentService: IEnvironmentService,
@IInstantiationService private _instantiationService: IInstantiationService
) {
super('', TelemetryKeys.WebView, _webViewPartService, telemetryService, clipboardService, contextKeyService, { isFlyout: false, hasTitleIcon: true });
super('', TelemetryKeys.WebView, _webViewPartService, telemetryService, clipboardService, themeService, contextKeyService, { isFlyout: false, hasTitleIcon: true });
this._okLabel = localize('webViewDialog.ok', 'OK');
this._closeLabel = localize('webViewDialog.close', 'Close');
}