mirror of https://github.com/node-red/node-red.git
Fix Sass deprecation warnings
Mauricio Bonani
parent
83acc4836b
commit
d8c56df45f
|
|
@ -1,3 +1,5 @@
|
|||
@use "mixins";
|
||||
|
||||
.red-ui-editor, .red-ui-editor-dialog {
|
||||
|
||||
.ace_read-only {
|
||||
|
|
@ -42,7 +44,7 @@
|
|||
background: var(--red-ui-popover-background);
|
||||
color: var(--red-ui-popover-color);
|
||||
border-radius: 4px;
|
||||
@include component-shadow;
|
||||
@include mixins.component-shadow;
|
||||
border-color: var(--red-ui-popover-background);
|
||||
}
|
||||
.ace_content {
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
@use "mixins";
|
||||
|
||||
/**
|
||||
* Copyright JS Foundation and other contributors, http://js.foundation
|
||||
*
|
||||
|
|
@ -43,7 +45,7 @@ body {
|
|||
}
|
||||
|
||||
#red-ui-palette-shade, #red-ui-editor-shade, #red-ui-header-shade, #red-ui-sidebar-shade {
|
||||
@include shade;
|
||||
@include mixins.shade;
|
||||
z-index: 5;
|
||||
}
|
||||
#red-ui-sidebar-shade {
|
||||
|
|
@ -52,7 +54,7 @@ body {
|
|||
bottom: -1px;
|
||||
}
|
||||
#red-ui-full-shade {
|
||||
@include shade;
|
||||
@include mixins.shade;
|
||||
z-index: 15;
|
||||
}
|
||||
.red-ui-editor,
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
@use "mixins";
|
||||
|
||||
/**
|
||||
* Copyright JS Foundation and other contributors, http://js.foundation
|
||||
*
|
||||
|
|
@ -63,7 +65,7 @@
|
|||
}
|
||||
}
|
||||
.red-ui-tray-header {
|
||||
@include disable-selection;
|
||||
@include mixins.disable-selection;
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
font-weight: bold;
|
||||
|
|
@ -77,7 +79,7 @@
|
|||
}
|
||||
|
||||
.red-ui-tray-footer {
|
||||
@include component-footer;
|
||||
@include mixins.component-footer;
|
||||
height: 35px;
|
||||
font-size: 14px !important;
|
||||
line-height: 35px;
|
||||
|
|
@ -110,9 +112,9 @@
|
|||
padding: 6px;
|
||||
|
||||
button {
|
||||
@include editor-button;
|
||||
@include mixins.editor-button;
|
||||
&.toggle {
|
||||
@include workspace-button-toggle;
|
||||
@include mixins.workspace-button-toggle;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -179,7 +181,7 @@
|
|||
}
|
||||
a.red-ui-tray-resize-button,
|
||||
button.red-ui-tray-resize-button {
|
||||
@include workspace-button;
|
||||
@include mixins.workspace-button;
|
||||
display: block;
|
||||
height: 37px;
|
||||
line-height: 35px;
|
||||
|
|
@ -274,7 +276,7 @@ button.editor-button, // Deprecated: use .red-ui-button
|
|||
a.red-ui-button,
|
||||
button.red-ui-button
|
||||
{
|
||||
@include workspace-button;
|
||||
@include mixins.workspace-button;
|
||||
height: 34px;
|
||||
line-height: 32px;
|
||||
font-size: 13px;
|
||||
|
|
@ -283,7 +285,7 @@ button.red-ui-button
|
|||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
&.toggle {
|
||||
@include workspace-button-toggle;
|
||||
@include mixins.workspace-button-toggle;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
@use "mixins";
|
||||
|
||||
/**
|
||||
* Copyright JS Foundation and other contributors, http://js.foundation
|
||||
*
|
||||
|
|
@ -41,7 +43,7 @@
|
|||
font-size: 14px;
|
||||
pointer-events: none;
|
||||
-webkit-touch-callout: none;
|
||||
@include disable-selection;
|
||||
@include mixins.disable-selection;
|
||||
|
||||
.red-ui-flow-node-label-text {
|
||||
dominant-baseline: middle;
|
||||
|
|
@ -60,7 +62,7 @@
|
|||
text-anchor: middle;
|
||||
pointer-events: none;
|
||||
-webkit-touch-callout: none;
|
||||
@include disable-selection;
|
||||
@include mixins.disable-selection;
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -155,7 +157,7 @@ svg:not(.red-ui-workspace-lasso-active) {
|
|||
stroke-opacity: var(--red-ui-group-default-stroke-opacity);
|
||||
}
|
||||
.red-ui-flow-group-label {
|
||||
@include disable-selection;
|
||||
@include mixins.disable-selection;
|
||||
fill: var(--red-ui-group-default-label-color);
|
||||
}
|
||||
|
||||
|
|
@ -174,10 +176,10 @@ svg:not(.red-ui-workspace-lasso-active) {
|
|||
}
|
||||
.red-ui-flow-node-icon-group {
|
||||
text {
|
||||
@include disable-selection;
|
||||
@include mixins.disable-selection;
|
||||
}
|
||||
.fa-lg {
|
||||
@include disable-selection;
|
||||
@include mixins.disable-selection;
|
||||
stroke: none;
|
||||
fill: var(--red-ui-node-icon-color);
|
||||
text-anchor: middle;
|
||||
|
|
@ -311,7 +313,7 @@ g.red-ui-flow-node-selected {
|
|||
fill-opacity: 0.9;
|
||||
}
|
||||
.red-ui-flow-node-status-label {
|
||||
@include disable-selection;
|
||||
@include mixins.disable-selection;
|
||||
stroke-width: 0;
|
||||
fill: var(--red-ui-secondary-text-color);
|
||||
font-size:9pt;
|
||||
|
|
@ -417,7 +419,7 @@ g.red-ui-flow-link-unknown path.red-ui-flow-link-line {
|
|||
pointer-events: none;
|
||||
-webkit-touch-callout: none;
|
||||
white-space: pre;
|
||||
@include disable-selection;
|
||||
@include mixins.disable-selection;
|
||||
}
|
||||
.red-ui-flow-junction-dragging {
|
||||
.red-ui-flow-junction-background {
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
@use "mixins";
|
||||
|
||||
/**
|
||||
* Copyright JS Foundation and other contributors, http://js.foundation
|
||||
*
|
||||
|
|
@ -15,7 +17,7 @@
|
|||
**/
|
||||
|
||||
.button {
|
||||
@include disable-selection;
|
||||
@include mixins.disable-selection;
|
||||
}
|
||||
|
||||
#red-ui-header {
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
@use "mixins";
|
||||
|
||||
/**
|
||||
* Copyright JS Foundation and other contributors, http://js.foundation
|
||||
*
|
||||
|
|
@ -54,7 +56,7 @@
|
|||
border-radius: 1px;
|
||||
background: var(--red-ui-secondary-background);
|
||||
padding: 0;
|
||||
@include component-shadow;
|
||||
@include mixins.component-shadow;
|
||||
}
|
||||
.ui-dialog .ui-dialog-content {
|
||||
padding: 25px 25px 10px 25px;
|
||||
|
|
@ -92,7 +94,7 @@
|
|||
}
|
||||
|
||||
.ui-dialog-buttonset button {
|
||||
@include workspace-button;
|
||||
@include mixins.workspace-button;
|
||||
font-size: 14px;
|
||||
padding: 6px 14px;
|
||||
margin-right: 8px;
|
||||
|
|
@ -160,7 +162,7 @@
|
|||
|
||||
|
||||
.ui-widget-overlay {
|
||||
@include shade;
|
||||
@include mixins.shade;
|
||||
z-index: 100;
|
||||
opacity: 1;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
@use "mixins";
|
||||
|
||||
/**
|
||||
* Copyright JS Foundation and other contributors, http://js.foundation
|
||||
*
|
||||
|
|
@ -254,7 +256,7 @@
|
|||
display: flex;
|
||||
flex-direction: row;
|
||||
span:not(:nth-child(2)) {
|
||||
@include disable-selection;
|
||||
@include mixins.disable-selection;
|
||||
}
|
||||
span {
|
||||
padding: 8px 0;
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
@use "mixins";
|
||||
|
||||
/**
|
||||
* Copyright JS Foundation and other contributors, http://js.foundation
|
||||
*
|
||||
|
|
@ -167,7 +169,7 @@
|
|||
color: var(--red-ui-secondary-text-color);
|
||||
padding-left: 5px;
|
||||
font-size: 0.9em;
|
||||
@include enable-selection;
|
||||
@include mixins.enable-selection;
|
||||
}
|
||||
.red-ui-palette-module-type-swatch {
|
||||
display: inline-block;
|
||||
|
|
@ -226,12 +228,12 @@
|
|||
.red-ui-palette-module-name {
|
||||
color: var(--red-ui-primary-text-color);
|
||||
white-space: nowrap;
|
||||
@include enable-selection;
|
||||
@include mixins.enable-selection;
|
||||
}
|
||||
.red-ui-palette-module-version, .red-ui-palette-module-updated, .red-ui-palette-module-link {
|
||||
font-style:italic;
|
||||
font-size: 0.8em;
|
||||
@include enable-selection;
|
||||
@include mixins.enable-selection;
|
||||
}
|
||||
.red-ui-palette-module-button-group {
|
||||
position: absolute;
|
||||
|
|
@ -256,7 +258,7 @@ ul.red-ui-palette-module-error-list {
|
|||
}
|
||||
|
||||
.red-ui-palette-module-shade {
|
||||
@include shade;
|
||||
@include mixins.shade;
|
||||
text-align: center;
|
||||
padding-top: 20px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
@use "mixins";
|
||||
|
||||
/**
|
||||
* Copyright JS Foundation and other contributors, http://js.foundation
|
||||
*
|
||||
|
|
@ -23,8 +25,8 @@
|
|||
background: var(--red-ui-primary-background);
|
||||
width: 180px;
|
||||
text-align: center;
|
||||
@include disable-selection;
|
||||
@include component-border;
|
||||
@include mixins.disable-selection;
|
||||
@include mixins.component-border;
|
||||
transition: width 0.2s ease-in-out;
|
||||
}
|
||||
|
||||
|
|
@ -112,7 +114,7 @@
|
|||
line-height: 20px;
|
||||
overflow: hidden;
|
||||
text-align: center;
|
||||
@include disable-selection;
|
||||
@include mixins.disable-selection;
|
||||
}
|
||||
.red-ui-palette-label-right {
|
||||
margin: 4px 32px 4px 0;
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
@use "mixins";
|
||||
|
||||
/**
|
||||
* Copyright JS Foundation and other contributors, http://js.foundation
|
||||
*
|
||||
|
|
@ -28,7 +30,7 @@
|
|||
font-family: var(--red-ui-primary-font);
|
||||
font-size: 14px;
|
||||
line-height: 1.4em;
|
||||
@include component-shadow;
|
||||
@include mixins.component-shadow;
|
||||
border-color: var(--red-ui-popover-border);
|
||||
}
|
||||
.red-ui-popover-content {
|
||||
|
|
@ -194,7 +196,7 @@
|
|||
|
||||
|
||||
.red-ui-popover-panel {
|
||||
@include component-shadow;
|
||||
@include mixins.component-shadow;
|
||||
font-family: var(--red-ui-primary-font);
|
||||
font-size: var(--red-ui-primary-font-size);
|
||||
position: absolute;
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
@use "mixins";
|
||||
|
||||
/**
|
||||
* Copyright JS Foundation and other contributors, http://js.foundation
|
||||
*
|
||||
|
|
@ -23,7 +25,7 @@
|
|||
background: var(--red-ui-primary-background);
|
||||
box-sizing: border-box;
|
||||
z-index: 10;
|
||||
@include component-border;
|
||||
@include mixins.component-border;
|
||||
}
|
||||
|
||||
#red-ui-sidebar.closing {
|
||||
|
|
@ -73,7 +75,7 @@
|
|||
.red-ui-sidebar-closed > #red-ui-editor-stack { right: 8px !important; }
|
||||
|
||||
#red-ui-sidebar .button {
|
||||
@include workspace-button;
|
||||
@include mixins.workspace-button;
|
||||
line-height: 18px;
|
||||
font-size: 12px;
|
||||
margin-right: 5px;
|
||||
|
|
@ -92,23 +94,23 @@
|
|||
|
||||
/* Deprecated -> red-ui-footer-button */
|
||||
.sidebar-footer-button {
|
||||
@include component-footer-button;
|
||||
@include mixins.component-footer-button;
|
||||
}
|
||||
/* Deprecated -> red-ui-footer-button-toggle */
|
||||
.sidebar-footer-button-toggle {
|
||||
@include component-footer-button-toggle;
|
||||
@include mixins.component-footer-button-toggle;
|
||||
}
|
||||
|
||||
a.sidebar-header-button,
|
||||
button.sidebar-header-button, /* Deprecated -> red-ui-sidebar-header-button */
|
||||
a.red-ui-sidebar-header-button,
|
||||
button.red-ui-sidebar-header-button {
|
||||
@include workspace-button;
|
||||
@include mixins.workspace-button;
|
||||
font-size: 13px;
|
||||
line-height: 13px;
|
||||
padding: 5px 8px;
|
||||
&.toggle {
|
||||
@include workspace-button-toggle;
|
||||
@include mixins.workspace-button-toggle;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -116,7 +118,7 @@ a.sidebar-header-button-toggle, /* Deprecated -> red-ui-sidebar-header-button-to
|
|||
button.sidebar-header-button-toggle, /* Deprecated -> red-ui-sidebar-header-button-toggle */
|
||||
a.red-ui-sidebar-header-button-toggle,
|
||||
button.red-ui-sidebar-header-button-toggle {
|
||||
@include workspace-button-toggle;
|
||||
@include mixins.workspace-button-toggle;
|
||||
font-size: 13px;
|
||||
line-height: 13px;
|
||||
padding: 5px 8px;
|
||||
|
|
@ -128,7 +130,7 @@ button.red-ui-sidebar-header-button-toggle {
|
|||
}
|
||||
|
||||
.red-ui-sidebar-shade {
|
||||
@include shade;
|
||||
@include mixins.shade;
|
||||
}
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -14,6 +14,6 @@
|
|||
* limitations under the License.
|
||||
**/
|
||||
|
||||
@import "colors";
|
||||
@import "sizes";
|
||||
@import "variables";
|
||||
@use "colors";
|
||||
@use "sizes";
|
||||
@use "variables";
|
||||
|
|
@ -14,64 +14,64 @@
|
|||
* limitations under the License.
|
||||
**/
|
||||
|
||||
@import "colors";
|
||||
@import "sizes";
|
||||
@import "variables";
|
||||
@import "mixins";
|
||||
@use "colors";
|
||||
@use "sizes";
|
||||
@use "variables";
|
||||
@use "mixins";
|
||||
|
||||
@import "base";
|
||||
@import "forms";
|
||||
@use "base";
|
||||
@use "forms";
|
||||
|
||||
@import "jquery";
|
||||
@import "ace";
|
||||
@use "jquery";
|
||||
@use "ace";
|
||||
|
||||
@import "dropdownMenu";
|
||||
@use "dropdownMenu";
|
||||
|
||||
@import "header";
|
||||
@import "palette";
|
||||
@import "sidebar";
|
||||
@import "workspace";
|
||||
@import "workspaceToolbar";
|
||||
@use "header";
|
||||
@use "palette";
|
||||
@use "sidebar";
|
||||
@use "workspace";
|
||||
@use "workspaceToolbar";
|
||||
|
||||
@import "notifications";
|
||||
@use "notifications";
|
||||
|
||||
@import "editor";
|
||||
@import "library";
|
||||
@import "search";
|
||||
@use "editor";
|
||||
@use "library";
|
||||
@use "search";
|
||||
|
||||
@import "panels";
|
||||
@import "tabs";
|
||||
@import "tab-config";
|
||||
@import "tab-context";
|
||||
@import "tab-info";
|
||||
@import "tab-help";
|
||||
@import "popover";
|
||||
@import "flow";
|
||||
@import "palette-editor";
|
||||
@import "diff";
|
||||
@use "panels";
|
||||
@use "tabs";
|
||||
@use "tab-config";
|
||||
@use "tab-context";
|
||||
@use "tab-info";
|
||||
@use "tab-help";
|
||||
@use "popover";
|
||||
@use "flow";
|
||||
@use "palette-editor";
|
||||
@use "diff";
|
||||
|
||||
@import "userSettings";
|
||||
@use "userSettings";
|
||||
|
||||
@import "projects";
|
||||
@use "projects";
|
||||
|
||||
|
||||
@import "ui/common/editableList";
|
||||
@import "ui/common/searchBox";
|
||||
@import "ui/common/typedInput";
|
||||
@import "ui/common/nodeList";
|
||||
@import "ui/common/checkboxSet";
|
||||
@import "ui/common/stack";
|
||||
@import "ui/common/treeList";
|
||||
@import "ui/common/autoComplete";
|
||||
@use "ui/common/editableList";
|
||||
@use "ui/common/searchBox";
|
||||
@use "ui/common/typedInput";
|
||||
@use "ui/common/nodeList";
|
||||
@use "ui/common/checkboxSet";
|
||||
@use "ui/common/stack";
|
||||
@use "ui/common/treeList";
|
||||
@use "ui/common/autoComplete";
|
||||
|
||||
@import "dragdrop";
|
||||
@use "dragdrop";
|
||||
|
||||
@import "keyboard";
|
||||
@use "keyboard";
|
||||
|
||||
@import "debug";
|
||||
@use "debug";
|
||||
|
||||
@import "radialMenu";
|
||||
@use "radialMenu";
|
||||
|
||||
@import "tourGuide";
|
||||
@use "tourGuide";
|
||||
|
||||
@import "multiplayer";
|
||||
@use "multiplayer";
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
@use "mixins";
|
||||
|
||||
/**
|
||||
* Copyright JS Foundation and other contributors, http://js.foundation
|
||||
*
|
||||
|
|
@ -19,7 +21,7 @@
|
|||
background: var(--red-ui-secondary-background);
|
||||
height: 100%;
|
||||
overflow-y:auto;
|
||||
@include disable-selection;
|
||||
@include mixins.disable-selection;
|
||||
|
||||
&:focus {
|
||||
outline: none;
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
@use "mixins";
|
||||
|
||||
/**
|
||||
* Copyright JS Foundation and other contributors, http://js.foundation
|
||||
*
|
||||
|
|
@ -25,6 +27,7 @@
|
|||
padding-left: 9px;
|
||||
line-height: 21px;
|
||||
cursor: default;
|
||||
border-bottom: 1px solid var(--red-ui-secondary-border-color);
|
||||
> * {
|
||||
vertical-align: middle
|
||||
}
|
||||
|
|
@ -33,7 +36,6 @@
|
|||
margin-left: 5px;
|
||||
overflow-wrap: anywhere;
|
||||
}
|
||||
border-bottom: 1px solid var(--red-ui-secondary-border-color);
|
||||
}
|
||||
table.red-ui-info-table {
|
||||
font-size: 14px;
|
||||
|
|
@ -307,7 +309,7 @@ div.red-ui-info-table {
|
|||
text-align: center;
|
||||
line-height: 1.9em;
|
||||
color : var(--red-ui-tertiary-text-color);
|
||||
@include disable-selection;
|
||||
@include mixins.disable-selection;
|
||||
cursor: default;
|
||||
}
|
||||
.red-ui-help-tips-buttons {
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
@use "mixins";
|
||||
|
||||
/**
|
||||
* Copyright JS Foundation and other contributors, http://js.foundation
|
||||
*
|
||||
|
|
@ -41,7 +43,7 @@
|
|||
box-sizing:border-box;
|
||||
border-bottom: 1px solid var(--red-ui-primary-border-color);
|
||||
white-space: nowrap;
|
||||
@include disable-selection;
|
||||
@include mixins.disable-selection;
|
||||
|
||||
li {
|
||||
box-sizing: border-box;
|
||||
|
|
@ -243,7 +245,7 @@
|
|||
z-index: 2;
|
||||
|
||||
a {
|
||||
@include workspace-button;
|
||||
@include mixins.workspace-button;
|
||||
line-height: 30px;
|
||||
height: 28px;
|
||||
width: 28px;
|
||||
|
|
@ -265,7 +267,7 @@
|
|||
border-bottom: 1px solid var(--red-ui-primary-border-color);
|
||||
z-index: 2;
|
||||
a {
|
||||
@include workspace-button-toggle;
|
||||
@include mixins.workspace-button-toggle;
|
||||
line-height: 26px;
|
||||
height: 28px;
|
||||
width: 28px;
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
@use "../../mixins";
|
||||
|
||||
/**
|
||||
* Copyright JS Foundation and other contributors, http://js.foundation
|
||||
*
|
||||
|
|
@ -67,7 +69,7 @@
|
|||
}
|
||||
}
|
||||
.red-ui-treeList-label {
|
||||
@include disable-selection;
|
||||
@include mixins.disable-selection;
|
||||
padding: 6px 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
@use "../../mixins";
|
||||
|
||||
/**
|
||||
* Copyright JS Foundation and other contributors, http://js.foundation
|
||||
*
|
||||
|
|
@ -67,7 +69,7 @@
|
|||
}
|
||||
}
|
||||
.red-ui-typedInput-options {
|
||||
@include component-shadow;
|
||||
@include mixins.component-shadow;
|
||||
font-family: var(--red-ui-primary-font);
|
||||
font-size: var(--red-ui-primary-font-size);
|
||||
|
||||
|
|
|
|||
|
|
@ -1,305 +1,309 @@
|
|||
@use "sass:map";
|
||||
@use "colors";
|
||||
@use "sizes";
|
||||
|
||||
:root {
|
||||
|
||||
--red-ui-primary-font: #{$primary-font};
|
||||
--red-ui-primary-font-size: #{$primary-font-size};
|
||||
--red-ui-monospace-font: #{$monospace-font};
|
||||
--red-ui-primary-font: #{colors.$primary-font};
|
||||
--red-ui-primary-font-size: #{colors.$primary-font-size};
|
||||
--red-ui-monospace-font: #{colors.$monospace-font};
|
||||
|
||||
--red-ui-primary-background: #{$primary-background};
|
||||
--red-ui-primary-background: #{colors.$primary-background};
|
||||
|
||||
--red-ui-secondary-background: #{$secondary-background};
|
||||
--red-ui-secondary-background-selected: #{$secondary-background-selected};
|
||||
--red-ui-secondary-background-inactive: #{$secondary-background-inactive};
|
||||
--red-ui-secondary-background-hover: #{$secondary-background-hover};
|
||||
--red-ui-secondary-background-disabled: #{$secondary-background-disabled};
|
||||
--red-ui-secondary-background: #{colors.$secondary-background};
|
||||
--red-ui-secondary-background-selected: #{colors.$secondary-background-selected};
|
||||
--red-ui-secondary-background-inactive: #{colors.$secondary-background-inactive};
|
||||
--red-ui-secondary-background-hover: #{colors.$secondary-background-hover};
|
||||
--red-ui-secondary-background-disabled: #{colors.$secondary-background-disabled};
|
||||
|
||||
--red-ui-tertiary-background: #{$tertiary-background};
|
||||
--red-ui-tertiary-background: #{colors.$tertiary-background};
|
||||
|
||||
--red-ui-shadow: #{$shadow};
|
||||
--red-ui-shadow: #{colors.$shadow};
|
||||
|
||||
// Header Height
|
||||
--red-ui-header-height: #{$header-height};
|
||||
--red-ui-header-height: #{sizes.$header-height};
|
||||
|
||||
// Main body text
|
||||
--red-ui-primary-text-color: #{$primary-text-color};
|
||||
--red-ui-primary-text-color: #{colors.$primary-text-color};
|
||||
// UI control label text
|
||||
--red-ui-secondary-text-color: #{$secondary-text-color};
|
||||
--red-ui-secondary-text-color-focus: #{$secondary-text-color-focus};
|
||||
--red-ui-secondary-text-color-hover: #{$secondary-text-color-hover};
|
||||
--red-ui-secondary-text-color-active: #{$secondary-text-color-active};
|
||||
--red-ui-secondary-text-color-selected: #{$secondary-text-color-selected};
|
||||
--red-ui-secondary-text-color-inactive: #{$secondary-text-color-inactive};
|
||||
--red-ui-secondary-text-color-disabled: #{$secondary-text-color-disabled};
|
||||
--red-ui-secondary-text-color-disabled-active: #{$secondary-text-color-disabled-active};
|
||||
--red-ui-secondary-text-color-disabled-inactive: #{$secondary-text-color-disabled-inactive};
|
||||
--red-ui-secondary-text-color: #{colors.$secondary-text-color};
|
||||
--red-ui-secondary-text-color-focus: #{colors.$secondary-text-color-focus};
|
||||
--red-ui-secondary-text-color-hover: #{colors.$secondary-text-color-hover};
|
||||
--red-ui-secondary-text-color-active: #{colors.$secondary-text-color-active};
|
||||
--red-ui-secondary-text-color-selected: #{colors.$secondary-text-color-selected};
|
||||
--red-ui-secondary-text-color-inactive: #{colors.$secondary-text-color-inactive};
|
||||
--red-ui-secondary-text-color-disabled: #{colors.$secondary-text-color-disabled};
|
||||
--red-ui-secondary-text-color-disabled-active: #{colors.$secondary-text-color-disabled-active};
|
||||
--red-ui-secondary-text-color-disabled-inactive: #{colors.$secondary-text-color-disabled-inactive};
|
||||
|
||||
// Sub label text
|
||||
--red-ui-tertiary-text-color: #{$tertiary-text-color};
|
||||
--red-ui-tertiary-text-color: #{colors.$tertiary-text-color};
|
||||
// Heading text
|
||||
--red-ui-header-text-color: #{$header-text-color};
|
||||
--red-ui-header-text-color: #{colors.$header-text-color};
|
||||
|
||||
--red-ui-text-color-error: #{$text-color-error};
|
||||
--red-ui-text-color-warning: #{$text-color-warning};
|
||||
--red-ui-text-color-success: #{$text-color-success};
|
||||
--red-ui-text-color-code: #{$text-color-code};
|
||||
--red-ui-text-color-link: #{$text-color-link};
|
||||
--red-ui-text-color-error: #{colors.$text-color-error};
|
||||
--red-ui-text-color-warning: #{colors.$text-color-warning};
|
||||
--red-ui-text-color-success: #{colors.$text-color-success};
|
||||
--red-ui-text-color-code: #{colors.$text-color-code};
|
||||
--red-ui-text-color-link: #{colors.$text-color-link};
|
||||
|
||||
|
||||
--red-ui-primary-border-color: #{$primary-border-color};
|
||||
--red-ui-secondary-border-color: #{$secondary-border-color};
|
||||
--red-ui-tertiary-border-color: #{$tertiary-border-color};
|
||||
--red-ui-primary-border-color: #{colors.$primary-border-color};
|
||||
--red-ui-secondary-border-color: #{colors.$secondary-border-color};
|
||||
--red-ui-tertiary-border-color: #{colors.$tertiary-border-color};
|
||||
|
||||
--red-ui-border-color-error: #{$border-color-error};
|
||||
--red-ui-border-color-warning: #{$border-color-warning};
|
||||
--red-ui-border-color-success: #{$border-color-success};
|
||||
--red-ui-border-color-error: #{colors.$border-color-error};
|
||||
--red-ui-border-color-warning: #{colors.$border-color-warning};
|
||||
--red-ui-border-color-success: #{colors.$border-color-success};
|
||||
|
||||
--red-ui-form-background: #{$form-background};
|
||||
--red-ui-form-placeholder-color: #{$form-placeholder-color};
|
||||
--red-ui-form-text-color: #{$form-text-color};
|
||||
--red-ui-form-text-color-disabled: #{$form-text-color-disabled};
|
||||
--red-ui-form-input-focus-color: #{$form-input-focus-color};
|
||||
--red-ui-form-input-border-color: #{$form-input-border-color};
|
||||
--red-ui-form-input-border-selected-color: #{$form-input-border-selected-color};
|
||||
--red-ui-form-input-border-error-color: #{$form-input-border-error-color};
|
||||
--red-ui-form-input-background: #{$form-input-background};
|
||||
--red-ui-form-input-background-disabled: #{$form-input-background-disabled};
|
||||
--red-ui-form-button-background: #{$form-button-background};
|
||||
--red-ui-form-background: #{colors.$form-background};
|
||||
--red-ui-form-placeholder-color: #{colors.$form-placeholder-color};
|
||||
--red-ui-form-text-color: #{colors.$form-text-color};
|
||||
--red-ui-form-text-color-disabled: #{colors.$form-text-color-disabled};
|
||||
--red-ui-form-input-focus-color: #{colors.$form-input-focus-color};
|
||||
--red-ui-form-input-border-color: #{colors.$form-input-border-color};
|
||||
--red-ui-form-input-border-selected-color: #{colors.$form-input-border-selected-color};
|
||||
--red-ui-form-input-border-error-color: #{colors.$form-input-border-error-color};
|
||||
--red-ui-form-input-background: #{colors.$form-input-background};
|
||||
--red-ui-form-input-background-disabled: #{colors.$form-input-background-disabled};
|
||||
--red-ui-form-button-background: #{colors.$form-button-background};
|
||||
|
||||
--red-ui-form-tips-background: #{$form-tips-background};
|
||||
--red-ui-form-tips-background: #{colors.$form-tips-background};
|
||||
|
||||
|
||||
--red-ui-text-editor-color: #{$text-editor-color};
|
||||
--red-ui-text-editor-background: #{$text-editor-background};
|
||||
--red-ui-text-editor-color-disabled: #{$text-editor-color-disabled};
|
||||
--red-ui-text-editor-background-disabled: #{$text-editor-background-disabled};
|
||||
--red-ui-text-editor-gutter-background: #{$text-editor-gutter-background};
|
||||
--red-ui-text-editor-gutter-color: #{$text-editor-gutter-color};
|
||||
--red-ui-text-editor-gutter-active-line-background: #{$text-editor-gutter-active-line-background};
|
||||
--red-ui-text-editor-active-line-background: #{$text-editor-active-line-background};
|
||||
--red-ui-text-editor-selection-background: #{$text-editor-selection-background};
|
||||
--red-ui-text-editor-color: #{colors.$text-editor-color};
|
||||
--red-ui-text-editor-background: #{colors.$text-editor-background};
|
||||
--red-ui-text-editor-color-disabled: #{colors.$text-editor-color-disabled};
|
||||
--red-ui-text-editor-background-disabled: #{colors.$text-editor-background-disabled};
|
||||
--red-ui-text-editor-gutter-background: #{colors.$text-editor-gutter-background};
|
||||
--red-ui-text-editor-gutter-color: #{colors.$text-editor-gutter-color};
|
||||
--red-ui-text-editor-gutter-active-line-background: #{colors.$text-editor-gutter-active-line-background};
|
||||
--red-ui-text-editor-active-line-background: #{colors.$text-editor-active-line-background};
|
||||
--red-ui-text-editor-selection-background: #{colors.$text-editor-selection-background};
|
||||
|
||||
--red-ui-event-log-background: #{$event-log-background};
|
||||
--red-ui-event-log-color: #{$event-log-color};
|
||||
--red-ui-event-log-active-line-background: #{$event-log-active-line-background};
|
||||
--red-ui-event-log-selection-background: #{$event-log-selection-background};
|
||||
--red-ui-event-log-background: #{colors.$event-log-background};
|
||||
--red-ui-event-log-color: #{colors.$event-log-color};
|
||||
--red-ui-event-log-active-line-background: #{colors.$event-log-active-line-background};
|
||||
--red-ui-event-log-selection-background: #{colors.$event-log-selection-background};
|
||||
|
||||
|
||||
|
||||
|
||||
--red-ui-list-item-color: #{$list-item-color};
|
||||
--red-ui-list-item-secondary-color: #{$list-item-secondary-color};
|
||||
--red-ui-list-item-background: #{$list-item-background};
|
||||
--red-ui-list-item-background-disabled: #{$list-item-background-disabled};
|
||||
--red-ui-list-item-background-hover: #{$list-item-background-hover};
|
||||
--red-ui-list-item-background-selected: #{$list-item-background-selected};
|
||||
--red-ui-list-item-border-selected: #{$list-item-border-selected};
|
||||
--red-ui-list-item-color: #{colors.$list-item-color};
|
||||
--red-ui-list-item-secondary-color: #{colors.$list-item-secondary-color};
|
||||
--red-ui-list-item-background: #{colors.$list-item-background};
|
||||
--red-ui-list-item-background-disabled: #{colors.$list-item-background-disabled};
|
||||
--red-ui-list-item-background-hover: #{colors.$list-item-background-hover};
|
||||
--red-ui-list-item-background-selected: #{colors.$list-item-background-selected};
|
||||
--red-ui-list-item-border-selected: #{colors.$list-item-border-selected};
|
||||
|
||||
--red-ui-tab-text-color-active: #{$tab-text-color-active};
|
||||
--red-ui-tab-text-color-inactive: #{$tab-text-color-inactive};
|
||||
--red-ui-tab-text-color-disabled-active: #{$tab-text-color-disabled-active};
|
||||
--red-ui-tab-text-color-disabled-inactive: #{$tab-text-color-disabled-inactive};
|
||||
--red-ui-tab-text-color-active: #{colors.$tab-text-color-active};
|
||||
--red-ui-tab-text-color-inactive: #{colors.$tab-text-color-inactive};
|
||||
--red-ui-tab-text-color-disabled-active: #{colors.$tab-text-color-disabled-active};
|
||||
--red-ui-tab-text-color-disabled-inactive: #{colors.$tab-text-color-disabled-inactive};
|
||||
|
||||
--red-ui-tab-badge-color: #{$tab-badge-color};
|
||||
--red-ui-tab-background: #{$tab-background};
|
||||
--red-ui-tab-background-active: #{$tab-background-active};
|
||||
--red-ui-tab-background-active-alpha: #{$tab-background-active-alpha};
|
||||
--red-ui-tab-background-selected: #{$tab-background-selected};
|
||||
--red-ui-tab-background-selected-alpha: #{$tab-background-selected-alpha};
|
||||
--red-ui-tab-background-inactive: #{$tab-background-inactive};
|
||||
--red-ui-tab-background-inactive-alpha: #{$tab-background-inactive-alpha};
|
||||
--red-ui-tab-background-hover: #{$tab-background-hover};
|
||||
--red-ui-tab-background-hover-alpha: #{$tab-background-hover-alpha};
|
||||
--red-ui-tab-badge-color: #{colors.$tab-badge-color};
|
||||
--red-ui-tab-background: #{colors.$tab-background};
|
||||
--red-ui-tab-background-active: #{colors.$tab-background-active};
|
||||
--red-ui-tab-background-active-alpha: #{colors.$tab-background-active-alpha};
|
||||
--red-ui-tab-background-selected: #{colors.$tab-background-selected};
|
||||
--red-ui-tab-background-selected-alpha: #{colors.$tab-background-selected-alpha};
|
||||
--red-ui-tab-background-inactive: #{colors.$tab-background-inactive};
|
||||
--red-ui-tab-background-inactive-alpha: #{colors.$tab-background-inactive-alpha};
|
||||
--red-ui-tab-background-hover: #{colors.$tab-background-hover};
|
||||
--red-ui-tab-background-hover-alpha: #{colors.$tab-background-hover-alpha};
|
||||
|
||||
--red-ui-palette-header-background: #{$palette-header-background};
|
||||
--red-ui-palette-header-color: #{$palette-header-color};
|
||||
--red-ui-palette-content-background: #{$palette-content-background};
|
||||
--red-ui-palette-header-background: #{colors.$palette-header-background};
|
||||
--red-ui-palette-header-color: #{colors.$palette-header-color};
|
||||
--red-ui-palette-content-background: #{colors.$palette-content-background};
|
||||
|
||||
|
||||
--red-ui-workspace-button-background: #{$workspace-button-background};
|
||||
--red-ui-workspace-button-background-hover: #{$workspace-button-background-hover};
|
||||
--red-ui-workspace-button-background-active: #{$workspace-button-background-active};
|
||||
--red-ui-workspace-button-background: #{colors.$workspace-button-background};
|
||||
--red-ui-workspace-button-background-hover: #{colors.$workspace-button-background-hover};
|
||||
--red-ui-workspace-button-background-active: #{colors.$workspace-button-background-active};
|
||||
|
||||
--red-ui-workspace-button-color: #{$workspace-button-color};
|
||||
--red-ui-workspace-button-color-disabled: #{$workspace-button-color-disabled};
|
||||
--red-ui-workspace-button-color-focus: #{$workspace-button-color-focus};
|
||||
--red-ui-workspace-button-color-hover: #{$workspace-button-color-hover};
|
||||
--red-ui-workspace-button-color-active: #{$workspace-button-color-active};
|
||||
--red-ui-workspace-button-color-selected: #{$workspace-button-color-selected};
|
||||
--red-ui-workspace-button-color: #{colors.$workspace-button-color};
|
||||
--red-ui-workspace-button-color-disabled: #{colors.$workspace-button-color-disabled};
|
||||
--red-ui-workspace-button-color-focus: #{colors.$workspace-button-color-focus};
|
||||
--red-ui-workspace-button-color-hover: #{colors.$workspace-button-color-hover};
|
||||
--red-ui-workspace-button-color-active: #{colors.$workspace-button-color-active};
|
||||
--red-ui-workspace-button-color-selected: #{colors.$workspace-button-color-selected};
|
||||
|
||||
--red-ui-workspace-button-color-primary: #{$workspace-button-color-primary};
|
||||
--red-ui-workspace-button-background-primary: #{$workspace-button-background-primary};
|
||||
--red-ui-workspace-button-background-primary-hover: #{$workspace-button-background-primary-hover};
|
||||
--red-ui-workspace-button-color-primary: #{colors.$workspace-button-color-primary};
|
||||
--red-ui-workspace-button-background-primary: #{colors.$workspace-button-background-primary};
|
||||
--red-ui-workspace-button-background-primary-hover: #{colors.$workspace-button-background-primary-hover};
|
||||
|
||||
--red-ui-workspace-button-color-focus-outline: #{$workspace-button-color-focus-outline};
|
||||
--red-ui-workspace-button-color-focus-outline: #{colors.$workspace-button-color-focus-outline};
|
||||
|
||||
--red-ui-shade-color: #{$shade-color};
|
||||
--red-ui-shade-color: #{colors.$shade-color};
|
||||
|
||||
--red-ui-popover-background: #{$popover-background};
|
||||
--red-ui-popover-border: #{$popover-border};
|
||||
--red-ui-popover-color: #{$popover-color};
|
||||
--red-ui-popover-button-border-color: #{$popover-button-border-color};
|
||||
--red-ui-popover-button-border-color-hover: #{$popover-button-border-color-hover};
|
||||
--red-ui-popover-background: #{colors.$popover-background};
|
||||
--red-ui-popover-border: #{colors.$popover-border};
|
||||
--red-ui-popover-color: #{colors.$popover-color};
|
||||
--red-ui-popover-button-border-color: #{colors.$popover-button-border-color};
|
||||
--red-ui-popover-button-border-color-hover: #{colors.$popover-button-border-color-hover};
|
||||
|
||||
|
||||
|
||||
--red-ui-diff-text-header-color: #{$diff-text-header-color};
|
||||
--red-ui-diff-text-header-background: #{$diff-text-header-background};
|
||||
--red-ui-diff-state-color: #{$diff-state-color};
|
||||
--red-ui-diff-state-prefix-color: #{$diff-state-prefix-color};
|
||||
--red-ui-diff-state-added: #{$diff-state-added};
|
||||
--red-ui-diff-state-deleted: #{$diff-state-deleted};
|
||||
--red-ui-diff-state-changed: #{$diff-state-changed};
|
||||
--red-ui-diff-state-changed-background: #{$diff-state-changed-background};
|
||||
--red-ui-diff-state-unchanged: #{$diff-state-unchanged};
|
||||
--red-ui-diff-state-unchanged-background: #{$diff-state-unchanged-background};
|
||||
--red-ui-diff-text-header-color: #{colors.$diff-text-header-color};
|
||||
--red-ui-diff-text-header-background: #{colors.$diff-text-header-background};
|
||||
--red-ui-diff-state-color: #{colors.$diff-state-color};
|
||||
--red-ui-diff-state-prefix-color: #{colors.$diff-state-prefix-color};
|
||||
--red-ui-diff-state-added: #{colors.$diff-state-added};
|
||||
--red-ui-diff-state-deleted: #{colors.$diff-state-deleted};
|
||||
--red-ui-diff-state-changed: #{colors.$diff-state-changed};
|
||||
--red-ui-diff-state-changed-background: #{colors.$diff-state-changed-background};
|
||||
--red-ui-diff-state-unchanged: #{colors.$diff-state-unchanged};
|
||||
--red-ui-diff-state-unchanged-background: #{colors.$diff-state-unchanged-background};
|
||||
|
||||
--red-ui-diff-state-conflicted: #{$diff-state-conflicted};
|
||||
--red-ui-diff-state-moved: #{$diff-state-moved};
|
||||
--red-ui-diff-state-conflict: #{$diff-state-conflict};
|
||||
--red-ui-diff-state-conflict-background: #{$diff-state-conflict-background};
|
||||
--red-ui-diff-state-conflicted: #{colors.$diff-state-conflicted};
|
||||
--red-ui-diff-state-moved: #{colors.$diff-state-moved};
|
||||
--red-ui-diff-state-conflict: #{colors.$diff-state-conflict};
|
||||
--red-ui-diff-state-conflict-background: #{colors.$diff-state-conflict-background};
|
||||
|
||||
--red-ui-diff-state-added-background: #{$diff-state-added-background};
|
||||
--red-ui-diff-state-added-border: #{$diff-state-added-border};
|
||||
--red-ui-diff-state-added-header-background: #{$diff-state-added-header-background};
|
||||
--red-ui-diff-state-added-header-border: #{$diff-state-added-header-border};
|
||||
--red-ui-diff-state-added-background: #{colors.$diff-state-added-background};
|
||||
--red-ui-diff-state-added-border: #{colors.$diff-state-added-border};
|
||||
--red-ui-diff-state-added-header-background: #{colors.$diff-state-added-header-background};
|
||||
--red-ui-diff-state-added-header-border: #{colors.$diff-state-added-header-border};
|
||||
|
||||
--red-ui-diff-state-deleted-background: #{$diff-state-deleted-background};
|
||||
--red-ui-diff-state-deleted-border: #{$diff-state-deleted-border};
|
||||
--red-ui-diff-state-deleted-header-background: #{$diff-state-deleted-header-background};
|
||||
--red-ui-diff-state-deleted-header-border: #{$diff-state-deleted-header-border};
|
||||
--red-ui-diff-state-deleted-background: #{colors.$diff-state-deleted-background};
|
||||
--red-ui-diff-state-deleted-border: #{colors.$diff-state-deleted-border};
|
||||
--red-ui-diff-state-deleted-header-background: #{colors.$diff-state-deleted-header-background};
|
||||
--red-ui-diff-state-deleted-header-border: #{colors.$diff-state-deleted-header-border};
|
||||
|
||||
--red-ui-diff-merge-header-color: #{$diff-merge-header-color};
|
||||
--red-ui-diff-merge-header-background: #{$diff-merge-header-background};
|
||||
--red-ui-diff-merge-header-border-color: #{$diff-merge-header-border-color};
|
||||
--red-ui-diff-merge-header-color: #{colors.$diff-merge-header-color};
|
||||
--red-ui-diff-merge-header-background: #{colors.$diff-merge-header-background};
|
||||
--red-ui-diff-merge-header-border-color: #{colors.$diff-merge-header-border-color};
|
||||
|
||||
--red-ui-menuBackground: #{$menuBackground};
|
||||
--red-ui-menuDivider: #{$menuDivider};
|
||||
--red-ui-menuColor: #{$menuColor};
|
||||
--red-ui-menuActiveColor: #{$menuActiveColor};
|
||||
--red-ui-menuActiveBackground: #{$menuActiveBackground};
|
||||
--red-ui-menuDisabledColor: #{$menuDisabledColor};
|
||||
--red-ui-menuHoverColor: #{$menuHoverColor};
|
||||
--red-ui-menuHoverBackground: #{$menuHoverBackground};
|
||||
--red-ui-menuCaret: #{$menuCaret};
|
||||
--red-ui-menuBackground: #{colors.$menuBackground};
|
||||
--red-ui-menuDivider: #{colors.$menuDivider};
|
||||
--red-ui-menuColor: #{colors.$menuColor};
|
||||
--red-ui-menuActiveColor: #{colors.$menuActiveColor};
|
||||
--red-ui-menuActiveBackground: #{colors.$menuActiveBackground};
|
||||
--red-ui-menuDisabledColor: #{colors.$menuDisabledColor};
|
||||
--red-ui-menuHoverColor: #{colors.$menuHoverColor};
|
||||
--red-ui-menuHoverBackground: #{colors.$menuHoverBackground};
|
||||
--red-ui-menuCaret: #{colors.$menuCaret};
|
||||
|
||||
--red-ui-view-navigator-background: #{$view-navigator-background};
|
||||
--red-ui-view-navigator-background: #{colors.$view-navigator-background};
|
||||
|
||||
--red-ui-view-lasso-stroke: #{$view-lasso-stroke};
|
||||
--red-ui-view-lasso-fill: #{$view-lasso-fill};
|
||||
--red-ui-view-lasso-stroke: #{colors.$view-lasso-stroke};
|
||||
--red-ui-view-lasso-fill: #{colors.$view-lasso-fill};
|
||||
|
||||
--red-ui-view-background: #{$view-background};
|
||||
--red-ui-view-grid-color: #{$view-grid-color};
|
||||
--red-ui-view-background: #{colors.$view-background};
|
||||
--red-ui-view-grid-color: #{colors.$view-grid-color};
|
||||
|
||||
--red-ui-node-label-color: #{$node-label-color};
|
||||
--red-ui-node-port-label-color: #{$node-port-label-color};
|
||||
--red-ui-node-border: #{$node-border};
|
||||
--red-ui-node-border-unknown: #{$node-border-unknown};
|
||||
--red-ui-node-border-placeholder: #{$node-border-placeholder};
|
||||
--red-ui-node-background-placeholder: #{$node-background-placeholder};
|
||||
--red-ui-node-label-color: #{colors.$node-label-color};
|
||||
--red-ui-node-port-label-color: #{colors.$node-port-label-color};
|
||||
--red-ui-node-border: #{colors.$node-border};
|
||||
--red-ui-node-border-unknown: #{colors.$node-border-unknown};
|
||||
--red-ui-node-border-placeholder: #{colors.$node-border-placeholder};
|
||||
--red-ui-node-background-placeholder: #{colors.$node-background-placeholder};
|
||||
|
||||
--red-ui-node-port-background: #{$node-port-background};
|
||||
--red-ui-node-port-background-hover: #{$node-port-background-hover};
|
||||
--red-ui-node-icon-color: #{$node-icon-color};
|
||||
--red-ui-node-icon-background-color: #{$node-icon-background-color};
|
||||
--red-ui-node-icon-background-color-fill: #{$node-icon-background-color-fill};
|
||||
--red-ui-node-icon-background-color-opacity: #{$node-icon-background-color-opacity};
|
||||
--red-ui-node-icon-border-color: #{$node-icon-border-color};
|
||||
--red-ui-node-icon-border-color-opacity: #{$node-icon-border-color-opacity};
|
||||
--red-ui-node-port-background: #{colors.$node-port-background};
|
||||
--red-ui-node-port-background-hover: #{colors.$node-port-background-hover};
|
||||
--red-ui-node-icon-color: #{colors.$node-icon-color};
|
||||
--red-ui-node-icon-background-color: #{colors.$node-icon-background-color};
|
||||
--red-ui-node-icon-background-color-fill: #{colors.$node-icon-background-color-fill};
|
||||
--red-ui-node-icon-background-color-opacity: #{colors.$node-icon-background-color-opacity};
|
||||
--red-ui-node-icon-border-color: #{colors.$node-icon-border-color};
|
||||
--red-ui-node-icon-border-color-opacity: #{colors.$node-icon-border-color-opacity};
|
||||
|
||||
--red-ui-node-config-background: #{$node-config-background};
|
||||
--red-ui-node-config-icon-container-disabled: #{$node-config-icon-container-disabled};
|
||||
--red-ui-node-config-background: #{colors.$node-config-background};
|
||||
--red-ui-node-config-icon-container-disabled: #{colors.$node-config-icon-container-disabled};
|
||||
|
||||
--red-ui-node-link-port-background: #{$node-link-port-background};
|
||||
--red-ui-node-link-port-background: #{colors.$node-link-port-background};
|
||||
|
||||
--red-ui-node-status-error-border: #{$node-status-error-border};
|
||||
--red-ui-node-status-error-background: #{$node-status-error-background};
|
||||
--red-ui-node-status-changed-border: #{$node-status-changed-border};
|
||||
--red-ui-node-status-changed-background: #{$node-status-changed-background};
|
||||
--red-ui-node-status-error-border: #{colors.$node-status-error-border};
|
||||
--red-ui-node-status-error-background: #{colors.$node-status-error-background};
|
||||
--red-ui-node-status-changed-border: #{colors.$node-status-changed-border};
|
||||
--red-ui-node-status-changed-background: #{colors.$node-status-changed-background};
|
||||
|
||||
@each $current-color in red green yellow blue grey gray {
|
||||
--red-ui-node-status-colors-#{"" + $current-color}: #{map-get($node-status-colors, $current-color)};
|
||||
--red-ui-node-status-colors-#{"" + $current-color}: #{map.get(colors.$node-status-colors, $current-color)};
|
||||
}
|
||||
|
||||
|
||||
--red-ui-node-selected-color: #{$node-selected-color};
|
||||
--red-ui-port-selected-color: #{$port-selected-color};
|
||||
--red-ui-node-selected-color: #{colors.$node-selected-color};
|
||||
--red-ui-port-selected-color: #{colors.$port-selected-color};
|
||||
|
||||
--red-ui-link-color: #{$link-color};
|
||||
--red-ui-link-link-color: #{$link-link-color};
|
||||
--red-ui-link-disabled-color: #{$link-disabled-color};
|
||||
--red-ui-link-link-active-color: #{$link-link-active-color};
|
||||
--red-ui-link-unknown-color: #{$link-unknown-color};
|
||||
--red-ui-link-color: #{colors.$link-color};
|
||||
--red-ui-link-link-color: #{colors.$link-link-color};
|
||||
--red-ui-link-disabled-color: #{colors.$link-disabled-color};
|
||||
--red-ui-link-link-active-color: #{colors.$link-link-active-color};
|
||||
--red-ui-link-unknown-color: #{colors.$link-unknown-color};
|
||||
|
||||
--red-ui-clipboard-textarea-background: #{$clipboard-textarea-background};
|
||||
--red-ui-clipboard-textarea-background: #{colors.$clipboard-textarea-background};
|
||||
|
||||
|
||||
--red-ui-deploy-button-color: #{$deploy-button-color};
|
||||
--red-ui-deploy-button-color-active: #{$deploy-button-color-active};
|
||||
--red-ui-deploy-button-color-disabled: #{$deploy-button-color-disabled};
|
||||
--red-ui-deploy-button-background: #{$deploy-button-background};
|
||||
--red-ui-deploy-button-background-hover: #{$deploy-button-background-hover};
|
||||
--red-ui-deploy-button-background-active: #{$deploy-button-background-active};
|
||||
--red-ui-deploy-button-background-disabled: #{$deploy-button-background-disabled};
|
||||
--red-ui-deploy-button-background-disabled-hover: #{$deploy-button-background-disabled-hover};
|
||||
--red-ui-deploy-button-color: #{colors.$deploy-button-color};
|
||||
--red-ui-deploy-button-color-active: #{colors.$deploy-button-color-active};
|
||||
--red-ui-deploy-button-color-disabled: #{colors.$deploy-button-color-disabled};
|
||||
--red-ui-deploy-button-background: #{colors.$deploy-button-background};
|
||||
--red-ui-deploy-button-background-hover: #{colors.$deploy-button-background-hover};
|
||||
--red-ui-deploy-button-background-active: #{colors.$deploy-button-background-active};
|
||||
--red-ui-deploy-button-background-disabled: #{colors.$deploy-button-background-disabled};
|
||||
--red-ui-deploy-button-background-disabled-hover: #{colors.$deploy-button-background-disabled-hover};
|
||||
|
||||
|
||||
--red-ui-header-background: #{$header-background};
|
||||
--red-ui-header-accent: #{$header-accent};
|
||||
--red-ui-header-button-background-active: #{$header-button-background-active};
|
||||
--red-ui-header-menu-color: #{$header-menu-color};
|
||||
--red-ui-header-menu-color-disabled: #{$header-menu-color-disabled};
|
||||
--red-ui-header-menu-heading-color: #{$header-menu-heading-color};
|
||||
--red-ui-header-menu-sublabel-color: #{$header-menu-sublabel-color};
|
||||
--red-ui-header-menu-background: #{$header-menu-background};
|
||||
--red-ui-header-menu-item-hover: #{$header-menu-item-hover};
|
||||
--red-ui-header-menu-item-border-active: #{$header-menu-item-border-active};
|
||||
--red-ui-headerMenuItemDivider: #{$headerMenuItemDivider};
|
||||
--red-ui-headerMenuCaret: #{$headerMenuCaret};
|
||||
--red-ui-header-background: #{colors.$header-background};
|
||||
--red-ui-header-accent: #{colors.$header-accent};
|
||||
--red-ui-header-button-background-active: #{colors.$header-button-background-active};
|
||||
--red-ui-header-menu-color: #{colors.$header-menu-color};
|
||||
--red-ui-header-menu-color-disabled: #{colors.$header-menu-color-disabled};
|
||||
--red-ui-header-menu-heading-color: #{colors.$header-menu-heading-color};
|
||||
--red-ui-header-menu-sublabel-color: #{colors.$header-menu-sublabel-color};
|
||||
--red-ui-header-menu-background: #{colors.$header-menu-background};
|
||||
--red-ui-header-menu-item-hover: #{colors.$header-menu-item-hover};
|
||||
--red-ui-header-menu-item-border-active: #{colors.$header-menu-item-border-active};
|
||||
--red-ui-headerMenuItemDivider: #{colors.$headerMenuItemDivider};
|
||||
--red-ui-headerMenuCaret: #{colors.$headerMenuCaret};
|
||||
|
||||
--red-ui-vcCommitShaColor: #{$vcCommitShaColor};
|
||||
--red-ui-vcCommitShaColor: #{colors.$vcCommitShaColor};
|
||||
|
||||
--red-ui-dnd-background: #{$dnd-background};
|
||||
--red-ui-dnd-color: #{$dnd-color};
|
||||
--red-ui-dnd-background: #{colors.$dnd-background};
|
||||
--red-ui-dnd-color: #{colors.$dnd-color};
|
||||
|
||||
--red-ui-notification-border-default: #{$notification-border-default};
|
||||
--red-ui-notification-border-success: #{$notification-border-success};
|
||||
--red-ui-notification-border-warning: #{$notification-border-warning};
|
||||
--red-ui-notification-border-error: #{$notification-border-error};
|
||||
--red-ui-notification-border-default: #{colors.$notification-border-default};
|
||||
--red-ui-notification-border-success: #{colors.$notification-border-success};
|
||||
--red-ui-notification-border-warning: #{colors.$notification-border-warning};
|
||||
--red-ui-notification-border-error: #{colors.$notification-border-error};
|
||||
|
||||
--red-ui-debug-message-background: #{$debug-message-background};
|
||||
--red-ui-debug-message-background-hover: #{$debug-message-background-hover};
|
||||
--red-ui-debug-message-background: #{colors.$debug-message-background};
|
||||
--red-ui-debug-message-background-hover: #{colors.$debug-message-background-hover};
|
||||
|
||||
--red-ui-debug-message-text-color: #{$debug-message-text-color};
|
||||
--red-ui-debug-message-text-color-meta: #{$debug-message-text-color-meta};
|
||||
--red-ui-debug-message-text-color-object-key: #{$debug-message-text-color-object-key};
|
||||
--red-ui-debug-message-text-color-msg-type-other: #{$debug-message-text-color-msg-type-other};
|
||||
--red-ui-debug-message-text-color-msg-type-string: #{$debug-message-text-color-msg-type-string};
|
||||
--red-ui-debug-message-text-color-msg-type-null: #{$debug-message-text-color-msg-type-null};
|
||||
--red-ui-debug-message-text-color-msg-type-meta: #{$debug-message-text-color-msg-type-meta};
|
||||
--red-ui-debug-message-text-color-msg-type-number: #{$debug-message-text-color-msg-type-number};
|
||||
--red-ui-debug-message-text-color: #{colors.$debug-message-text-color};
|
||||
--red-ui-debug-message-text-color-meta: #{colors.$debug-message-text-color-meta};
|
||||
--red-ui-debug-message-text-color-object-key: #{colors.$debug-message-text-color-object-key};
|
||||
--red-ui-debug-message-text-color-msg-type-other: #{colors.$debug-message-text-color-msg-type-other};
|
||||
--red-ui-debug-message-text-color-msg-type-string: #{colors.$debug-message-text-color-msg-type-string};
|
||||
--red-ui-debug-message-text-color-msg-type-null: #{colors.$debug-message-text-color-msg-type-null};
|
||||
--red-ui-debug-message-text-color-msg-type-meta: #{colors.$debug-message-text-color-msg-type-meta};
|
||||
--red-ui-debug-message-text-color-msg-type-number: #{colors.$debug-message-text-color-msg-type-number};
|
||||
|
||||
--red-ui-debug-message-border: #{$debug-message-border};
|
||||
--red-ui-debug-message-border-hover: #{$debug-message-border-hover};
|
||||
--red-ui-debug-message-border-warning: #{$debug-message-border-warning};
|
||||
--red-ui-debug-message-border-error: #{$debug-message-border-error};
|
||||
--red-ui-debug-message-border: #{colors.$debug-message-border};
|
||||
--red-ui-debug-message-border-hover: #{colors.$debug-message-border-hover};
|
||||
--red-ui-debug-message-border-warning: #{colors.$debug-message-border-warning};
|
||||
--red-ui-debug-message-border-error: #{colors.$debug-message-border-error};
|
||||
|
||||
--red-ui-group-default-fill: #{$group-default-fill};
|
||||
--red-ui-group-default-fill-opacity: #{$group-default-fill-opacity};
|
||||
--red-ui-group-default-stroke: #{$group-default-stroke};
|
||||
--red-ui-group-default-stroke-opacity: #{$group-default-stroke-opacity};
|
||||
--red-ui-group-default-label-color: #{$group-default-label-color};
|
||||
--red-ui-group-default-fill: #{colors.$group-default-fill};
|
||||
--red-ui-group-default-fill-opacity: #{colors.$group-default-fill-opacity};
|
||||
--red-ui-group-default-stroke: #{colors.$group-default-stroke};
|
||||
--red-ui-group-default-stroke-opacity: #{colors.$group-default-stroke-opacity};
|
||||
--red-ui-group-default-label-color: #{colors.$group-default-label-color};
|
||||
|
||||
--red-ui-tourGuide-border: #{$tourGuide-border};
|
||||
--red-ui-tourGuide-heading-color: #{$tourGuide-heading-color};
|
||||
--red-ui-tourGuide-border: #{colors.$tourGuide-border};
|
||||
--red-ui-tourGuide-heading-color: #{colors.$tourGuide-heading-color};
|
||||
|
||||
--red-ui-grip-color: #{$grip-color};
|
||||
--red-ui-grip-color: #{colors.$grip-color};
|
||||
|
||||
--red-ui-icons-flow-color: #{$icons-flow-color};
|
||||
--red-ui-icons-flow-color: #{colors.$icons-flow-color};
|
||||
|
||||
--red-ui-spinner-color: #{$spinner-color};
|
||||
--red-ui-spinner-color: #{colors.$spinner-color};
|
||||
|
||||
--red-ui-tab-icon-color: #{$tab-icon-color};
|
||||
--red-ui-tab-icon-color: #{colors.$tab-icon-color};
|
||||
|
||||
@each $current-color in 1 2 3 4 5 {
|
||||
--red-ui-user-profile-colors-#{"" + $current-color}: #{map-get($user-profile-colors, $current-color)};
|
||||
--red-ui-user-profile-colors-#{"" + $current-color}: #{map.get(colors.$user-profile-colors, $current-color)};
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
@use "mixins";
|
||||
|
||||
/**
|
||||
* Copyright JS Foundation and other contributors, http://js.foundation
|
||||
*
|
||||
|
|
@ -22,7 +24,7 @@
|
|||
bottom: 0px;
|
||||
right: 322px;
|
||||
overflow: hidden;
|
||||
@include component-border;
|
||||
@include mixins.component-border;
|
||||
transition: left 0.1s ease-in-out;
|
||||
}
|
||||
|
||||
|
|
@ -40,7 +42,7 @@
|
|||
}
|
||||
}
|
||||
#red-ui-workspace-tabs-shade {
|
||||
@include shade;
|
||||
@include mixins.shade;
|
||||
z-index: 2;
|
||||
bottom: auto;
|
||||
height: 35px;
|
||||
|
|
@ -157,7 +159,7 @@
|
|||
}
|
||||
|
||||
.red-ui-component-footer {
|
||||
@include component-footer;
|
||||
@include mixins.component-footer;
|
||||
|
||||
> .button-group {
|
||||
display: inline-block;
|
||||
|
|
@ -176,12 +178,12 @@
|
|||
|
||||
a.red-ui-footer-button,
|
||||
button.red-ui-footer-button {
|
||||
@include component-footer-button;
|
||||
@include mixins.component-footer-button;
|
||||
}
|
||||
|
||||
a.red-ui-footer-button-toggle,
|
||||
button.red-ui-footer-button-toggle {
|
||||
@include component-footer-button-toggle;
|
||||
@include mixins.component-footer-button-toggle;
|
||||
}
|
||||
|
||||
.red-ui-statusbar-widget {
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
@use "mixins";
|
||||
|
||||
/**
|
||||
* Copyright JS Foundation and other contributors, http://js.foundation
|
||||
*
|
||||
|
|
@ -32,7 +34,7 @@
|
|||
white-space: nowrap;
|
||||
transition: right 0.2s ease;
|
||||
overflow: hidden;
|
||||
@include disable-selection;
|
||||
@include mixins.disable-selection;
|
||||
|
||||
label {
|
||||
padding: 1px 8px;
|
||||
|
|
@ -44,12 +46,12 @@
|
|||
padding: 0;
|
||||
}
|
||||
.button {
|
||||
@include workspace-button;
|
||||
@include mixins.workspace-button;
|
||||
margin-right: 10px;
|
||||
padding: 2px 8px;
|
||||
}
|
||||
.button-group {
|
||||
@include disable-selection;
|
||||
@include mixins.disable-selection;
|
||||
|
||||
.button:first-child {
|
||||
margin-right: 0;
|
||||
|
|
|
|||
Loading…
Reference in New Issue