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

Connection error box style fix (#14469)

Browse Source 
* Modified modal styles, limiting height of basic modal to 480px.

* wip - added new attachCalloutDialogStyler. Moved callout-specific styler code out of modal.ts

* Moved attach styler code to workbench/common. Added custom styles to imageCalloutDialog

* Moved styler code into calloutDialog. Added callout-specific theme colors to colorRegistry. Removed color styles from modal and callout stylesheets.

* Added CalloutDialogModal that extends CalloutDialog so that the callout can be instantiated from core. Revised calloutDialog so the position cn be passed in from where it is instantiated.

* Revised refactor of modal and image/link callouts so that callout dialog invoked by core can also use the styler. Removed unused properties from dialog code.

* Added conditional to dialogModal to use correct styler for callouts.

* Cleaned up styles. Modified custom colors.

* Wrapped call to positionCalloutDialog in conditional.

* Style, colors, styler and modal updates to align callout with latest OPAC toolkit styles.

* Moved calloutDialog stylesheet

* Consolidated styler code and added a flexible custom styler to provide values for dialogModal

* Added image callout code.

* Remove image callout dialog until wired fully

* Test fixes

Co-authored-by: chlafreniere <hichise@gmail.com>
This commit is contained in:
Hale Rankin
2021-03-05 17:34:02 -08:00
committed by GitHub
parent 0ef99ab42a
commit 972b649beb
11 changed files with 235 additions and 166 deletions
Download Patch File Download Diff File Expand all files Collapse all files

53
src/sql/workbench/common/styler.ts
View File

@@ -6,26 +6,32 @@
import { IThemeService } from 'vs/platform/theme/common/themeService';
import { IDisposable } from 'vs/base/common/lifecycle';
import * as cr from 'vs/platform/theme/common/colorRegistry';
import * as sqlcr from 'sql/platform/theme/common/colorRegistry';
import { IThemable } from 'vs/base/common/styler';
import { attachStyler } from 'vs/platform/theme/common/styler';
import { attachStyler, IStyleOverrides } from 'vs/platform/theme/common/styler';
import {
SIDE_BAR_SECTION_HEADER_FOREGROUND, SIDE_BAR_BACKGROUND, SIDE_BAR_SECTION_HEADER_BACKGROUND, SIDE_BAR_DRAG_AND_DROP_BACKGROUND,
PANEL_ACTIVE_TITLE_BORDER, PANEL_ACTIVE_TITLE_FOREGROUND, PANEL_INACTIVE_TITLE_FOREGROUND, VERTICAL_TAB_ACTIVE_BACKGROUND, DASHBOARD_BORDER,
} from 'vs/workbench/common/theme';
export function attachModalDialogStyler(widget: IThemable, themeService: IThemeService, style?:
{
dialogForeground?: cr.ColorIdentifier,
dialogHeaderAndFooterBackground?: cr.ColorIdentifier,
dialogBodyBackground?: cr.ColorIdentifier,
}): IDisposable {
export interface IModalDialogStyleOverrides extends IStyleOverrides {
dialogForeground?: cr.ColorIdentifier,
dialogHeaderAndFooterBackground?: cr.ColorIdentifier,
dialogBodyBackground?: cr.ColorIdentifier,
dialogBorder?: cr.ColorIdentifier,
dialogInteriorBorder?: cr.ColorIdentifier,
dialogExteriorBorder?: cr.ColorIdentifier,
dialogShadowColor?: cr.ColorIdentifier
}
export function attachModalDialogStyler(widget: IThemable, themeService: IThemeService, style?: IModalDialogStyleOverrides): IDisposable {
return attachStyler(themeService, {
dialogForeground: (style && style.dialogForeground) || cr.foreground,
dialogBorder: cr.contrastBorder,
dialogHeaderAndFooterBackground: (style && style.dialogHeaderAndFooterBackground) || SIDE_BAR_BACKGROUND,
dialogBodyBackground: (style && style.dialogBodyBackground) || cr.editorBackground
}, widget);
} as IModalDialogStyleOverrides, widget);
}
export function attachPanelStyler(widget: IThemable, themeService: IThemeService) {
@@ -49,3 +55,34 @@ export function attachTabbedPanelStyler(widget: IThemable, themeService: IThemeS
activeTabContrastBorder: cr.activeContrastBorder
}, widget);
}
export function attachCalloutDialogStyler(widget: IThemable, themeService: IThemeService, style?: IModalDialogStyleOverrides): IDisposable {
return attachStyler(themeService, {
dialogForeground: (style && style.dialogForeground) || sqlcr.calloutDialogForeground,
dialogHeaderAndFooterBackground: (style && style.dialogHeaderAndFooterBackground) || sqlcr.calloutDialogHeaderFooterBackground,
dialogBodyBackground: (style && style.dialogBodyBackground) || sqlcr.calloutDialogBodyBackground,
dialogInteriorBorder: (style && style.dialogInteriorBorder) || sqlcr.calloutDialogInteriorBorder,
dialogExteriorBorder: (style && style.dialogExteriorBorder) || sqlcr.calloutDialogExteriorBorder,
dialogShadowColor: (style && style.dialogShadowColor) || sqlcr.calloutDialogShadowColor
} as IModalDialogStyleOverrides, widget);
}
export function attachCustomDialogStyler(widget: IThemable, themeService: IThemeService, dialogStyle?: string, style?: IModalDialogStyleOverrides): IDisposable {
if (dialogStyle === 'callout') {
return attachStyler(themeService, {
dialogForeground: (style && style.dialogForeground) || sqlcr.calloutDialogForeground,
dialogHeaderAndFooterBackground: (style && style.dialogHeaderAndFooterBackground) || sqlcr.calloutDialogHeaderFooterBackground,
dialogBodyBackground: (style && style.dialogBodyBackground) || sqlcr.calloutDialogBodyBackground,
dialogInteriorBorder: (style && style.dialogInteriorBorder) || sqlcr.calloutDialogInteriorBorder,
dialogExteriorBorder: (style && style.dialogExteriorBorder) || sqlcr.calloutDialogExteriorBorder,
dialogShadowColor: (style && style.dialogShadowColor) || sqlcr.calloutDialogShadowColor
} as IModalDialogStyleOverrides, widget);
} else {
return attachStyler(themeService, {
dialogForeground: (style && style.dialogForeground) || cr.foreground,
dialogBorder: cr.contrastBorder,
dialogHeaderAndFooterBackground: (style && style.dialogHeaderAndFooterBackground) || SIDE_BAR_BACKGROUND,
dialogBodyBackground: (style && style.dialogBodyBackground) || cr.editorBackground
} as IModalDialogStyleOverrides, widget);
}
}