mirror of
https://github.com/pgadmin-org/pgadmin4.git
synced 2026-08-11 13:34:50 -05:00
Added High Contrast theme support. Fixes #5653
Fixed text color issue in explain analyze for the Dark theme. Fixes #5677
This commit is contained in:
Nikhil Mohite
committed by
Akshay Joshi
Akshay Joshi
parent
9174db2024
commit
7edcca9b07
@@ -10,7 +10,7 @@
|
||||
|
||||
.aciTree, .aciTree.aciTreeFullRow {
|
||||
& .aciTreeButton, & .aciTreePush, & .aciTreeItem, & .aciTreeIcon, & .aciTreeText, & .aciTreeColumn {
|
||||
color: $color-fg;
|
||||
color: $tree-text-fg;
|
||||
}
|
||||
|
||||
.aciTreeLi {
|
||||
@@ -53,6 +53,15 @@
|
||||
border-radius: none !important;
|
||||
color: $tree-fg-selected;
|
||||
}
|
||||
|
||||
& .aciTreeText {
|
||||
color: $tree-text-hover-fg;
|
||||
}
|
||||
|
||||
& .aciTreePush {
|
||||
color: $tree-text-hover-fg;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.aciTreeItem {
|
||||
@@ -77,6 +86,15 @@
|
||||
border-radius: none !important;
|
||||
color: $tree-fg-hover;
|
||||
}
|
||||
|
||||
& .aciTreeText {
|
||||
color: $tree-text-hover-fg;
|
||||
}
|
||||
|
||||
& .aciTreePush {
|
||||
color: $tree-text-hover-fg;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
&.aciTreeFocus {
|
||||
|
||||
@@ -44,7 +44,7 @@
|
||||
align-self: center;
|
||||
// To make sure IE picks up the correct font
|
||||
font-family: $font-family-primary;
|
||||
color: $color-fg;
|
||||
color: $alert-color-fg;
|
||||
}
|
||||
|
||||
.alert-info {
|
||||
|
||||
@@ -5,10 +5,10 @@
|
||||
//margin is calculated with -$alertify-borderremove-margin, adjust the header
|
||||
min-height: $title-height + $alertify-borderremove-margin !important;
|
||||
max-height: $title-height + $alertify-borderremove-margin !important;
|
||||
background-color: $color-primary;
|
||||
background-color: $alert-header-bg;
|
||||
font-size: $font-size-base;
|
||||
font-weight: bold;
|
||||
color: $color-primary-fg;
|
||||
color: $alert-header-fg;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
@@ -19,12 +19,12 @@
|
||||
margin: -24px - $alertify-borderremove-margin; //-24px is default by alertify
|
||||
margin-bottom: 0px;
|
||||
&:hover {
|
||||
background-color: $color-primary;
|
||||
background-color: $alert-header-bg;
|
||||
}
|
||||
}
|
||||
|
||||
.ajs-body {
|
||||
background-color: $color-bg !important;
|
||||
background-color: $alert-dialog-body-bg !important;
|
||||
color: $color-fg !important;
|
||||
}
|
||||
|
||||
@@ -123,7 +123,7 @@
|
||||
border: $panel-border;
|
||||
border-radius: $panel-border-radius;
|
||||
box-shadow: $dialog-box-shadow;
|
||||
background-color: $color-bg !important;
|
||||
background-color: $alert-dialog-body-bg !important;
|
||||
color: $color-fg !important;
|
||||
}
|
||||
.ajs-content {
|
||||
@@ -146,7 +146,7 @@
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
border: $input-btn-border-width solid $btn-secondary-border !important;
|
||||
background-color: $color-secondary !important;
|
||||
background-color: $alert-action-bg !important;
|
||||
font-size: 12px;
|
||||
border-radius: $btn-border-radius;
|
||||
position: relative;
|
||||
@@ -157,7 +157,7 @@
|
||||
}
|
||||
|
||||
.ajs-pin:hover, .ajs-maximize:hover, .ajs-close:hover {
|
||||
background-color: $btn-secondary-hover-bg !important;
|
||||
background-color: $alert-action-hover-bg !important;
|
||||
}
|
||||
|
||||
.alertify.ajs-modeless.ajs-pinnable .ajs-commands button.ajs-pin {
|
||||
@@ -280,6 +280,9 @@
|
||||
}
|
||||
}
|
||||
|
||||
.alert-text-body {
|
||||
color: $alert-color-fg;
|
||||
}
|
||||
|
||||
.ajs-commands, .ajs-close {
|
||||
button {
|
||||
|
||||
@@ -169,6 +169,12 @@ table.backgrid {
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.backgrid tr:hover {
|
||||
.label {
|
||||
color: $grid-hover-fg-color;
|
||||
}
|
||||
}
|
||||
|
||||
.subnode {
|
||||
border: $panel-border;
|
||||
background: $color-bg;
|
||||
|
||||
@@ -100,17 +100,84 @@ legend {
|
||||
* Refer file : bootstrap/scss/mixins/_buttons.scss
|
||||
*/
|
||||
.btn-secondary {
|
||||
@include button-variant($color-secondary, $btn-secondary-border, $btn-secondary-hover-bg);
|
||||
@include button-variant($btn-secondary-bg, $btn-secondary-border, $btn-secondary-hover-bg, $hover-border: $btn-secondary-border-hover-bg);
|
||||
@include hover() {
|
||||
color: $btn-secondary-hover-fg !important;
|
||||
} &.disabled, &:disabled {
|
||||
color: $btn-secondary-disabled-fg !important;
|
||||
border-color: $btn-secondary-disabled-bg !important;
|
||||
}
|
||||
color: $btn-secondary-fg !important;
|
||||
|
||||
}
|
||||
|
||||
/** Overriding secondary button of bootstrap **/
|
||||
/** Overriding ternary button of bootstrap **/
|
||||
/* Used Bootstrap 4 Mixin button-variant
|
||||
* Refer file : bootstrap/scss/mixins/_buttons.scss
|
||||
*/
|
||||
.btn-ternary {
|
||||
@include button-variant($color-ternary, $btn-ternary-border, $btn-ternary-hover-bg);
|
||||
.btn-ternary {
|
||||
@include button-variant($color-ternary, $color-fg);
|
||||
border-color: $color-ternary;
|
||||
}
|
||||
|
||||
.btn-ternary[disabled] {
|
||||
background-color: $btn-ternary-disabled-bg !important;
|
||||
color: $btn-ternary-disabled-fg !important;
|
||||
border-color: btn-ternary-disabled-border-color !important;
|
||||
|
||||
label {
|
||||
background-color: $btn-ternary-disabled-bg !important;
|
||||
color: $btn-ternary-disabled-fg !important;
|
||||
border-color: btn-ternary-disabled-border-color !important;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
@include button-variant($color-primary, $color-primary, $hover-background: $btn-primary-hover-bg, $hover-border: $btn-primary-border-hover-bg);
|
||||
& .disabled,
|
||||
&:disabled {
|
||||
background-color: $btn-primary-disabled-bg;
|
||||
border-color: $btn-primary-disabled-bg;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-primary-icon {
|
||||
@include button-variant($btn-primary-icon-bg, $btn-primary-icon-border-color);
|
||||
@include hover() {
|
||||
background-color: $btn-primary-icon-hover-bg;
|
||||
color: $btn-primary-icon-hover-fg;
|
||||
} &.disabled, &:disabled {
|
||||
color: $btn-primary-icon-disable-fg !important;
|
||||
border-color: $btn-primary-icon-border-disable-bg !important;
|
||||
background-color: $btn-primary-icon-disable-bg;
|
||||
}
|
||||
|
||||
border-color: $btn-primary-icon-border-color;
|
||||
}
|
||||
|
||||
.btn-success {
|
||||
@include button-variant($color-success, $color-fg);
|
||||
border-color: $color-success;
|
||||
@include hover() {
|
||||
color: $color-success-hover-fg !important;
|
||||
border-color: $color-success !important;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-success[disabled] {
|
||||
background-color: $color-success-disabled-bg !important;
|
||||
border-color: $color-success-disabled-bg !important;
|
||||
color: $color-success-disabled-fg !important;
|
||||
|
||||
label {
|
||||
background-color: $color-success-disabled-bg !important;
|
||||
border-color: $color-success-disabled-bg !important;
|
||||
color: $color-success-disabled-fg !important;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.form-group fieldset {
|
||||
background-color: $color-gray-lighter;
|
||||
border-color: $color-gray-lighter;
|
||||
@@ -167,6 +234,9 @@ legend {
|
||||
.card-header {
|
||||
padding: $card-header-padding;
|
||||
font-weight: bold;
|
||||
background-color: $card-header-bg;
|
||||
color: $card-header-fg;
|
||||
border-color: $card-header-border-color;
|
||||
}
|
||||
|
||||
.table {
|
||||
@@ -228,6 +298,7 @@ legend {
|
||||
& > tbody {
|
||||
& > tr:not(.nohover):not(.empty):hover, tr.selected {
|
||||
background-color: $table-hover-bg-color;
|
||||
color: $grid-hover-fg-color;
|
||||
& > td {
|
||||
border-top: $table-hover-border;
|
||||
border-bottom: $table-hover-border;
|
||||
@@ -236,6 +307,7 @@ legend {
|
||||
|
||||
& > tr.nohover {
|
||||
background-color: transparent;
|
||||
color: $input-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -330,6 +402,10 @@ td.switch-cell > div.toggle {
|
||||
&:focus:checked ~ .custom-control-label::before {
|
||||
border-color: $custom-control-indicator-focus-border-color;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
border-color: $custom-control-indicator-focus-border-color;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 992px) {
|
||||
|
||||
@@ -168,7 +168,7 @@
|
||||
}
|
||||
|
||||
.CodeMirror .CodeMirror-selected {
|
||||
background: $color-primary-light !important;
|
||||
background: $sql-editor-selection-bg !important;
|
||||
}
|
||||
|
||||
.CodeMirror-activeline-background {
|
||||
@@ -200,3 +200,7 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.bg-gray-lighter {
|
||||
background-color: $sql-editor-disable-bg !important;
|
||||
}
|
||||
|
||||
@@ -368,7 +368,7 @@
|
||||
display: block;
|
||||
text-align: left;
|
||||
cursor: pointer;
|
||||
background-color: $header-bg;
|
||||
background-color: $badge-header-bg;
|
||||
padding: 7px;
|
||||
font-size: inherit;
|
||||
border-bottom: $panel-border;
|
||||
@@ -866,7 +866,7 @@ body {
|
||||
}
|
||||
|
||||
.editor-toolbar {
|
||||
background: $sql-gutters-bg;
|
||||
background: $editor-toolbar-bg;
|
||||
padding: 0.05rem 0.25rem;
|
||||
}
|
||||
|
||||
|
||||
@@ -4,13 +4,13 @@
|
||||
}
|
||||
|
||||
.select2-container--default .select2-results__option[aria-selected=true] {
|
||||
background-color: $tree-bg-selected;
|
||||
color: $tree-fg-selected;
|
||||
background-color: $select2-container-bg-selected;
|
||||
color: $select2-container-fg-selected;
|
||||
}
|
||||
|
||||
.select2-container--default .select2-results__option--highlighted {
|
||||
background-color: $tree-bg-hover !important;
|
||||
color: $tree-fg-hover !important;
|
||||
background-color: $select2-container-hover-bg !important;
|
||||
color: $select2-container-hover-fg !important;
|
||||
}
|
||||
|
||||
.select2-container--default .select2-selection--multiple {
|
||||
@@ -27,7 +27,7 @@
|
||||
line-height: 2;
|
||||
|
||||
& .select2-selection__choice__remove {
|
||||
color: $dropdown-link-hover-bg;
|
||||
color: $dropdown-link-remove-color;
|
||||
margin-right: 0.25rem;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -38,7 +38,7 @@
|
||||
|
||||
/* darken % taken from bootstrap - button_variant */
|
||||
.wcFrameButton:hover, .wcFrameButtonHover, .wcFrameButton:focus {
|
||||
background-color: $btn-secondary-hover-bg;
|
||||
background-color: $btn-frame-close-bg;
|
||||
}
|
||||
|
||||
.wcFrameButton.disabled {
|
||||
@@ -74,7 +74,7 @@
|
||||
}
|
||||
|
||||
.wcPanelTab, .wcFrameTitle{
|
||||
color: $color-fg;
|
||||
color: $panel-color-fg;
|
||||
padding: $tabs-padding;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
@@ -113,15 +113,15 @@
|
||||
}
|
||||
|
||||
.text-danger {
|
||||
color: $color-danger;
|
||||
color: $color-danger-fg;
|
||||
}
|
||||
|
||||
.text-primary {
|
||||
color: $color-primary;
|
||||
color: $color-primary-fg;
|
||||
}
|
||||
|
||||
.text-success {
|
||||
color: $color-success;
|
||||
color: $color-success-fg;
|
||||
}
|
||||
|
||||
.text-bold {
|
||||
|
||||
@@ -18,6 +18,7 @@ $color-ternary: #5b6d7c !default;
|
||||
$color-ternary-fg: $white !default;
|
||||
|
||||
$color-danger: #e53935 !default;
|
||||
$color-danger-icon-fg: $color-danger !default;
|
||||
$color-danger-fg: $white !default;
|
||||
$color-danger-light: #F39999 !default;
|
||||
$color-danger-lighter: #FAECEC !default;
|
||||
@@ -26,6 +27,10 @@ $color-success: #26852B !default;
|
||||
$color-success-fg: $black !default;
|
||||
$color-success-light: #D9ECDA !default;
|
||||
|
||||
$color-success-disabled-fg: $color-bg !default;
|
||||
$color-success-disabled-bg: $color-success !default;
|
||||
$color-success-hover-fg: $white !default;
|
||||
|
||||
$color-warning: #eea236 !default;
|
||||
$color-warning-fg: $black !default;
|
||||
$color-warning-light: #fce5c5 !default;
|
||||
@@ -61,6 +66,7 @@ $border-radius: 0.25rem;
|
||||
|
||||
$text-muted: #667185 !default;
|
||||
$header-bg: $color-bg !default;
|
||||
$badge-header-bg: $header-bg !default;
|
||||
|
||||
$tree-font-size: 0.815rem;
|
||||
|
||||
@@ -71,14 +77,14 @@ $alert-danger-color: $color-danger !default;
|
||||
$alert-success-bg: $color-success-light !default;
|
||||
$alert-success-color: $color-success !default;
|
||||
|
||||
$navbar-bg: $color-primary;
|
||||
$navbar-bg: $color-primary !default;
|
||||
$navbar-font-size: 0.925rem;
|
||||
$navbar-height: 32px;
|
||||
$navbar-dropdown-top: 100%;
|
||||
$navbar-dark-color: $color-primary-fg;
|
||||
$navbar-dark-color: $color-primary-fg !default;
|
||||
$navbar-dark-hover-color: $color-primary-fg;
|
||||
$navbar-dark-active-color: $color-primary-fg;
|
||||
$navbar-dark-disabled-color: $color-gray;
|
||||
$navbar-dark-active-color: $color-primary-fg !default;
|
||||
$navbar-dark-disabled-color: $color-gray !default;
|
||||
|
||||
$navbar-toggler-padding-y: 0.25rem; //no-change
|
||||
|
||||
@@ -92,6 +98,7 @@ $dropdown-color: $color-fg;
|
||||
$dropdown-link-color: $color-fg;
|
||||
$dropdown-link-hover-color: $color-primary-fg;
|
||||
$dropdown-link-hover-bg: $color-primary;
|
||||
$dropdown-link-remove-color: $color-primary !default;
|
||||
$dropdown-border-color: $border-color;
|
||||
$dropdown-box-shadow: 0 0.125rem 0.5rem rgba($shadow-base-color, .275);
|
||||
$dropdown-divider-bg: $dropdown-border-color;
|
||||
@@ -113,9 +120,9 @@ $btn-transition: color .05s ease-in-out, background-color .05s ease-in-out, bord
|
||||
$card-spacer-y: 0rem;
|
||||
$card-spacer-x: 0rem;
|
||||
$card-border-radius: $border-radius;
|
||||
$card-border-color: $border-color;
|
||||
$card-cap-bg: $header-bg;
|
||||
$card-bg: $color-bg;
|
||||
$card-border-color: $border-color !default;
|
||||
$card-cap-bg: $header-bg !default;
|
||||
$card-bg: $color-bg !default;
|
||||
|
||||
$navbar-padding-y: 0rem;
|
||||
$navbar-padding-x: 0rem;
|
||||
@@ -135,9 +142,9 @@ $nav-tabs-link-active-border-color: none;
|
||||
|
||||
$table-cell-padding: 0.25rem;
|
||||
$table-header-cell-padding: 0.75rem;
|
||||
$table-hover-bg: none; //we will use our own classes
|
||||
$table-hover-bg: none !default; //we will use our own classes
|
||||
$table-hover-color: #000 !default;
|
||||
$table-active-bg: $color-primary-light;
|
||||
$table-active-bg: $color-primary-light !default;
|
||||
$table-border-width: $border-width;
|
||||
$table-border-color: $border-color;
|
||||
$table-head-bg: $color-primary;
|
||||
@@ -162,9 +169,10 @@ $btn-danger-color: $color-danger-fg;
|
||||
$component-active-bg: $color-primary;
|
||||
$input-btn-focus-width: .2rem;
|
||||
$input-btn-focus-color: rgba($component-active-bg, .25);
|
||||
$input-btn-focus-box-shadow: 0 0 0 $input-btn-focus-width $input-btn-focus-color;
|
||||
$input-btn-focus-shadow-color: $input-btn-focus-color !default;
|
||||
$input-btn-focus-box-shadow: 0 0 0 $input-btn-focus-width $input-btn-focus-shadow-color;
|
||||
$input-focus-bg: $input-bg;
|
||||
$input-focus-border-color: lighten($component-active-bg, 25%);
|
||||
$input-focus-border-color: lighten($component-active-bg, 25%) !default;
|
||||
$input-focus-color: $input-color;
|
||||
$input-focus-width: $input-btn-focus-width;
|
||||
$input-focus-box-shadow: $input-btn-focus-box-shadow;
|
||||
@@ -186,12 +194,13 @@ $color-editor-foldmarker: #0000FF !default;
|
||||
$color-editor-activeline: #50B0F0 !default;
|
||||
|
||||
$active-color: $color-primary !default;
|
||||
$active-border: 3px solid $active-color;
|
||||
$active-border: 3px solid $active-color !default;
|
||||
$panel-border-width: $border-width;
|
||||
$panel-border-color: $border-color;
|
||||
$panel-border-color: $border-color !default;
|
||||
$panel-border-radius: $border-radius;
|
||||
$panel-border: $panel-border-width solid $panel-border-color !important;
|
||||
$panel-border-dark: $panel-border-width solid $border-color-dark !important;
|
||||
$panel-color-fg: $color-fg !default;
|
||||
$tabs-padding: 5px 10px 2px;
|
||||
$title-height: ($line-height-base*16px) + 5px + 2px + $border-width;
|
||||
$footer-padding: 0.5rem;
|
||||
@@ -207,13 +216,16 @@ $table-bg: $color-bg !default;
|
||||
$table-bg-selected: $color-primary-light;
|
||||
$table-hover-border-color: $color-primary;
|
||||
$table-hover-border: $panel-border-width solid $color-primary !important;
|
||||
$table-hover-bg-color: $color-primary-light;
|
||||
$datagrid-bg: $color-gray-light;
|
||||
$table-hover-bg-color: $color-primary-light !default;
|
||||
$datagrid-bg: $color-gray-light !default;
|
||||
$datagrid-selected-color : $color-primary-fg !default;
|
||||
|
||||
$tree-fg-hover: $color-fg;
|
||||
$tree-bg-hover: $color-gray-light;
|
||||
$tree-fg-selected: $color-fg;
|
||||
$tree-bg-selected: $color-primary-light;
|
||||
$tree-text-fg: $color-fg !default;
|
||||
$tree-text-hover-fg: $color-fg !default;
|
||||
$tree-fg-hover: $color-fg !default;
|
||||
$tree-bg-hover: $color-gray-light !default;
|
||||
$tree-fg-selected: $color-fg !default;
|
||||
$tree-bg-selected: $color-primary-light !default;
|
||||
|
||||
$sql-grid-data-cell-fg: $input-color;
|
||||
$sql-grid-data-cell-bg: $input-bg;
|
||||
@@ -221,19 +233,21 @@ $sql-grid-title-cell-fg: $input-color;
|
||||
$sql-grid-title-cell-bg: $input-bg;
|
||||
|
||||
$sql-title-padding: 3px;
|
||||
$sql-title-bg: $color-ternary;
|
||||
$sql-title-fg: $color-ternary-fg;
|
||||
$sql-title-bg: $color-ternary !default;
|
||||
$sql-title-fg: $color-ternary-fg !default;
|
||||
// Toolbar + editor title heights + title bottom border
|
||||
$sql-editor-panel-top: $title-height + $text-height-calc*16px + $sql-title-padding*2 + $panel-border-width - 0.5px;
|
||||
$sql-gutters-bg: $datagrid-bg;
|
||||
$sql-history-detail-bg: $color-gray-lighter;
|
||||
$sql-editor-disable-bg: $color-gray-lighter !default;
|
||||
$sql-editor-selection-bg: $color-primary-light !default;
|
||||
$sql-gutters-bg: $datagrid-bg !default;
|
||||
$sql-history-detail-bg: $color-gray-lighter !default;
|
||||
$sql-history-success-bg: $color-primary-light;
|
||||
$sql-history-success-fg: $active-color;
|
||||
$sql-history-success-fg: $active-color !default;
|
||||
$sql-history-error-bg: $color-danger-lighter;
|
||||
$sql-history-error-fg: $color-danger;
|
||||
$sql-hint-bg: $color-bg;
|
||||
$sql-hint-active-bg: $color-primary;
|
||||
$sql-hint-active-fg: $white;
|
||||
$sql-hint-active-fg: $white !default;
|
||||
$sql-bracket-match-fg: #5b6d7c;
|
||||
$sql-bracket-match-bg: #f5d2af;
|
||||
|
||||
@@ -243,19 +257,45 @@ $explain-sev-3-bg: #EE8800 !default;
|
||||
$explain-sev-4-bg: #880000 !default;
|
||||
$explain-sev-3-color: #FFFFFF !default;
|
||||
$explain-sev-4-color: #FFFFFF !default;
|
||||
$explain-sev-2-color: $black !default;
|
||||
|
||||
$dialog-box-shadow: 0 0.5rem 3rem $shadow-base-color;
|
||||
|
||||
$alert-icon-color: $white;
|
||||
$alert-header-bg: $color-primary !default;
|
||||
$alert-header-fg: $white !default;
|
||||
$alert-action-bg: $color-secondary !default;
|
||||
$alert-action-hover-bg: $color-gray-light !default;
|
||||
$alertify-borderremove-margin: $panel-border-width;
|
||||
$alert-color-fg: $color-fg !default;
|
||||
$alert-dialog-body-bg: $color-bg !default;
|
||||
|
||||
$btn-secondary-border: $color-gray;
|
||||
$btn-secondary-hover-bg: $color-gray-light;
|
||||
$btn-primary-hover-bg: darken($color-primary, 7.5%) !default;
|
||||
$btn-primary-border-hover-bg: darken($color-primary, 7.5%) !default;
|
||||
$btn-primary-disabled-bg: $color-primary !default;
|
||||
|
||||
$btn-secondary-bg: $color-secondary !default;
|
||||
$btn-secondary-border-hover-bg: $color-gray !default;
|
||||
$btn-secondary-fg: $color-fg !default;
|
||||
$btn-secondary-hover-fg: $color-fg !default;
|
||||
$btn-secondary-border: $color-gray !default;
|
||||
$btn-secondary-hover-bg: $color-gray-light !default;
|
||||
$btn-secondary-disabled-bg: $color-gray !default;
|
||||
$btn-secondary-disabled-fg: $color-fg !default;
|
||||
|
||||
$btn-frame-close-bg:$btn-secondary-hover-bg !default;
|
||||
|
||||
$btn-ternary-border: $color-ternary !default;
|
||||
$btn-ternary-hover-bg: darken($color-ternary, 7.5%) !default;
|
||||
|
||||
$btn-ternary-disabled-bg: $color-ternary !default;
|
||||
$btn-ternary-disabled-fg: $color-bg !default;
|
||||
$btn-ternary-disabled-border-color: $btn-ternary-disabled-bg !default;
|
||||
|
||||
$card-header-padding : 0.25rem 0.5rem;
|
||||
$card-header-bg: $color-bg !default;
|
||||
$card-header-fg: $color-fg !default;
|
||||
$card-header-border-color: $border-color !default;
|
||||
$no-border-radius: 0px !important;
|
||||
|
||||
$btn-checkbox-padding: $input-btn-padding-y $input-btn-padding-x;
|
||||
@@ -278,8 +318,30 @@ $loader-icon-small: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='ut
|
||||
$schemadiff-diff-row-color: #fff9c4 !default;
|
||||
$schemadiff-source-row-color: #ffebee !default;
|
||||
$schemadiff-target-row-color: #fbe3bf !default;
|
||||
$schema-diff-color-fg: $input-color !default;
|
||||
|
||||
/* Custom controls bootstrap changes */
|
||||
$custom-forms-transition: none;
|
||||
$custom-control-indicator-focus-border-color: $input-focus-border-color;
|
||||
$custom-control-indicator-border-color: $input-border-color;
|
||||
$custom-forms-transition: none !default;
|
||||
$custom-control-indicator-focus-border-color: $input-focus-border-color !default;
|
||||
$custom-control-indicator-border-color: $input-border-color !default;
|
||||
|
||||
$select2-container-hover-bg: $tree-bg-hover !default;
|
||||
$select2-container-hover-fg: $tree-fg-hover !default;
|
||||
$select2-container-bg-selected: $tree-bg-selected !default;
|
||||
$select2-container-fg-selected: $tree-fg-selected !default;
|
||||
|
||||
$btn-primary-icon-bg: $color-bg !default;
|
||||
$btn-primary-icon-fg: $color-fg !default;
|
||||
$btn-primary-icon-hover-fg: $color-fg !default;
|
||||
$btn-primary-icon-hover-bg: $color-gray-light !default;
|
||||
$btn-primary-icon-border-color: $color-gray !default;
|
||||
$btn-primary-icon-border-disable-bg: $color-gray !default;
|
||||
$btn-primary-icon-disable-fg: $color-fg !default;
|
||||
$btn-primary-icon-disable-bg: $color-bg !default;
|
||||
|
||||
$editor-toolbar-bg: $sql-gutters-bg !default;
|
||||
$grid-hover-bg-color: $table-hover-bg-color !default;
|
||||
$grid-hover-fg-color: $color-fg !default;
|
||||
|
||||
$btn-copied-color-fg: $active-color !default;
|
||||
|
||||
|
||||
@@ -20,6 +20,9 @@ $color-success: #26852B;
|
||||
$color-success-fg: $black;
|
||||
$color-success-light: #2B472C;
|
||||
|
||||
$color-success-disabled-fg: $color-fg;
|
||||
$color-success-disabled-bg: $color-success;
|
||||
|
||||
$color-warning: #eea236;
|
||||
$color-warning-fg: $black;
|
||||
$color-warning-light: #b18d5a;
|
||||
@@ -56,6 +59,7 @@ $alert-danger-bg: $color-bg;
|
||||
$alert-danger-color: $color-danger;
|
||||
$alert-success-bg: $color-bg;
|
||||
$alert-success-color: $color-success;
|
||||
$alert-header-fg: $color-fg;
|
||||
|
||||
$table-bg: $color-gray-lighter;
|
||||
|
||||
@@ -77,6 +81,7 @@ $explain-sev-3-bg: #c2812b;
|
||||
$explain-sev-4-bg: #880000;
|
||||
$explain-sev-3-color: $color-fg;
|
||||
$explain-sev-4-color: $color-fg;
|
||||
$explain-sev-2-color: $black;
|
||||
|
||||
$negative-bg: $color-bg;
|
||||
|
||||
@@ -88,3 +93,24 @@ $loader-icon-small: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='ut
|
||||
$schemadiff-diff-row-color: #807a48 !default;
|
||||
$schemadiff-source-row-color: #402025 !default;
|
||||
$schemadiff-target-row-color: #6b5438 !default;
|
||||
|
||||
$btn-secondary-fg: $white;
|
||||
$btn-secondary-border-hover-bg: $color-gray-light;
|
||||
$btn-secondary-hover-fg: $white;
|
||||
|
||||
$card-header-bg: $color-gray-lighter;
|
||||
$card-header-fg: $color-fg;
|
||||
$card-header-border-color: $border-color;
|
||||
|
||||
|
||||
$btn-primary-icon-bg: $color-secondary;
|
||||
$btn-primary-icon-fg: $white;
|
||||
$btn-primary-icon-hover-fg: $white;
|
||||
$btn-primary-icon-hover-bg: $color-gray-light;
|
||||
$btn-primary-icon-border-color: $color-gray;
|
||||
$btn-primary-icon-border-disable-bg: $color-gray;
|
||||
$btn-primary-icon-disable-fg: $white;
|
||||
$btn-primary-icon-disable-bg: $color-secondary;
|
||||
|
||||
$btn-ternary-disabled-fg: $color-fg;
|
||||
$color-success-hover-fg: $color-fg;
|
||||
|
||||
@@ -0,0 +1,201 @@
|
||||
$white: #FFFFFF;
|
||||
$color-bg: #010B15;
|
||||
$color-fg: $white;
|
||||
|
||||
$color-primary: #84D6FF;
|
||||
$color-primary-fg: $color-bg;
|
||||
$color-primary-light: #84D6FF;
|
||||
$color-primary-light-fg: $color-bg;
|
||||
$color-secondary: #6B6B6B;
|
||||
|
||||
$color-ternary: #c9d0d7;
|
||||
$color-ternary-fg: $color-bg;
|
||||
|
||||
$color-danger: #EE7A55;
|
||||
$color-danger-icon-fg: $color-bg;
|
||||
$color-danger-fg: $color-bg;
|
||||
$color-danger-light: #EE7A55;
|
||||
$color-danger-lighter: #EE7A55;
|
||||
|
||||
$color-success: #45D48A;
|
||||
$color-success-fg: $color-bg;
|
||||
$color-success-light: #45D48A;
|
||||
|
||||
$color-success-disabled-fg: $color-fg;
|
||||
$color-success-disabled-bg: $color-bg;
|
||||
$color-success-hover-fg: #010B15;
|
||||
|
||||
$color-warning: #F4D35E;
|
||||
$color-warning-fg: $color-bg;
|
||||
$color-warning-light: #F4D35E;
|
||||
|
||||
|
||||
$color-gray-dark: #010B15;
|
||||
$color-gray: #1F2932;
|
||||
$color-gray-light: #2D3A48;
|
||||
$color-gray-lighter: #8B9CAD;
|
||||
|
||||
$sql-gutters-bg: $color-gray-light;
|
||||
$sql-title-bg: #1F2932;
|
||||
$sql-title-fg: $color-fg;
|
||||
$sql-editor-disable-bg: $color-gray;
|
||||
$sql-editor-selection-bg: $color-gray;
|
||||
$sql-history-detail-bg: $color-gray;
|
||||
$sql-history-success-fg: #010B15;
|
||||
|
||||
$color-brand: $color-primary;
|
||||
|
||||
$border-color: #A6B7C8;
|
||||
|
||||
// $shadow-base-color: #C9D0D7;
|
||||
$shadow-base-color: transparent;
|
||||
|
||||
$text-muted: #8b9cad;
|
||||
|
||||
$header-bg: $color-bg;
|
||||
$card-cap-bg: $color-bg;
|
||||
$badge-header-bg: $color-bg;
|
||||
|
||||
$alert-primary-bg: $color-primary;
|
||||
$alert-primary-color: $color-bg;
|
||||
$alert-danger-bg: $color-danger;
|
||||
$alert-danger-color: $color-bg !important;
|
||||
$alert-success-bg̰: $color-success;
|
||||
$alert-success-color: $color-bg;
|
||||
|
||||
$alert-color-fg: $color-bg;
|
||||
|
||||
$negative-bg: $color-bg;
|
||||
|
||||
$popover-bg: $color-gray-dark;
|
||||
$popover-body-color: $color-fg;
|
||||
|
||||
$table-hover-color: $color-bg;
|
||||
$table-hover-bg: $color-fg !important;
|
||||
$table-hover-bg-color: $color-primary-light;
|
||||
|
||||
$input-bg: $color-bg;
|
||||
$input-color: $color-fg;
|
||||
$input-border-color: $border-color;
|
||||
$input-disabled-bg: $color-gray;
|
||||
$input-focus-border-color: $color-primary;
|
||||
$input-btn-focus-shadow-color: none;
|
||||
|
||||
$color-editor-fg: $white;
|
||||
$color-editor-keyword: #F8845F;
|
||||
$color-editor-number: #45D48A;
|
||||
$color-editor-string: #EAEA43;
|
||||
$color-editor-variable: #7DC9F1;
|
||||
$color-editor-variable-2: #7DC9F1;
|
||||
$color-editor-builtin: #B394FC;
|
||||
$color-editor-comment: #FFAD65;
|
||||
$color-editor-bracket: #D6AAAA;
|
||||
$color-editor-operator: $color-fg;
|
||||
$color-editor-foldmarker: #FFFFFF;
|
||||
$color-editor-activeline: #50B0F0;
|
||||
|
||||
$active-color: $color-fg;
|
||||
$active-border: 3px solid $color-primary;
|
||||
|
||||
$table-bg: $color-bg;
|
||||
|
||||
$explain-sev-2-bg: #EAEA43;
|
||||
$explain-sev-3-bg: #FFAD65;
|
||||
$explain-sev-4-bg: #EE7A55;
|
||||
$explain-sev-3-color: #010B15;
|
||||
$explain-sev-4-color: #010B15;
|
||||
$explain-sev-2-color: #010B15;
|
||||
|
||||
$btn-ternary-border: $color-ternary;
|
||||
$btn-ternary-hover-bg: #a6b7c8;
|
||||
$btn-ternary-disabled-bg: $color-bg;
|
||||
$btn-ternary-disabled-fg: $color-fg;
|
||||
$btn-ternary-disabled-border-color: $btn-ternary-disabled-fg;
|
||||
|
||||
$scrollbar-base-color: #C9D0D7;
|
||||
|
||||
$loader-icon : url("data:image/svg+xml;charset=UTF-8,%3c?xml version='1.0' encoding='utf-8'?%3e%3csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 38 38' style='enable-background:new 0 0 38 38;' xml:space='preserve'%3e%3cstyle type='text/css'%3e .st0%7bfill:none;stroke:%23ebeef3;stroke-width:2;%7d .st1%7bfill:none;stroke:%23326690;stroke-width:2;%7d %3c/style%3e%3cg%3e%3cg transform='translate(1 1)'%3e%3ccircle class='st0' cx='18' cy='18' r='18'/%3e%3cpath class='st1' d='M36,18c0-9.9-8.1-18-18-18 '%3e%3canimateTransform accumulate='none' additive='replace' attributeName='transform' calcMode='linear' dur='0.7s' fill='remove' from='0 18 18' repeatCount='indefinite' restart='always' to='360 18 18' type='rotate'%3e%3c/animateTransform%3e%3c/path%3e%3c/g%3e%3c/g%3e%3c/svg%3e ");
|
||||
$loader-icon-small: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 23.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 38 38' style='enable-background:new 0 0 38 38;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:none;stroke:%23EBEEF3;stroke-width:5;%7D .st1%7Bfill:none;stroke:%23326690;stroke-width:5;%7D%0A%3C/style%3E%3Cg%3E%3Cg transform='translate(1 1)'%3E%3Ccircle class='st0' cx='18' cy='18' r='16'/%3E%3Cpath class='st1' d='M34,18c0-8.8-7.2-16-16-16 '%3E%3CanimateTransform accumulate='none' additive='replace' attributeName='transform' calcMode='linear' dur='0.7s' fill='remove' from='0 18 18' repeatCount='indefinite' restart='always' to='360 18 18' type='rotate'%3E%3C/animateTransform%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A");
|
||||
|
||||
$schemadiff-diff-row-color: #CFC56E;
|
||||
$schemadiff-source-row-color: #EE97A5;
|
||||
$schemadiff-target-row-color: #FFAD65;
|
||||
$schema-diff-color-fg: #010B15;
|
||||
|
||||
$tree-text-fg: $color-fg;
|
||||
$tree-text-hover-fg: $color-bg;
|
||||
$tree-fg-hover: $color-bg;
|
||||
$tree-bg-hover: $color-fg;
|
||||
$tree-fg-selected: $color-fg;
|
||||
$tree-bg-selected: $color-primary-light;
|
||||
|
||||
$select2-container-hover-bg: $color-primary;
|
||||
$select2-container-hover-fg: $color-bg;
|
||||
$select2-container-bg-selected: $color-fg;
|
||||
$select2-container-fg-selected: $color-bg;
|
||||
|
||||
$sql-hint-active-fg: $color-bg;
|
||||
|
||||
$btn-primary-hover-bg: $color-fg;
|
||||
$btn-primary-border-hover-bg: $color-fg;
|
||||
$btn-primary-disabled-bg: $color-gray-lighter;
|
||||
|
||||
$btn-secondary-hover-bg: transparent;
|
||||
$btn-secondary-border-hover-bg: $color-fg;
|
||||
$btn-secondary-bg: transparent;
|
||||
$btn-secondary-fg: $color-primary;
|
||||
$btn-secondary-hover-fg: $color-fg;
|
||||
$btn-secondary-border: $color-primary;
|
||||
$btn-secondary-disabled-bg: $color-gray-lighter;
|
||||
$btn-secondary-disabled-fg: $color-gray-lighter;
|
||||
|
||||
$btn-frame-close-bg: $color-gray-light;
|
||||
// $dialog-box-shadow: 0rem 0rem transparent !important;
|
||||
|
||||
$navbar-bg: #062F57;
|
||||
$navbar-dark-color: $color-fg;
|
||||
$navbar-dark-active-color: $color-fg;
|
||||
// $navbar-dark-disabled-color: $color-gray !important;
|
||||
|
||||
$alert-header-bg: #062F57 !important;
|
||||
$alert-header-fg: $color-fg;
|
||||
$alert-action-bg: $alert-header-fg;
|
||||
$alert-action-hover-bg: $color-fg;
|
||||
$alert-dialog-body-bg: $color-gray;
|
||||
|
||||
$datagrid-bg: $color-bg;
|
||||
$datagrid-selected-color : $color-primary-fg;
|
||||
|
||||
$card-header-bg: #062F57 !important;
|
||||
$card-header-fg: $color-fg !important;
|
||||
$card-header-border-color: $card-header-bg;
|
||||
$card-border-color: transparent;
|
||||
$card-bg: $color-gray;
|
||||
|
||||
|
||||
$custom-forms-transition: none;
|
||||
$custom-control-indicator-focus-border-color: #FFFFFF !important;
|
||||
$custom-control-indicator-border-color: $color-gray-lighter;
|
||||
|
||||
$panel-color-fg: $color-ternary;
|
||||
$panel-border-color: $color-gray;
|
||||
|
||||
$btn-primary-icon-bg: $color-bg;
|
||||
$btn-primary-icon-border-color: $color-fg;
|
||||
$btn-primary-icon-border-disable-bg: $color-gray-lighter;
|
||||
$btn-primary-icon-fg: $color-fg;
|
||||
$btn-primary-icon-hover-bg: $color-fg;
|
||||
$btn-primary-icon-hover-fg: $color-bg;
|
||||
$btn-primary-icon-disable-fg: $color-gray-lighter;
|
||||
$btn-primary-icon-disable-bg: $color-gray;
|
||||
|
||||
$dropdown-link-remove-color: $color-bg;
|
||||
|
||||
$editor-toolbar-bg: $color-bg;
|
||||
|
||||
$grid-hover-bg-color: $white;
|
||||
$grid-hover-fg-color: #010B15;
|
||||
|
||||
$btn-copied-color-fg: #010B15;
|
||||
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 56 KiB |
Reference in New Issue
Block a user