mirror of
https://github.com/ckaczor/azuredatastudio.git
synced 2026-01-26 01:25:38 -05:00
Adding light contrast theme (#22028)
* Adding light contrast theme
* fixing oe icons
* Fixing more files
* Converting ep files to support hc light
* Revert "Copy Headers for Selected Columns (#21622)"
This reverts commit f74d6f6d9b.
* Adding more css rules
* Fixing modal
* Fixing azure icons
This commit is contained in:
@@ -24,6 +24,8 @@
|
||||
.modal.callout-dialog .modal-content .row {
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.hc-light .modal.callout-dialog .modal-dialog,
|
||||
.hc-black .modal.callout-dialog .modal-dialog {
|
||||
box-shadow: none;
|
||||
}
|
||||
@@ -55,9 +57,12 @@
|
||||
width: 26px;
|
||||
}
|
||||
|
||||
.hc-light .callout-arrow:before,
|
||||
.hc-black .callout-arrow:before {
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.hc-light .callout-arrow.from-left:before,
|
||||
.hc-black .callout-arrow.from-left:before {
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
@@ -219,16 +219,16 @@
|
||||
margin: 3px 10px 3px 3px;
|
||||
}
|
||||
|
||||
.modal.flyout-dialog .dialog-message.info .dialog-message-button > a:focus,
|
||||
.modal.flyout-dialog .dialog-message.error .dialog-message-button > a:focus {
|
||||
.modal.flyout-dialog .dialog-message.info .dialog-message-button>a:focus,
|
||||
.modal.flyout-dialog .dialog-message.error .dialog-message-button>a:focus {
|
||||
outline-color: #FFFFFF;
|
||||
}
|
||||
|
||||
.modal.flyout-dialog .dialog-message.warning .dialog-message-button > a:focus {
|
||||
.modal.flyout-dialog .dialog-message.warning .dialog-message-button>a:focus {
|
||||
outline-color: #000000;
|
||||
}
|
||||
|
||||
.modal.flyout-dialog .dialog-message-button > a {
|
||||
.modal.flyout-dialog .dialog-message-button>a {
|
||||
background-position-x: 2px !important;
|
||||
background-color: inherit !important;
|
||||
color: inherit !important;
|
||||
@@ -298,11 +298,32 @@
|
||||
background: url('error_notification_inverse.svg') center center no-repeat;
|
||||
}
|
||||
|
||||
.hc-light .dialog-message.info .dialog-message-icon {
|
||||
background: url('info_notification.svg') center center no-repeat !important;
|
||||
}
|
||||
|
||||
.hc-light .dialog-message.error .dialog-message-icon {
|
||||
background: url('error_notification.svg') center center no-repeat !important;
|
||||
}
|
||||
|
||||
.hc-light .dialog-message.warning .dialog-message-icon {
|
||||
background: url('warning_notification.svg') center center no-repeat !important;
|
||||
}
|
||||
|
||||
.hc-light .copy-message-icon {
|
||||
background: url('copy.svg') center center no-repeat !important;
|
||||
}
|
||||
|
||||
.hc-light .close-message-icon {
|
||||
background: url('close.svg') center center no-repeat !important;
|
||||
}
|
||||
|
||||
.codicon.masked-icon.browse-local {
|
||||
display: inline-block;
|
||||
height: 25px;
|
||||
width: 25px;
|
||||
}
|
||||
|
||||
.codicon.masked-icon.browse-local:before {
|
||||
height: 25px;
|
||||
width: 25px;
|
||||
|
||||
@@ -47,7 +47,8 @@
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.backButtonIcon {
|
||||
.backButtonIcon,
|
||||
.hc-light .backButtonIcon {
|
||||
content: url('back.svg');
|
||||
width: 20px;
|
||||
margin-right: 10px;
|
||||
@@ -73,7 +74,8 @@
|
||||
background-size: 16px;
|
||||
}
|
||||
|
||||
.vs .optionsDialog-options .optionsDialog-description .modal-title {
|
||||
.vs .optionsDialog-options .optionsDialog-description .modal-title,
|
||||
.hc-light .optionsDialog-options .optionsDialog-description .modal-title {
|
||||
background-image: url('info_notification.svg')
|
||||
}
|
||||
|
||||
|
||||
@@ -754,6 +754,8 @@ export abstract class Modal extends Disposable implements IThemable {
|
||||
box-shadow: 0px 3.2px 7.2px rgba(${shadowRgb.rgba.r}, ${shadowRgb.rgba.g}, ${shadowRgb.rgba.b}, 0.132),
|
||||
0px 0.6px 1.8px rgba(${shadowRgb.rgba.r}, ${shadowRgb.rgba.g}, ${shadowRgb.rgba.b}, 0.108);
|
||||
}
|
||||
|
||||
.hc-light .modal.callout-dialog .modal-dialog,
|
||||
.hc-black .modal.callout-dialog .modal-dialog {
|
||||
border-color: rgba(${exteriorBorderRgb.rgba.r}, ${exteriorBorderRgb.rgba.g}, ${exteriorBorderRgb.rgba.b}, 1);
|
||||
}
|
||||
@@ -764,6 +766,8 @@ export abstract class Modal extends Disposable implements IThemable {
|
||||
background-color: ${this._dialogBodyBackground};
|
||||
border-color: transparent transparent rgba(${exteriorBorderRgb.rgba.r}, ${exteriorBorderRgb.rgba.g}, ${exteriorBorderRgb.rgba.b}, 0.5) rgba(${exteriorBorderRgb.rgba.r}, ${exteriorBorderRgb.rgba.g}, ${exteriorBorderRgb.rgba.b}, 0.5);
|
||||
}
|
||||
|
||||
.hc-light .callout-arrow:before,
|
||||
.hc-black .callout-arrow:before {
|
||||
border-color: transparent transparent rgba(${exteriorBorderRgb.rgba.r}, ${exteriorBorderRgb.rgba.g}, ${exteriorBorderRgb.rgba.b}, 1) rgba(${exteriorBorderRgb.rgba.r}, ${exteriorBorderRgb.rgba.g}, ${exteriorBorderRgb.rgba.b}, 1);
|
||||
}
|
||||
|
||||
@@ -25,7 +25,7 @@ export function createIconCssClass(iconPath: IconPath, className?: string): stri
|
||||
removeCSSRulesContainingSelector(iconClass);
|
||||
const icon = getLightIconUri(iconPath);
|
||||
const iconDark = getDarkIconUri(iconPath) || icon;
|
||||
createCSSRule(`.icon.${iconClass}`, `background-image: ${asCSSUrl(icon)}`);
|
||||
createCSSRule(`.icon.${iconClass}, .hc-light .icon.${iconClass}`, `background-image: ${asCSSUrl(icon)}`);
|
||||
createCSSRule(`.vs-dark .icon.${iconClass}, .hc-black .icon.${iconClass}`, `background-image: ${asCSSUrl(iconDark)}`);
|
||||
return iconClass;
|
||||
}
|
||||
|
||||
@@ -24,6 +24,10 @@ modelview-diff-editor-component {
|
||||
font-size: 11px
|
||||
}
|
||||
|
||||
.hc-light .modelview-diff-editor-title-background {
|
||||
background-color: #6fc3df;
|
||||
}
|
||||
|
||||
.vs-dark .modelview-diff-editor-title-background {
|
||||
background-color: #434343;
|
||||
}
|
||||
@@ -34,4 +38,4 @@ modelview-diff-editor-component {
|
||||
|
||||
.modelview-diff-editor-title-background {
|
||||
background-color: #d5d5d5;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -27,7 +27,8 @@
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.vs .modelview-group-header-collapsible.expanded {
|
||||
.vs .modelview-group-header-collapsible.expanded,
|
||||
.hc-light .modelview-group-header-collapsible.expanded {
|
||||
background-image: url("expanded.svg");
|
||||
}
|
||||
|
||||
@@ -36,7 +37,8 @@
|
||||
background-image: url("expanded_inverse.svg");
|
||||
}
|
||||
|
||||
.vs .modelview-group-header-collapsible.collapsed {
|
||||
.vs .modelview-group-header-collapsible.collapsed,
|
||||
.hc-light .modelview-group-header-collapsible.collapsed {
|
||||
background-image: url("collapsed.svg");
|
||||
}
|
||||
|
||||
|
||||
@@ -14,7 +14,8 @@
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.vs .modelview-loadingComponent-spinner {
|
||||
.vs .modelview-loadingComponent-spinner,
|
||||
.hc-light .modelview-loadingComponent-spinner {
|
||||
content: url("loading.svg");
|
||||
}
|
||||
|
||||
|
||||
@@ -56,15 +56,18 @@ modelview-dom-component .showEditorSelection li.code-line:hover:before {
|
||||
left: -30px;
|
||||
}
|
||||
|
||||
modelview-dom-component .showEditorSelection .code-active-line:before {
|
||||
modelview-dom-component .showEditorSelection .code-active-line:before,
|
||||
.monaco-workbench.hc-light modelview-dom-component .showEditorSelection .code-active-line:before {
|
||||
border-left: 3px solid rgba(0, 0, 0, 0.15);
|
||||
}
|
||||
|
||||
modelview-dom-component .showEditorSelection .code-line:hover:before {
|
||||
modelview-dom-component .showEditorSelection .code-line:hover:before,
|
||||
.monaco-workbench.hc-light modelview-dom-component .showEditorSelection .code-line:hover:before {
|
||||
border-left: 3px solid rgba(0, 0, 0, 0.40);
|
||||
}
|
||||
|
||||
modelview-dom-component .showEditorSelection .code-line .code-line:hover:before {
|
||||
modelview-dom-component .showEditorSelection .code-line .code-line:hover:before,
|
||||
.monaco-workbench.hc-light modelview-dom-component .showEditorSelection .code-line .code-line:hover:before {
|
||||
border-left: none;
|
||||
}
|
||||
|
||||
@@ -91,6 +94,14 @@ modelview-dom-component .showEditorSelection .code-line .code-line:hover:before
|
||||
border-left: 3px solid rgba(255, 160, 0, 1);
|
||||
}
|
||||
|
||||
.hc-light modelview-dom-component .showEditorSelection .code-active-line:before {
|
||||
border-left: 3px solid #6fc3df;
|
||||
}
|
||||
|
||||
.hc-light modelview-dom-component .showEditorSelection .code-line:hover:before {
|
||||
border-left: 3px solid #6fc3df;
|
||||
}
|
||||
|
||||
modelview-dom-component .showEditorSelection .code-line .code-line:hover:before {
|
||||
border-left: none;
|
||||
}
|
||||
@@ -205,6 +216,14 @@ modelview-dom-component pre {
|
||||
background-color: rgba(220, 220, 220, 0.4);
|
||||
}
|
||||
|
||||
.monaco-workbench.hc-light modelview-dom-component pre {
|
||||
background-color: rgba(255, 255, 255);
|
||||
}
|
||||
|
||||
.monaco-workbench.hc-light modelview-dom-component h1 {
|
||||
border-color: rgba(255, 255, 255);
|
||||
}
|
||||
|
||||
.monaco-workbench.vs-dark modelview-dom-component pre {
|
||||
background-color: rgba(10, 10, 10, 0.4);
|
||||
}
|
||||
|
||||
@@ -17,7 +17,7 @@ modelview-text div#textContainer {
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.vs .modelview-text-tooltip {
|
||||
.vs .modelview-text-tooltip, .hc-light .modelview-text-tooltip {
|
||||
background-image: url('info.svg')
|
||||
}
|
||||
|
||||
@@ -36,7 +36,7 @@ modelview-text div#textContainer {
|
||||
margin-left: 14px;
|
||||
}
|
||||
|
||||
.vs .modelview-text-tooltip .modelview-text-tooltip-content {
|
||||
.vs .modelview-text-tooltip .modelview-text-tooltip-content, .hc-light .modelview-text-tooltip .modelview-text-tooltip-content {
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user