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:
Aasim Khan
2023-03-06 17:31:27 -08:00
committed by GitHub
parent 29c1f5edd0
commit d3f4f0daa4
61 changed files with 912 additions and 267 deletions

View File

@@ -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;
}

View File

@@ -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;

View File

@@ -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')
}

View File

@@ -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);
}