mirror of https://github.com/node-red/node-red.git
319 lines
10 KiB
SCSS
319 lines
10 KiB
SCSS
/**
|
|
* Copyright JS Foundation and other contributors, http://js.foundation
|
|
*
|
|
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
* you may not use this file except in compliance with the License.
|
|
* You may obtain a copy of the License at
|
|
*
|
|
* http://www.apache.org/licenses/LICENSE-2.0
|
|
*
|
|
* Unless required by applicable law or agreed to in writing, software
|
|
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
* See the License for the specific language governing permissions and
|
|
* limitations under the License.
|
|
**/
|
|
|
|
$primary-font: 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
$primary-font-size: 14px;
|
|
$monospace-font: Menlo, Consolas, 'DejaVu Sans Mono', Courier, monospace;
|
|
|
|
$primary-background: #f3f3f3;//#0ff;
|
|
|
|
$secondary-background: #fff;//#ff0;
|
|
$secondary-background-selected: #efefef;//#e9e900;
|
|
$secondary-background-inactive: #f0f0f0;//#f0f000;
|
|
$secondary-background-hover: #e6e6e6;//#dd0;
|
|
$secondary-background-disabled: #f9f9f9;//#fafa0;
|
|
|
|
$tertiary-background: #f7f7f7;//#f0f;
|
|
|
|
$shadow: rgba(0, 0, 0, 0.2);
|
|
|
|
// Main body text
|
|
$primary-text-color: #555;//#0f0;
|
|
// UI control label text
|
|
$secondary-text-color: #888;//#00f;
|
|
$secondary-text-color-focus: #666;//#009;
|
|
$secondary-text-color-hover: #666;//#006;
|
|
$secondary-text-color-active: #666;//#006;
|
|
$secondary-text-color-selected: #666;//#00A;
|
|
$secondary-text-color-inactive: #666;//#006;
|
|
$secondary-text-color-disabled: #bbb;//#00C;
|
|
$secondary-text-color-disabled-active: #999;//#009;
|
|
$secondary-text-color-disabled-inactive: #aaa;//#00A;
|
|
|
|
// Sub label text
|
|
$tertiary-text-color: #aaa;//#90f;
|
|
// Heading text
|
|
$header-text-color: #444;//#f00;
|
|
|
|
$text-color-error: #AD1625;
|
|
$text-color-warning: #CAB200;
|
|
$text-color-success: #3a3;
|
|
$text-color-code: #AD1625;
|
|
$text-color-link: #0088cc;
|
|
|
|
|
|
$primary-border-color: #bbbbbb;//#f00;
|
|
$secondary-border-color: #dddddd;//#0f0;
|
|
$tertiary-border-color: #ccc;//#00f;
|
|
|
|
$border-color-error: #DF2935;
|
|
$border-color-warning: #FFCF70;
|
|
$border-color-success: #4B8400;
|
|
|
|
$form-background: $secondary-background;
|
|
$form-placeholder-color: $tertiary-text-color;
|
|
$form-text-color: $primary-text-color;
|
|
$form-text-color-disabled: $secondary-text-color-disabled;
|
|
$form-input-focus-color: rgba(85,150,230,0.8);
|
|
$form-input-border-color: $tertiary-border-color;
|
|
$form-input-border-selected-color: #aaa;//#f0f;
|
|
$form-input-border-error-color: rgb(214, 97, 95);
|
|
$form-input-background: $secondary-background;
|
|
$form-input-background-disabled: $secondary-background-disabled;
|
|
$form-button-background: $secondary-background-selected;
|
|
|
|
$form-tips-background: #ffe;
|
|
|
|
|
|
$text-editor-color: #4D4D4C;//#00f;
|
|
$text-editor-background: $secondary-background;
|
|
$text-editor-color-disabled: $secondary-text-color-inactive;
|
|
$text-editor-background-disabled: $secondary-background-disabled;
|
|
$text-editor-gutter-background: #f6f6f6;//#ee0;
|
|
$text-editor-gutter-color: #777;//#00e;
|
|
$text-editor-gutter-active-line-background: #dcdcdc;//#dd0;
|
|
$text-editor-active-line-background: #efefef;//#ee0;
|
|
$text-editor-selection-background: #D6D6D6;//#e0e;
|
|
|
|
$event-log-background: #444;
|
|
$event-log-color: #dd9;
|
|
$event-log-active-line-background: #333;
|
|
$event-log-selection-background: #999;
|
|
|
|
|
|
|
|
|
|
$list-item-color: $primary-text-color;
|
|
$list-item-secondary-color: $secondary-text-color;
|
|
$list-item-background: $secondary-background;
|
|
$list-item-background-disabled: $secondary-background-inactive;
|
|
$list-item-background-hover: $secondary-background-hover;
|
|
$list-item-background-selected: #ffebc7; // #fff1e5;
|
|
$list-item-border-selected: $secondary-text-color-selected;
|
|
|
|
$tab-text-color-active: $header-text-color;
|
|
$tab-text-color-inactive: $secondary-text-color-inactive;
|
|
$tab-text-color-disabled-active: $secondary-text-color-disabled-active;
|
|
$tab-text-color-disabled-inactive: $secondary-text-color-disabled-inactive;
|
|
|
|
$tab-badge-color: $tertiary-text-color;
|
|
$tab-background: $secondary-background;
|
|
$tab-background-active: $secondary-background;
|
|
$tab-background-active-alpha: rgba($secondary-background, 0.001);
|
|
$tab-background-selected: $secondary-background-selected;
|
|
$tab-background-selected-alpha: rgba($secondary-background-selected, 0.001);
|
|
$tab-background-inactive: $secondary-background-inactive;
|
|
$tab-background-inactive-alpha: rgba($secondary-background-inactive, 0.001);
|
|
$tab-background-hover: $secondary-background-hover;
|
|
$tab-background-hover-alpha: rgba($secondary-background-hover, 0.001);
|
|
|
|
$palette-header-background: $primary-background;
|
|
$palette-header-color: $header-text-color;
|
|
$palette-content-background: $secondary-background;
|
|
|
|
|
|
$workspace-button-background: $secondary-background;
|
|
$workspace-button-background-hover: $secondary-background-hover;
|
|
$workspace-button-background-active: $secondary-background-selected;
|
|
|
|
$workspace-button-color: $secondary-text-color;
|
|
$workspace-button-color-disabled: $secondary-text-color-disabled;
|
|
$workspace-button-color-focus: $secondary-text-color-focus;
|
|
$workspace-button-color-hover: $secondary-text-color-hover;
|
|
$workspace-button-color-active: $secondary-text-color-active;
|
|
$workspace-button-color-selected: $secondary-text-color-selected;
|
|
|
|
$workspace-button-color-primary: #eee;
|
|
$workspace-button-background-primary: #AD1625;
|
|
$workspace-button-background-primary-hover: #6E0A1E;
|
|
|
|
$workspace-button-color-focus-outline: $form-input-focus-color;
|
|
|
|
$shade-color: rgba(160,160,160,0.5);
|
|
|
|
$popover-background: #333;
|
|
$popover-border: $popover-background;
|
|
$popover-color: #eee;
|
|
$popover-button-border-color: #bbb;
|
|
$popover-button-border-color-hover: #666;
|
|
|
|
|
|
|
|
$diff-text-header-color: $secondary-text-color;
|
|
$diff-text-header-background: #ffd;
|
|
$diff-state-color: $primary-text-color;
|
|
$diff-state-prefix-color: $secondary-text-color;
|
|
$diff-state-added: #009900;
|
|
$diff-state-deleted: #f80000;
|
|
$diff-state-changed: #f89406;
|
|
$diff-state-changed-background: #fff2e1;
|
|
$diff-state-unchanged: #bbb;
|
|
$diff-state-unchanged-background: #fff;
|
|
|
|
$diff-state-conflicted: purple;
|
|
$diff-state-moved: #3f81b3;
|
|
$diff-state-conflict: #9b45ce;
|
|
$diff-state-conflict-background: #ffdad4;
|
|
|
|
$diff-state-added-background: #e7ffe3;
|
|
$diff-state-added-border: #b8daad;
|
|
$diff-state-added-header-background: #c0f6c0;
|
|
$diff-state-added-header-border: #aaeeaa;
|
|
|
|
$diff-state-deleted-background: #ffe1e1;
|
|
$diff-state-deleted-border: #e4bcbc;
|
|
$diff-state-deleted-header-background: #ffcccc;
|
|
$diff-state-deleted-header-border: #eebbbb;
|
|
|
|
$diff-merge-header-color: #800080;
|
|
$diff-merge-header-background: #e5f9ff;
|
|
$diff-merge-header-border-color: #b2edff;
|
|
|
|
$menuBackground: $primary-background;
|
|
$menuDivider: $secondary-border-color;
|
|
$menuColor: $primary-text-color;
|
|
$menuActiveColor: $secondary-text-color-active;
|
|
$menuActiveBackground: $secondary-background-hover;
|
|
$menuDisabledColor: $secondary-text-color-disabled;
|
|
$menuHoverColor: $secondary-text-color-hover;
|
|
$menuHoverBackground: $secondary-background-hover;
|
|
$menuCaret: $tertiary-text-color;
|
|
|
|
$view-navigator-background: rgba(245,245,245,0.8);
|
|
|
|
$view-lasso-stroke: #ff7f0e;
|
|
$view-lasso-fill: rgba(20,125,255,0.1);
|
|
|
|
$view-background: $secondary-background;
|
|
$view-grid-color: #eee;
|
|
|
|
$node-label-color: #333;
|
|
$node-port-label-color: #888;
|
|
$node-border: #999;
|
|
$node-border-unknown: #f33;
|
|
$node-border-placeholder: #aaa;
|
|
$node-background-placeholder: #eee;
|
|
|
|
$node-port-background: #d9d9d9;
|
|
$node-port-background-hover: #eee;
|
|
$node-icon-color: #fff;
|
|
$node-icon-background-color: rgba(0,0,0,0.05);
|
|
$node-icon-background-color-fill: #000;
|
|
$node-icon-background-color-opacity: 0.05;
|
|
$node-icon-border-color: #000;
|
|
$node-icon-border-color-opacity: 0.1;
|
|
|
|
$node-config-background: #f3f3f3;
|
|
|
|
$node-link-port-background: #eee;
|
|
|
|
$node-status-error-border: rgb(145, 16, 2);
|
|
$node-status-error-background: rgb(255, 102, 0);
|
|
$node-status-changed-border: rgb(28, 102, 140);
|
|
$node-status-changed-background: rgb(0, 188, 255);
|
|
|
|
$node-status-colors: (
|
|
red: #c00,
|
|
green: #5a8,
|
|
yellow: #F9DF31,
|
|
blue: #53A3F3,
|
|
grey: #d3d3d3
|
|
);
|
|
|
|
|
|
$node-selected-color: #ff7f0e;
|
|
$port-selected-color: #ff7f0e;
|
|
|
|
$link-color: #999;
|
|
$link-link-color: #aaa;
|
|
$link-disabled-color: #ccc;
|
|
$link-link-active-color: #ff7f0e;
|
|
$link-unknown-color: #f00;
|
|
|
|
$clipboard-textarea-background: #F3E7E7;
|
|
|
|
|
|
$deploy-button-color: #eee;
|
|
$deploy-button-color-active: #ccc;
|
|
$deploy-button-color-disabled: #999;
|
|
$deploy-button-background: #8C101C;
|
|
$deploy-button-background-hover: #6E0A1E;
|
|
$deploy-button-background-active: #4C0A17;
|
|
$deploy-button-background-disabled: #444;
|
|
$deploy-button-background-disabled-hover: #555;
|
|
|
|
|
|
$header-background: #000;
|
|
$header-button-background-active: #121212;
|
|
$header-menu-color: #C7C7C7;
|
|
$header-menu-color-disabled: #666;
|
|
$header-menu-heading-color: #fff;
|
|
$header-menu-sublabel-color: #aeaeae;
|
|
$header-menu-background: #121212;
|
|
$header-menu-item-hover: #323232;
|
|
$header-menu-item-border-active: #777677;
|
|
$headerMenuItemDivider: #464646;
|
|
$headerMenuCaret: #C7C7C7;
|
|
|
|
$vcCommitShaColor: #c38888;
|
|
|
|
$dnd-background: rgba(0,0,0,0.3);
|
|
$dnd-color: #fff;
|
|
|
|
$notification-border-default: #325C80;
|
|
$notification-border-success: $border-color-success;
|
|
$notification-border-warning: $border-color-warning;
|
|
$notification-border-error: $border-color-error;
|
|
|
|
$debug-message-background: $secondary-background;
|
|
$debug-message-background-hover: $secondary-background-selected;
|
|
|
|
$debug-message-text-color: #333;
|
|
$debug-message-text-color-meta: #a66;
|
|
$debug-message-text-color-object-key: #792e90;
|
|
$debug-message-text-color-msg-type-other: #2033d6;
|
|
$debug-message-text-color-msg-type-string: #b72828;
|
|
$debug-message-text-color-msg-type-null: #666;
|
|
$debug-message-text-color-msg-type-meta: #666;
|
|
$debug-message-text-color-msg-type-number: #2033d6;
|
|
|
|
$debug-message-border: #eee;
|
|
$debug-message-border-hover: #999;
|
|
$debug-message-border-warning: $border-color-warning;
|
|
$debug-message-border-error: $border-color-error;
|
|
|
|
$group-default-fill: none;
|
|
$group-default-fill-opacity: 1;
|
|
$group-default-stroke: #999;
|
|
$group-default-stroke-opacity: 1;
|
|
$group-default-label-color: #a4a4a4;
|
|
|
|
$tourGuide-border: #c56c6c;
|
|
$tourGuide-heading-color: #c56c6c;
|
|
|
|
$grip-color: #ccc;
|
|
|
|
$icons-flow-color: #808080;
|
|
|
|
$spinner-color: #999;
|
|
|
|
$tab-icon-color: #dedede;
|
|
|
|
// Deprecated
|
|
$text-color-green: $text-color-success;
|
|
$info-text-code-color: $text-color-code;
|
|
$info-text-link-color: $text-color-link;
|