:root { --red-ui-primary-font: #{$primary-font}; --red-ui-primary-font-size: #{$primary-font-size}; --red-ui-monospace-font: #{$monospace-font}; --red-ui-primary-background: #{$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-tertiary-background: #{$tertiary-background}; --red-ui-shadow: #{$shadow}; // Main body text --red-ui-primary-text-color: #{$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}; // Sub label text --red-ui-tertiary-text-color: #{$tertiary-text-color}; // Heading text --red-ui-header-text-color: #{$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-primary-border-color: #{$primary-border-color}; --red-ui-secondary-border-color: #{$secondary-border-color}; --red-ui-tertiary-border-color: #{$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-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-tips-background: #{$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-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-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-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-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-palette-header-background: #{$palette-header-background}; --red-ui-palette-header-color: #{$palette-header-color}; --red-ui-palette-content-background: #{$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-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-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-focus-outline: #{$workspace-button-color-focus-outline}; --red-ui-shade-color: #{$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-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-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-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-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-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-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-view-navigator-background: #{$view-navigator-background}; --red-ui-view-lasso-stroke: #{$view-lasso-stroke}; --red-ui-view-lasso-fill: #{$view-lasso-fill}; --red-ui-view-background: #{$view-background}; --red-ui-view-grid-color: #{$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-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-config-background: #{$node-config-background}; --red-ui-node-config-icon-container-disabled: #{$node-config-icon-container-disabled}; --red-ui-node-link-port-background: #{$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}; @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-selected-color: #{$node-selected-color}; --red-ui-port-selected-color: #{$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-clipboard-textarea-background: #{$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-header-background: #{$header-background}; --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-vcCommitShaColor: #{$vcCommitShaColor}; --red-ui-dnd-background: #{$dnd-background}; --red-ui-dnd-color: #{$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-debug-message-background: #{$debug-message-background}; --red-ui-debug-message-background-hover: #{$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-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-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-tourGuide-border: #{$tourGuide-border}; --red-ui-tourGuide-heading-color: #{$tourGuide-heading-color}; --red-ui-grip-color: #{$grip-color}; --red-ui-icons-flow-color: #{$icons-flow-color}; --red-ui-spinner-color: #{$spinner-color}; --red-ui-tab-icon-color: #{$tab-icon-color}; }