mirror of
https://github.com/node-red/node-red.git
synced 2025-03-01 10:36:34 +00:00
Merge branch 'master' of https://github.com/ralphwetzel/node-red
This commit is contained in:
4
packages/node_modules/@node-red/editor-client/src/images/start.svg
vendored
Normal file
4
packages/node_modules/@node-red/editor-client/src/images/start.svg
vendored
Normal file
@@ -0,0 +1,4 @@
|
||||
<svg width="32" height="32" xmlns="http://www.w3.org/2000/svg">
|
||||
<path color="#000" fill="#8c101c" d="M0 0h32v32H0z"></path>
|
||||
<path style="fill:#ffffff;stroke:#000000;stroke-width:0" d="M 24,16 8,24 8,8 Z" fill="none" stroke="#000" stroke-width="1.5"></path>
|
||||
</svg>
|
After Width: | Height: | Size: 271 B |
4
packages/node_modules/@node-red/editor-client/src/images/stop.svg
vendored
Normal file
4
packages/node_modules/@node-red/editor-client/src/images/stop.svg
vendored
Normal file
@@ -0,0 +1,4 @@
|
||||
<svg width="32" height="32" xmlns="http://www.w3.org/2000/svg">
|
||||
<path color="#000" fill="#8c101c" d="M0 0h32v32H0z"></path>
|
||||
<rect style="fill:#ffffff;fill-opacity:1;stroke:#000000;stroke-width:0;" width="15" height="15" x="8" y="8.5"></rect>
|
||||
</svg>
|
After Width: | Height: | Size: 256 B |
@@ -14,7 +14,7 @@
|
||||
* limitations under the License.
|
||||
**/
|
||||
|
||||
/**
|
||||
/**
|
||||
* An Interface to nodes and utility functions for creating/adding/deleting nodes and links
|
||||
* @namespace RED.nodes
|
||||
*/
|
||||
@@ -1654,21 +1654,19 @@ RED.nodes = (function() {
|
||||
* Options:
|
||||
* - generateIds - whether to replace all node ids
|
||||
* - addFlow - whether to import nodes to a new tab
|
||||
* - importToCurrent
|
||||
* - reimport - if node has a .z property, dont overwrite it
|
||||
* Only applicible when `generateIds` is false
|
||||
* - importMap - how to resolve any conflicts.
|
||||
* - id:import - import as-is
|
||||
* - id:copy - import with new id
|
||||
* - id:replace - import over the top of existing
|
||||
*/
|
||||
function importNodes(newNodesObj,options) { // createNewIds,createMissingWorkspace) {
|
||||
options = options || {
|
||||
generateIds: false,
|
||||
addFlow: false,
|
||||
}
|
||||
options.importMap = options.importMap || {};
|
||||
|
||||
var createNewIds = options.generateIds;
|
||||
var createMissingWorkspace = options.addFlow;
|
||||
const defOpts = { generateIds: false, addFlow: false, reimport: false, importMap: {} }
|
||||
options = Object.assign({}, defOpts, options)
|
||||
const createNewIds = options.generateIds;
|
||||
const reimport = (!createNewIds && !!options.reimport)
|
||||
const createMissingWorkspace = options.addFlow;
|
||||
var i;
|
||||
var n;
|
||||
var newNodes;
|
||||
@@ -1969,7 +1967,8 @@ RED.nodes = (function() {
|
||||
}
|
||||
}
|
||||
} else {
|
||||
if (n.z && !workspace_map[n.z] && !subflow_map[n.z]) {
|
||||
const keepNodesCurrentZ = reimport && n.z && RED.workspaces.contains(n.z)
|
||||
if (!keepNodesCurrentZ && n.z && !workspace_map[n.z] && !subflow_map[n.z]) {
|
||||
n.z = activeWorkspace;
|
||||
}
|
||||
}
|
||||
@@ -2070,7 +2069,8 @@ RED.nodes = (function() {
|
||||
node.id = getID();
|
||||
} else {
|
||||
node.id = n.id;
|
||||
if (node.z == null || (!workspace_map[node.z] && !subflow_map[node.z])) {
|
||||
const keepNodesCurrentZ = reimport && node.z && RED.workspaces.contains(node.z)
|
||||
if (!keepNodesCurrentZ && (node.z == null || (!workspace_map[node.z] && !subflow_map[node.z]))) {
|
||||
if (createMissingWorkspace) {
|
||||
if (missingWorkspace === null) {
|
||||
missingWorkspace = RED.workspaces.add(null,true);
|
||||
@@ -2769,7 +2769,7 @@ RED.nodes = (function() {
|
||||
// Force the redraw to be synchronous so the view updates
|
||||
// *now* and removes the unknown node
|
||||
RED.view.redraw(true, true);
|
||||
var result = importNodes(reimportList,{generateIds:false});
|
||||
var result = importNodes(reimportList,{generateIds:false, reimport: true});
|
||||
var newNodeMap = {};
|
||||
result.nodes.forEach(function(n) {
|
||||
newNodeMap[n.id] = n;
|
||||
|
@@ -297,6 +297,10 @@ var RED = (function() {
|
||||
// handled below
|
||||
return;
|
||||
}
|
||||
if (notificationId === "flows-run-state") {
|
||||
// handled in editor-client/src/js/runtime.js
|
||||
return;
|
||||
}
|
||||
if (notificationId === "project-update") {
|
||||
loader.start(RED._("event.loadingProject"), 0);
|
||||
RED.nodes.clear();
|
||||
@@ -332,7 +336,6 @@ var RED = (function() {
|
||||
id: notificationId
|
||||
}
|
||||
if (notificationId === "runtime-state") {
|
||||
RED.events.emit("runtime-state",msg);
|
||||
if (msg.error === "safe-mode") {
|
||||
options.buttons = [
|
||||
{
|
||||
@@ -473,9 +476,9 @@ var RED = (function() {
|
||||
} else if (persistentNotifications.hasOwnProperty(notificationId)) {
|
||||
persistentNotifications[notificationId].close();
|
||||
delete persistentNotifications[notificationId];
|
||||
if (notificationId === 'runtime-state') {
|
||||
RED.events.emit("runtime-state",msg);
|
||||
}
|
||||
}
|
||||
if (notificationId === 'runtime-state') {
|
||||
RED.events.emit("runtime-state",msg);
|
||||
}
|
||||
});
|
||||
RED.comms.subscribe("status/#",function(topic,msg) {
|
||||
@@ -747,6 +750,7 @@ var RED = (function() {
|
||||
RED.keyboard.init(buildMainMenu);
|
||||
|
||||
RED.nodes.init();
|
||||
RED.runtime.init()
|
||||
RED.comms.connect();
|
||||
|
||||
$("#red-ui-main-container").show();
|
||||
|
36
packages/node_modules/@node-red/editor-client/src/js/runtime.js
vendored
Normal file
36
packages/node_modules/@node-red/editor-client/src/js/runtime.js
vendored
Normal file
@@ -0,0 +1,36 @@
|
||||
RED.runtime = (function() {
|
||||
let state = ""
|
||||
let settings = { ui: false, enabled: false };
|
||||
const STOPPED = "stop"
|
||||
const STARTED = "start"
|
||||
const SAFE = "safe"
|
||||
|
||||
return {
|
||||
init: function() {
|
||||
// refresh the current runtime status from server
|
||||
settings = Object.assign({}, settings, RED.settings.runtimeState);
|
||||
RED.events.on("runtime-state", function(msg) {
|
||||
if (msg.state) {
|
||||
const currentState = state
|
||||
state = msg.state
|
||||
$(".red-ui-flow-node-button").toggleClass("red-ui-flow-node-button-stopped", state !== STARTED)
|
||||
if(settings.enabled === true && settings.ui === true) {
|
||||
RED.menu.setVisible("deploymenu-item-runtime-stop", state === STARTED)
|
||||
RED.menu.setVisible("deploymenu-item-runtime-start", state !== STARTED)
|
||||
}
|
||||
// Do not notify the user about this event if:
|
||||
// - This is the very first event we've received after loading the editor (currentState = '')
|
||||
// - The state matches what we already thought was the case (state === currentState)
|
||||
// - The event was triggered by a deploy (msg.deploy === true)
|
||||
// - The event is a safe mode event - that gets notified separately
|
||||
if (currentState !== '' && state !== currentState && !msg.deploy && state !== SAFE) {
|
||||
RED.notify(RED._("notification.state.flows"+(state === STOPPED?'Stopped':'Started'), msg), "success")
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
get started() {
|
||||
return state === STARTED
|
||||
}
|
||||
}
|
||||
})()
|
@@ -167,6 +167,9 @@ RED.menu = (function() {
|
||||
if (opt.disabled) {
|
||||
item.addClass("disabled");
|
||||
}
|
||||
if (opt.visible === false) {
|
||||
item.addClass("hide");
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -303,6 +306,14 @@ RED.menu = (function() {
|
||||
}
|
||||
}
|
||||
|
||||
function setVisible(id,state) {
|
||||
if (!state) {
|
||||
$("#"+id).parent().addClass("hide");
|
||||
} else {
|
||||
$("#"+id).parent().removeClass("hide");
|
||||
}
|
||||
}
|
||||
|
||||
function addItem(id,opt) {
|
||||
var item = createMenuItem(opt);
|
||||
if (opt !== null && opt.group) {
|
||||
@@ -359,6 +370,7 @@ RED.menu = (function() {
|
||||
isSelected: isSelected,
|
||||
toggleSelected: toggleSelected,
|
||||
setDisabled: setDisabled,
|
||||
setVisible: setVisible,
|
||||
addItem: addItem,
|
||||
removeItem: removeItem,
|
||||
setAction: setAction,
|
||||
|
@@ -63,16 +63,18 @@ RED.deploy = (function() {
|
||||
'</a>'+
|
||||
'<a id="red-ui-header-button-deploy-options" class="red-ui-deploy-button" href="#"><i class="fa fa-caret-down"></i></a>'+
|
||||
'</span></li>').prependTo(".red-ui-header-toolbar");
|
||||
RED.menu.init({id:"red-ui-header-button-deploy-options",
|
||||
options: [
|
||||
{id:"deploymenu-item-full",toggle:"deploy-type",icon:"red/images/deploy-full.svg",label:RED._("deploy.full"),sublabel:RED._("deploy.fullDesc"),selected: true, onselect:function(s) { if(s){changeDeploymentType("full")}}},
|
||||
{id:"deploymenu-item-flow",toggle:"deploy-type",icon:"red/images/deploy-flows.svg",label:RED._("deploy.modifiedFlows"),sublabel:RED._("deploy.modifiedFlowsDesc"), onselect:function(s) {if(s){changeDeploymentType("flows")}}},
|
||||
{id:"deploymenu-item-node",toggle:"deploy-type",icon:"red/images/deploy-nodes.svg",label:RED._("deploy.modifiedNodes"),sublabel:RED._("deploy.modifiedNodesDesc"),onselect:function(s) { if(s){changeDeploymentType("nodes")}}},
|
||||
null,
|
||||
{id:"deploymenu-item-reload", icon:"red/images/deploy-reload.svg",label:RED._("deploy.restartFlows"),sublabel:RED._("deploy.restartFlowsDesc"),onselect:"core:restart-flows"},
|
||||
|
||||
]
|
||||
});
|
||||
const mainMenuItems = [
|
||||
{id:"deploymenu-item-full",toggle:"deploy-type",icon:"red/images/deploy-full.svg",label:RED._("deploy.full"),sublabel:RED._("deploy.fullDesc"),selected: true, onselect:function(s) { if(s){changeDeploymentType("full")}}},
|
||||
{id:"deploymenu-item-flow",toggle:"deploy-type",icon:"red/images/deploy-flows.svg",label:RED._("deploy.modifiedFlows"),sublabel:RED._("deploy.modifiedFlowsDesc"), onselect:function(s) {if(s){changeDeploymentType("flows")}}},
|
||||
{id:"deploymenu-item-node",toggle:"deploy-type",icon:"red/images/deploy-nodes.svg",label:RED._("deploy.modifiedNodes"),sublabel:RED._("deploy.modifiedNodesDesc"),onselect:function(s) { if(s){changeDeploymentType("nodes")}}},
|
||||
null
|
||||
]
|
||||
if (RED.settings.runtimeState && RED.settings.runtimeState.ui === true) {
|
||||
mainMenuItems.push({id:"deploymenu-item-runtime-start", icon:"red/images/start.svg",label:"Start"/*RED._("deploy.startFlows")*/,sublabel:"Start Flows" /*RED._("deploy.startFlowsDesc")*/,onselect:"core:start-flows", visible:false})
|
||||
mainMenuItems.push({id:"deploymenu-item-runtime-stop", icon:"red/images/stop.svg",label:"Stop"/*RED._("deploy.startFlows")*/,sublabel:"Stop Flows" /*RED._("deploy.startFlowsDesc")*/,onselect:"core:stop-flows", visible:false})
|
||||
}
|
||||
mainMenuItems.push({id:"deploymenu-item-reload", icon:"red/images/deploy-reload.svg",label:RED._("deploy.restartFlows"),sublabel:RED._("deploy.restartFlowsDesc"),onselect:"core:restart-flows"})
|
||||
RED.menu.init({id:"red-ui-header-button-deploy-options", options: mainMenuItems });
|
||||
} else if (type == "simple") {
|
||||
var label = options.label || RED._("deploy.deploy");
|
||||
var icon = 'red/images/deploy-full-o.svg';
|
||||
@@ -100,6 +102,10 @@ RED.deploy = (function() {
|
||||
|
||||
RED.actions.add("core:deploy-flows",save);
|
||||
if (type === "default") {
|
||||
if (RED.settings.runtimeState && RED.settings.runtimeState.ui === true) {
|
||||
RED.actions.add("core:stop-flows",function() { stopStartFlows("stop") });
|
||||
RED.actions.add("core:start-flows",function() { stopStartFlows("start") });
|
||||
}
|
||||
RED.actions.add("core:restart-flows",restart);
|
||||
RED.actions.add("core:set-deploy-type-to-full",function() { RED.menu.setSelected("deploymenu-item-full",true);});
|
||||
RED.actions.add("core:set-deploy-type-to-modified-flows",function() { RED.menu.setSelected("deploymenu-item-flow",true); });
|
||||
@@ -270,18 +276,73 @@ RED.deploy = (function() {
|
||||
function sanitize(html) {
|
||||
return html.replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">")
|
||||
}
|
||||
function restart() {
|
||||
var startTime = Date.now();
|
||||
$(".red-ui-deploy-button-content").css('opacity',0);
|
||||
$(".red-ui-deploy-button-spinner").show();
|
||||
var deployWasEnabled = !$("#red-ui-header-button-deploy").hasClass("disabled");
|
||||
$("#red-ui-header-button-deploy").addClass("disabled");
|
||||
deployInflight = true;
|
||||
|
||||
function shadeShow() {
|
||||
$("#red-ui-header-shade").show();
|
||||
$("#red-ui-editor-shade").show();
|
||||
$("#red-ui-palette-shade").show();
|
||||
$("#red-ui-sidebar-shade").show();
|
||||
|
||||
}
|
||||
function shadeHide() {
|
||||
$("#red-ui-header-shade").hide();
|
||||
$("#red-ui-editor-shade").hide();
|
||||
$("#red-ui-palette-shade").hide();
|
||||
$("#red-ui-sidebar-shade").hide();
|
||||
}
|
||||
function deployButtonSetBusy(){
|
||||
$(".red-ui-deploy-button-content").css('opacity',0);
|
||||
$(".red-ui-deploy-button-spinner").show();
|
||||
$("#red-ui-header-button-deploy").addClass("disabled");
|
||||
}
|
||||
function deployButtonClearBusy(){
|
||||
$(".red-ui-deploy-button-content").css('opacity',1);
|
||||
$(".red-ui-deploy-button-spinner").hide();
|
||||
}
|
||||
function stopStartFlows(state) {
|
||||
const startTime = Date.now()
|
||||
const deployWasEnabled = !$("#red-ui-header-button-deploy").hasClass("disabled")
|
||||
deployInflight = true
|
||||
deployButtonSetBusy()
|
||||
shadeShow()
|
||||
$.ajax({
|
||||
url:"flows/state",
|
||||
type: "POST",
|
||||
data: {state: state}
|
||||
}).done(function(data,textStatus,xhr) {
|
||||
if (deployWasEnabled) {
|
||||
$("#red-ui-header-button-deploy").removeClass("disabled")
|
||||
}
|
||||
}).fail(function(xhr,textStatus,err) {
|
||||
if (deployWasEnabled) {
|
||||
$("#red-ui-header-button-deploy").removeClass("disabled")
|
||||
}
|
||||
if (xhr.status === 401) {
|
||||
RED.notify(RED._("notification.error", { message: RED._("user.notAuthorized") }), "error")
|
||||
} else if (xhr.responseText) {
|
||||
const errorDetail = { message: err ? (err + "") : "" }
|
||||
try {
|
||||
errorDetail.message = JSON.parse(xhr.responseText).message
|
||||
} finally {
|
||||
errorDetail.message = errorDetail.message || xhr.responseText
|
||||
}
|
||||
RED.notify(RED._("notification.error", errorDetail), "error")
|
||||
} else {
|
||||
RED.notify(RED._("notification.error", { message: RED._("deploy.errors.noResponse") }), "error")
|
||||
}
|
||||
}).always(function() {
|
||||
const delta = Math.max(0, 300 - (Date.now() - startTime))
|
||||
setTimeout(function () {
|
||||
deployButtonClearBusy()
|
||||
shadeHide()
|
||||
deployInflight = false
|
||||
}, delta);
|
||||
});
|
||||
}
|
||||
function restart() {
|
||||
var startTime = Date.now();
|
||||
var deployWasEnabled = !$("#red-ui-header-button-deploy").hasClass("disabled");
|
||||
deployInflight = true;
|
||||
deployButtonSetBusy();
|
||||
$.ajax({
|
||||
url:"flows",
|
||||
type: "POST",
|
||||
@@ -307,15 +368,10 @@ RED.deploy = (function() {
|
||||
RED.notify(RED._("deploy.deployFailed",{message:RED._("deploy.errors.noResponse")}),"error");
|
||||
}
|
||||
}).always(function() {
|
||||
deployInflight = false;
|
||||
var delta = Math.max(0,300-(Date.now()-startTime));
|
||||
setTimeout(function() {
|
||||
$(".red-ui-deploy-button-content").css('opacity',1);
|
||||
$(".red-ui-deploy-button-spinner").hide();
|
||||
$("#red-ui-header-shade").hide();
|
||||
$("#red-ui-editor-shade").hide();
|
||||
$("#red-ui-palette-shade").hide();
|
||||
$("#red-ui-sidebar-shade").hide();
|
||||
deployButtonClearBusy();
|
||||
deployInflight = false;
|
||||
},delta);
|
||||
});
|
||||
}
|
||||
@@ -450,21 +506,14 @@ RED.deploy = (function() {
|
||||
const nns = RED.nodes.createCompleteNodeSet();
|
||||
const startTime = Date.now();
|
||||
|
||||
$(".red-ui-deploy-button-content").css('opacity', 0);
|
||||
$(".red-ui-deploy-button-spinner").show();
|
||||
$("#red-ui-header-button-deploy").addClass("disabled");
|
||||
|
||||
deployButtonSetBusy();
|
||||
const data = { flows: nns };
|
||||
|
||||
if (!force) {
|
||||
data.rev = RED.nodes.version();
|
||||
}
|
||||
|
||||
deployInflight = true;
|
||||
$("#red-ui-header-shade").show();
|
||||
$("#red-ui-editor-shade").show();
|
||||
$("#red-ui-palette-shade").show();
|
||||
$("#red-ui-sidebar-shade").show();
|
||||
shadeShow();
|
||||
$.ajax({
|
||||
url: "flows",
|
||||
type: "POST",
|
||||
@@ -550,15 +599,11 @@ RED.deploy = (function() {
|
||||
RED.notify(RED._("deploy.deployFailed", { message: RED._("deploy.errors.noResponse") }), "error");
|
||||
}
|
||||
}).always(function () {
|
||||
deployInflight = false;
|
||||
const delta = Math.max(0, 300 - (Date.now() - startTime));
|
||||
setTimeout(function () {
|
||||
$(".red-ui-deploy-button-content").css('opacity', 1);
|
||||
$(".red-ui-deploy-button-spinner").hide();
|
||||
$("#red-ui-header-shade").hide();
|
||||
$("#red-ui-editor-shade").hide();
|
||||
$("#red-ui-palette-shade").hide();
|
||||
$("#red-ui-sidebar-shade").hide();
|
||||
deployInflight = false;
|
||||
deployButtonClearBusy()
|
||||
shadeHide()
|
||||
}, delta);
|
||||
});
|
||||
}
|
||||
|
@@ -21,7 +21,7 @@
|
||||
|
||||
const MONACO = "monaco";
|
||||
const ACE = "ace";
|
||||
const defaultEditor = ACE;
|
||||
const defaultEditor = MONACO;
|
||||
const DEFAULT_SETTINGS = { lib: defaultEditor, options: {} };
|
||||
var selectedCodeEditor = null;
|
||||
var initialised = false;
|
||||
@@ -48,12 +48,12 @@
|
||||
}
|
||||
|
||||
function create(options) {
|
||||
//TODO: (quandry - for consideration)
|
||||
//TODO: (quandry - for consideration)
|
||||
// Below, I had to create a hidden element if options.id || options.element is not in the DOM
|
||||
// I have seen 1 node calling `this.editor = RED.editor.createEditor()` with an
|
||||
// I have seen 1 node calling `this.editor = RED.editor.createEditor()` with an
|
||||
// invalid (non existing html element selector) (e.g. node-red-contrib-components does this)
|
||||
// This causes monaco to throw an error when attempting to hook up its events to the dom & the rest of the 'oneditperapre'
|
||||
// code is thus skipped.
|
||||
// This causes monaco to throw an error when attempting to hook up its events to the dom & the rest of the 'oneditperapre'
|
||||
// code is thus skipped.
|
||||
// In ACE mode, creating an ACE editor (with an invalid ID) allows the editor to be created (but obviously there is no UI)
|
||||
// Because one (or more) contrib nodes have left this bad code in place, how would we handle this?
|
||||
// For compatibility, I have decided to create a hidden element so that at least an editor is created & errors do not occur.
|
||||
@@ -79,7 +79,7 @@
|
||||
return this.editor.create(options);//fallback to ACE
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
return {
|
||||
init: init,
|
||||
/**
|
||||
@@ -91,7 +91,7 @@
|
||||
},
|
||||
/**
|
||||
* Get user selected code editor
|
||||
* @return {string} Returns
|
||||
* @return {string} Returns
|
||||
* @memberof RED.editor.codeEditor
|
||||
*/
|
||||
get editor() {
|
||||
@@ -104,4 +104,4 @@
|
||||
*/
|
||||
create: create
|
||||
}
|
||||
})();
|
||||
})();
|
||||
|
@@ -41,8 +41,12 @@ RED.editor.envVarList = (function() {
|
||||
style: "width:100%",
|
||||
class: "node-input-env-value",
|
||||
type: "text",
|
||||
}).attr("autocomplete","disable").appendTo(envRow)
|
||||
valueField.typedInput({default:'str',types:isTemplateNode?DEFAULT_ENV_TYPE_LIST:DEFAULT_ENV_TYPE_LIST_INC_CRED});
|
||||
}).attr("autocomplete","disable").appendTo(envRow);
|
||||
var types = (opt.ui && opt.ui.opts && opt.ui.opts.types);
|
||||
if (!types) {
|
||||
types = isTemplateNode ? DEFAULT_ENV_TYPE_LIST : DEFAULT_ENV_TYPE_LIST_INC_CRED;
|
||||
}
|
||||
valueField.typedInput({default:'str',types:types});
|
||||
valueField.typedInput('type', opt.type);
|
||||
if (opt.type === "cred") {
|
||||
if (opt.value) {
|
||||
@@ -94,6 +98,11 @@ RED.editor.envVarList = (function() {
|
||||
}
|
||||
opt.ui.label = opt.ui.label || {};
|
||||
opt.ui.type = opt.ui.type || "input";
|
||||
if ((opt.ui.type === "cred") &&
|
||||
opt.ui.opts &&
|
||||
opt.ui.opts.types) {
|
||||
opt.ui.type = "input";
|
||||
}
|
||||
|
||||
var uiRow = $('<div/>').appendTo(container).hide();
|
||||
// save current info for reverting on cancel
|
||||
|
@@ -37,8 +37,7 @@
|
||||
if (!node._def.defaults || !node._def.defaults.hasOwnProperty("icon")) {
|
||||
var icon = $("#red-ui-editor-node-icon").val()||"";
|
||||
if (!this.isDefaultIcon) {
|
||||
if ((icon !== node.icon) &&
|
||||
(icon !== "")) {
|
||||
if ((node.icon && icon !== node.icon) || (!node.icon && icon !== "")) {
|
||||
editState.changes.icon = node.icon;
|
||||
node.icon = icon;
|
||||
editState.changed = true;
|
||||
|
@@ -20,10 +20,8 @@ RED.sidebar.help = (function() {
|
||||
var helpSection;
|
||||
var panels;
|
||||
var panelRatio;
|
||||
var helpTopics = [];
|
||||
var treeList;
|
||||
var tocPanel;
|
||||
var helpIndex = {};
|
||||
|
||||
function resizeStack() {
|
||||
var h = $(content).parent().height() - toolbar.outerHeight();
|
||||
@@ -97,7 +95,10 @@ RED.sidebar.help = (function() {
|
||||
var pendingContentLoad;
|
||||
treeList.on('treelistselect', function(e,item) {
|
||||
pendingContentLoad = item;
|
||||
if (item.nodeType) {
|
||||
if (item.tour) {
|
||||
RED.tourGuide.run(item.tour);
|
||||
}
|
||||
else if (item.nodeType) {
|
||||
showNodeTypeHelp(item.nodeType);
|
||||
} else if (item.content) {
|
||||
helpSection.empty();
|
||||
@@ -189,7 +190,6 @@ RED.sidebar.help = (function() {
|
||||
}
|
||||
|
||||
function refreshHelpIndex() {
|
||||
helpTopics = [];
|
||||
var modules = RED.nodes.registry.getModuleList();
|
||||
var moduleNames = Object.keys(modules);
|
||||
moduleNames.sort();
|
||||
@@ -198,15 +198,32 @@ RED.sidebar.help = (function() {
|
||||
label: RED._("sidebar.help.nodeHelp"),
|
||||
children: [],
|
||||
expanded: true
|
||||
}
|
||||
};
|
||||
var tours = RED.tourGuide.list().map(function (item) {
|
||||
return {
|
||||
icon: "fa fa-play-circle-o",
|
||||
label: item.label,
|
||||
tour: item.path,
|
||||
};
|
||||
});
|
||||
var helpData = [
|
||||
{
|
||||
id: 'changelog',
|
||||
label: "Node-RED v"+RED.settings.version,
|
||||
content: getChangelog
|
||||
label: "Node-RED",
|
||||
children: [
|
||||
{
|
||||
id: 'changelog',
|
||||
label: RED._("sidebar.help.changeLog"),
|
||||
content: getChangelog
|
||||
},
|
||||
{
|
||||
label: RED._("tourGuide.welcomeTours"),
|
||||
children: tours
|
||||
}
|
||||
|
||||
]
|
||||
},
|
||||
nodeHelp
|
||||
]
|
||||
];
|
||||
var subflows = RED.nodes.registry.getNodeTypes().filter(function(t) {return /subflow/.test(t)});
|
||||
if (subflows.length > 0) {
|
||||
nodeHelp.children.push({
|
||||
|
@@ -433,9 +433,30 @@ RED.tourGuide = (function() {
|
||||
})
|
||||
}
|
||||
|
||||
function listTour() {
|
||||
return [
|
||||
{
|
||||
id: "3_0",
|
||||
label: "3.0.0-beta.4",
|
||||
path: "./tours/welcome.js"
|
||||
},
|
||||
{
|
||||
id: "2_2",
|
||||
label: "2.2.0",
|
||||
path: "./tours/2.2/welcome.js"
|
||||
},
|
||||
{
|
||||
id: "2_1",
|
||||
label: "2.1.0",
|
||||
path: "./tours/2.1/welcome.js"
|
||||
}
|
||||
];
|
||||
}
|
||||
|
||||
return {
|
||||
load: loadTour,
|
||||
run: run,
|
||||
list: listTour,
|
||||
reset: function() {
|
||||
RED.settings.set("editor.tours.welcome",'');
|
||||
}
|
||||
|
@@ -979,13 +979,14 @@ RED.view.tools = (function() {
|
||||
* - it uses `<paletteLabel> <N>` - where N is the next available integer that
|
||||
* doesn't clash with any existing nodes of that type
|
||||
* @param {Object} node The node to set the name of - if not provided, uses current selection
|
||||
* @param {{ renameBlank: boolean, renameClash: boolean, generateHistory: boolean }} options Possible options are `renameBlank`, `renameClash` and `generateHistory`
|
||||
*/
|
||||
function generateNodeNames(node, options) {
|
||||
options = options || {
|
||||
options = Object.assign({
|
||||
renameBlank: true,
|
||||
renameClash: true,
|
||||
generateHistory: true
|
||||
}
|
||||
}, options)
|
||||
let nodes = node;
|
||||
if (node) {
|
||||
if (!Array.isArray(node)) {
|
||||
|
@@ -4877,6 +4877,9 @@ RED.view = (function() {
|
||||
if (d._def.button) {
|
||||
var buttonEnabled = isButtonEnabled(d);
|
||||
this.__buttonGroup__.classList.toggle("red-ui-flow-node-button-disabled", !buttonEnabled);
|
||||
if (RED.runtime && Object.hasOwn(RED.runtime,'started')) {
|
||||
this.__buttonGroup__.classList.toggle("red-ui-flow-node-button-stopped", !RED.runtime.started);
|
||||
}
|
||||
|
||||
var x = d._def.align == "right"?d.w-6:-25;
|
||||
if (d._def.button.toggle && !d[d._def.button.toggle]) {
|
||||
@@ -5872,6 +5875,7 @@ RED.view = (function() {
|
||||
* @private
|
||||
*/
|
||||
function createNode(type, x, y, z) {
|
||||
const wasDirty = RED.nodes.dirty()
|
||||
var m = /^subflow:(.+)$/.exec(type);
|
||||
var activeSubflow = z ? RED.nodes.subflow(z) : null;
|
||||
if (activeSubflow && m) {
|
||||
@@ -5930,7 +5934,7 @@ RED.view = (function() {
|
||||
var historyEvent = {
|
||||
t: "add",
|
||||
nodes: [nn.id],
|
||||
dirty: RED.nodes.dirty()
|
||||
dirty: wasDirty
|
||||
}
|
||||
if (activeSubflow) {
|
||||
var subflowRefresh = RED.subflow.refresh(true);
|
||||
|
@@ -284,9 +284,22 @@ RED.workspaces = (function() {
|
||||
onselect: "core:show-last-hidden-flow"
|
||||
}
|
||||
]
|
||||
if (hideStack.length > 0) {
|
||||
let hiddenFlows = new Set()
|
||||
for (let i = 0; i < hideStack.length; i++) {
|
||||
let ids = hideStack[i]
|
||||
if (!Array.isArray(ids)) {
|
||||
ids = [ids]
|
||||
}
|
||||
ids.forEach(id => {
|
||||
if (RED.nodes.workspace(id)) {
|
||||
hiddenFlows.add(id)
|
||||
}
|
||||
})
|
||||
}
|
||||
const flowCount = hiddenFlows.size;
|
||||
if (flowCount > 0) {
|
||||
menuItems.unshift({
|
||||
label: RED._("workspace.hiddenFlows",{count: hideStack.length}),
|
||||
label: RED._("workspace.hiddenFlows",{count: flowCount}),
|
||||
onselect: "core:list-hidden-flows"
|
||||
})
|
||||
}
|
||||
|
@@ -2,48 +2,48 @@
|
||||
|
||||
.ace_read-only {
|
||||
.ace_scroller {
|
||||
background: $text-editor-background-disabled;
|
||||
color: $text-editor-color-disabled;
|
||||
background: var(--red-ui-text-editor-background-disabled);
|
||||
color: var(--red-ui-text-editor-color-disabled);
|
||||
}
|
||||
.ace_cursor {
|
||||
color: transparent !important;
|
||||
}
|
||||
}
|
||||
.ace_gutter {
|
||||
background: $text-editor-gutter-background;
|
||||
background: var(--red-ui-text-editor-gutter-background);
|
||||
border-top-left-radius: 4px;
|
||||
border-bottom-left-radius: 4px;
|
||||
}
|
||||
.ace_scroller {
|
||||
background: $text-editor-background;
|
||||
background: var(--red-ui-text-editor-background);
|
||||
border-top-right-radius: 4px;
|
||||
border-bottom-right-radius: 4px;
|
||||
color: $text-editor-color;
|
||||
color: var(--red-ui-text-editor-color);
|
||||
}
|
||||
.ace_marker-layer .ace_active-line {
|
||||
background: $text-editor-active-line-background;
|
||||
background: var(--red-ui-text-editor-active-line-background);
|
||||
}
|
||||
.ace_marker-layer .ace_selection {
|
||||
background: $text-editor-selection-background;
|
||||
background: var(--red-ui-text-editor-selection-background);
|
||||
border-radius: 1px;
|
||||
}
|
||||
.ace_gutter-cell {
|
||||
color: $text-editor-gutter-color;
|
||||
color: var(--red-ui-text-editor-gutter-color);
|
||||
}
|
||||
.ace_gutter-active-line {
|
||||
background: $text-editor-gutter-active-line-background;
|
||||
background: var(--red-ui-text-editor-gutter-active-line-background);
|
||||
}
|
||||
.ace_tooltip {
|
||||
font-family: $primary-font;
|
||||
font-family: var(--red-ui-primary-font);
|
||||
line-height: 1.4em;
|
||||
max-width: 400px;
|
||||
white-space: normal;
|
||||
background-image: none;
|
||||
background: $popover-background;
|
||||
color: $popover-color;
|
||||
background: var(--red-ui-popover-background);
|
||||
color: var(--red-ui-popover-color);
|
||||
border-radius: 4px;
|
||||
@include component-shadow;
|
||||
border-color: $popover-background;
|
||||
border-color: var(--red-ui-popover-background);
|
||||
}
|
||||
.ace_content {
|
||||
line-height: 1;
|
||||
@@ -55,14 +55,14 @@
|
||||
|
||||
#red-ui-event-log-editor {
|
||||
.ace_scroller {
|
||||
background: $event-log-background;
|
||||
color: $event-log-color;
|
||||
background: var(--red-ui-event-log-background);
|
||||
color: var(--red-ui-event-log-color);
|
||||
}
|
||||
.ace_marker-layer .ace_active-line {
|
||||
background: $event-log-active-line-background;
|
||||
background: var(--red-ui-event-log-active-line-background);
|
||||
}
|
||||
.ace_marker-layer .ace_selection {
|
||||
background: $event-log-selection-background;
|
||||
background: var(--red-ui-event-log-selection-background);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@@ -20,12 +20,12 @@ body {
|
||||
}
|
||||
|
||||
.red-ui-editor {
|
||||
font-size: $primary-font-size;
|
||||
font-family: $primary-font;
|
||||
font-size: var(--red-ui-primary-font-size);
|
||||
font-family: var(--red-ui-primary-font);
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
background: $primary-background;
|
||||
color: $primary-text-color;
|
||||
background: var(--red-ui-primary-background);
|
||||
color: var(--red-ui-primary-text-color);
|
||||
line-height: 20px;
|
||||
}
|
||||
|
||||
@@ -63,15 +63,15 @@ body {
|
||||
.red-ui-icon-picker {
|
||||
a {
|
||||
text-decoration: none;
|
||||
color: $primary-text-color;
|
||||
color: var(--red-ui-primary-text-color);
|
||||
}
|
||||
a:hover,
|
||||
a:focus {
|
||||
text-decoration: none;
|
||||
color: $primary-text-color;
|
||||
color: var(--red-ui-primary-text-color);
|
||||
}
|
||||
a:focus {
|
||||
outline: 1px solid $form-input-focus-color;
|
||||
outline: 1px solid var(--red-ui-form-input-focus-color);
|
||||
}
|
||||
|
||||
p {
|
||||
@@ -130,7 +130,7 @@ body {
|
||||
hr {
|
||||
margin: 20px 0;
|
||||
border: 0;
|
||||
border-top: 1px solid $tertiary-border-color;
|
||||
border-top: 1px solid var(--red-ui-tertiary-border-color);
|
||||
}
|
||||
|
||||
|
||||
@@ -150,22 +150,22 @@ body {
|
||||
mask-position: 50% 50%;
|
||||
-webkit-mask-repeat: no-repeat;
|
||||
mask-repeat: no-repeat;
|
||||
background-color: $spinner-color;
|
||||
background-color: var(--red-ui-spinner-color);
|
||||
}
|
||||
|
||||
.red-ui-font-code {
|
||||
font-family: $monospace-font;
|
||||
font-size: $primary-font-size;
|
||||
color: $text-color-code;
|
||||
font-family: var(--red-ui-monospace-font);
|
||||
font-size: var(--red-ui-primary-font-size);
|
||||
color: var(--red-ui-text-color-code);
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
code {
|
||||
font-family: $monospace-font;
|
||||
font-size: $primary-font-size;
|
||||
font-family: var(--red-ui-monospace-font);
|
||||
font-size: var(--red-ui-primary-font-size);
|
||||
padding: 0px;
|
||||
margin: 1px;
|
||||
color: $text-color-code;
|
||||
color: var(--red-ui-text-color-code);
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
@@ -177,8 +177,8 @@ body {
|
||||
word-break: break-all;
|
||||
word-wrap: break-word;
|
||||
white-space: pre-wrap;
|
||||
background-color:$tertiary-background;
|
||||
border: 1px solid $tertiary-border-color;
|
||||
background-color:var(--red-ui-tertiary-background);
|
||||
border: 1px solid var(--red-ui-tertiary-border-color);
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
@@ -217,8 +217,8 @@ body {
|
||||
blockquote {
|
||||
padding: 0 0 0 15px;
|
||||
margin: 0 0 20px;
|
||||
border-left: 4px solid $secondary-border-color;
|
||||
color: $secondary-text-color;
|
||||
border-left: 4px solid var(--red-ui-secondary-border-color);
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
|
||||
p {
|
||||
font-size: 14px;
|
||||
@@ -244,7 +244,7 @@ body {
|
||||
right: 1px;
|
||||
text-align: center;
|
||||
padding: 40px;
|
||||
background: $secondary-background;
|
||||
background: var(--red-ui-secondary-background);
|
||||
&:before {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
@@ -258,14 +258,14 @@ body {
|
||||
width: 80px;
|
||||
}
|
||||
&.red-ui-component-spinner-sidebar {
|
||||
background: $secondary-background;
|
||||
background: var(--red-ui-secondary-background);
|
||||
padding:0;
|
||||
img {
|
||||
width: 40px;
|
||||
}
|
||||
}
|
||||
&.projects-version-control-spinner-sidebar {
|
||||
background: $secondary-background;
|
||||
background: var(--red-ui-secondary-background);
|
||||
padding:0;
|
||||
img {
|
||||
width: 20px;
|
||||
|
@@ -112,9 +112,13 @@ $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($tab-background-active, 0.001);
|
||||
$tab-background-selected: $secondary-background-selected;
|
||||
$tab-background-selected-alpha: rgba($tab-background-selected, 0.001);
|
||||
$tab-background-inactive: $secondary-background-inactive;
|
||||
$tab-background-inactive-alpha: rgba($tab-background-inactive, 0.001);
|
||||
$tab-background-hover: $secondary-background-hover;
|
||||
$tab-background-hover-alpha: rgba($tab-background-hover, 0.001);
|
||||
|
||||
$palette-header-background: $primary-background;
|
||||
$palette-header-color: $header-text-color;
|
||||
|
@@ -17,7 +17,7 @@
|
||||
.red-ui-debug-window {
|
||||
padding:0;
|
||||
margin:0;
|
||||
background: $secondary-background;
|
||||
background: var(--red-ui-secondary-background);
|
||||
line-height: 20px;
|
||||
.red-ui-debug-msg-payload {
|
||||
font-size: 14px;
|
||||
@@ -38,15 +38,15 @@
|
||||
left: 0px;
|
||||
right: 0px;
|
||||
z-index: 20;
|
||||
background: $tertiary-background;
|
||||
background: var(--red-ui-tertiary-background);
|
||||
padding: 10px;
|
||||
border-bottom: 1px solid $secondary-border-color;
|
||||
box-shadow: 0 2px 6px $shadow;
|
||||
border-bottom: 1px solid var(--red-ui-secondary-border-color);
|
||||
box-shadow: 0 2px 6px var(--red-ui-shadow);
|
||||
}
|
||||
#red-ui-sidebar-debug-filter-node-list-row {
|
||||
.red-ui-treeList-label.disabled {
|
||||
font-style: italic;
|
||||
color: $secondary-text-color-disabled;
|
||||
color: var(--red-ui-secondary-text-color-disabled);
|
||||
}
|
||||
|
||||
.red-ui-treeList-label {
|
||||
@@ -57,22 +57,22 @@
|
||||
background: inherit;
|
||||
}
|
||||
&.focus, &.focus .red-ui-treeList-sublabel-text {
|
||||
background: $list-item-background-hover !important;
|
||||
background: var(--red-ui-list-item-background-hover) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
.red-ui-debug-msg {
|
||||
position: relative;
|
||||
border-bottom: 1px solid $debug-message-border;
|
||||
border-left: 8px solid $debug-message-border;
|
||||
border-right: 8px solid $debug-message-border;
|
||||
border-bottom: 1px solid var(--red-ui-debug-message-border);
|
||||
border-left: 8px solid var(--red-ui-debug-message-border);
|
||||
border-right: 8px solid var(--red-ui-debug-message-border);
|
||||
padding: 2px;
|
||||
&>.red-ui-debug-msg-meta .red-ui-debug-msg-tools {
|
||||
display: none;
|
||||
}
|
||||
|
||||
&.red-ui-debug-msg-hover {
|
||||
border-right-color: $debug-message-border-hover;
|
||||
border-right-color: var(--red-ui-debug-message-border-hover);
|
||||
&>.red-ui-debug-msg-meta .red-ui-debug-msg-tools {
|
||||
display: inline-block;
|
||||
}
|
||||
@@ -86,7 +86,7 @@
|
||||
display: inline-block;
|
||||
}
|
||||
&:hover {
|
||||
background: $debug-message-background-hover;
|
||||
background: var(--red-ui-debug-message-background-hover);
|
||||
&>.red-ui-debug-msg-tools {
|
||||
.red-ui-debug-msg-tools-copy {
|
||||
display: inline-block;
|
||||
@@ -120,9 +120,9 @@
|
||||
}
|
||||
|
||||
.red-ui-debug-msg-meta {
|
||||
background: $debug-message-background;
|
||||
background: var(--red-ui-debug-message-background);
|
||||
font-size: 11px;
|
||||
color: $secondary-text-color-inactive;
|
||||
color: var(--red-ui-secondary-text-color-inactive);
|
||||
overflow-wrap: anywhere;
|
||||
}
|
||||
.red-ui-debug-msg-date {
|
||||
@@ -131,11 +131,11 @@
|
||||
}
|
||||
.red-ui-debug-msg-topic {
|
||||
display: block;
|
||||
color: $debug-message-text-color-meta;
|
||||
color: var(--red-ui-debug-message-text-color-meta);
|
||||
}
|
||||
.red-ui-debug-msg-name {
|
||||
padding: 1px 0px;
|
||||
color: $secondary-text-color-inactive;
|
||||
color: var(--red-ui-secondary-text-color-inactive);
|
||||
white-space: nowrap;
|
||||
}
|
||||
.red-ui-debug-msg-tools {
|
||||
@@ -152,39 +152,39 @@
|
||||
.red-ui-debug-msg-payload {
|
||||
display: block;
|
||||
padding: 2px;
|
||||
background: $debug-message-background;
|
||||
font-family: $monospace-font;
|
||||
background: var(--red-ui-debug-message-background);
|
||||
font-family: var(--red-ui-monospace-font);
|
||||
font-size: 13px !important;
|
||||
}
|
||||
.red-ui-debug-msg-level-log {
|
||||
border-left-color: $debug-message-border;
|
||||
border-right-color: $debug-message-border;
|
||||
border-left-color: var(--red-ui-debug-message-border);
|
||||
border-right-color: var(--red-ui-debug-message-border);
|
||||
}
|
||||
.red-ui-debug-msg-level-30 {
|
||||
border-left-color: $debug-message-border-warning;
|
||||
border-right-color: $debug-message-border-warning;
|
||||
border-left-color: var(--red-ui-debug-message-border-warning);
|
||||
border-right-color: var(--red-ui-debug-message-border-warning);
|
||||
}
|
||||
.red-ui-debug-msg-level-20 {
|
||||
border-left-color: $debug-message-border-error;
|
||||
border-right-color: $debug-message-border-error;
|
||||
border-left-color: var(--red-ui-debug-message-border-error);
|
||||
border-right-color: var(--red-ui-debug-message-border-error);
|
||||
}
|
||||
.red-ui-debug-msg-object-entry {
|
||||
position: relative;
|
||||
padding-left: 15px;
|
||||
}
|
||||
.red-ui-debug-msg-element {
|
||||
color: $debug-message-text-color;
|
||||
color: var(--red-ui-debug-message-text-color);
|
||||
line-height: 1.3em;
|
||||
overflow-wrap: break-word;
|
||||
}
|
||||
.red-ui-debug-msg-object-key {
|
||||
color: $debug-message-text-color-object-key;
|
||||
color: var(--red-ui-debug-message-text-color-object-key);
|
||||
}
|
||||
.red-ui-debug-msg-object-value {
|
||||
|
||||
}
|
||||
.red-ui-debug-msg-object-handle {
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
font-size: 1em;
|
||||
width: 1em;
|
||||
text-align: center;
|
||||
@@ -219,17 +219,17 @@
|
||||
display:none;
|
||||
}
|
||||
.red-ui-debug-msg-object-entry pre {
|
||||
font-family: $monospace-font;
|
||||
font-family: var(--red-ui-monospace-font);
|
||||
font-size: 13px;
|
||||
line-height: 1.2em;
|
||||
margin: 0 0 0 -1em;
|
||||
}
|
||||
|
||||
.red-ui-debug-msg-type-other { color: $debug-message-text-color-msg-type-other; }
|
||||
.red-ui-debug-msg-type-string { color: $debug-message-text-color-msg-type-string; }
|
||||
.red-ui-debug-msg-type-null { color: $debug-message-text-color-msg-type-null; font-style: italic;}
|
||||
.red-ui-debug-msg-type-meta { color: $debug-message-text-color-msg-type-meta; font-style: italic;}
|
||||
.red-ui-debug-msg-type-number { color: $debug-message-text-color-msg-type-number; };
|
||||
.red-ui-debug-msg-type-other { color: var(--red-ui-debug-message-text-color-msg-type-other); }
|
||||
.red-ui-debug-msg-type-string { color: var(--red-ui-debug-message-text-color-msg-type-string); }
|
||||
.red-ui-debug-msg-type-null { color: var(--red-ui-debug-message-text-color-msg-type-null); font-style: italic;}
|
||||
.red-ui-debug-msg-type-meta { color: var(--red-ui-debug-message-text-color-msg-type-meta); font-style: italic;}
|
||||
.red-ui-debug-msg-type-number { color: var(--red-ui-debug-message-text-color-msg-type-number); }
|
||||
.red-ui-debug-msg-type-number-toggle { cursor: pointer;}
|
||||
|
||||
.red-ui-debug-msg-type-string {
|
||||
@@ -241,14 +241,14 @@
|
||||
padding: 4px 2px 2px;
|
||||
position: relative;
|
||||
&.red-ui-debug-msg-row-pinned {
|
||||
background: $secondary-background-selected;
|
||||
background: var(--red-ui-secondary-background-selected);
|
||||
}
|
||||
}
|
||||
.red-ui-debug-msg-expandable {
|
||||
cursor: pointer;
|
||||
}
|
||||
.red-ui-debug-msg-expandable:hover .red-ui-debug-msg-object-handle {
|
||||
color:$secondary-text-color-hover;
|
||||
color:var(--red-ui-secondary-text-color-hover);
|
||||
}
|
||||
|
||||
.red-ui-debug-msg-buffer-opts {
|
||||
|
@@ -23,11 +23,11 @@
|
||||
.red-ui-editableList-container {
|
||||
border-radius:1px;
|
||||
padding:0;
|
||||
background: $tertiary-background;
|
||||
background: var(--red-ui-tertiary-background);
|
||||
}
|
||||
.red-ui-diff-list {
|
||||
li {
|
||||
background: $tertiary-background;
|
||||
background: var(--red-ui-tertiary-background);
|
||||
padding: 0px;
|
||||
border: none;
|
||||
min-height: 0;
|
||||
@@ -62,29 +62,29 @@
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
width: 50%;
|
||||
background: $tertiary-background;
|
||||
background: var(--red-ui-tertiary-background);
|
||||
text-align: center;
|
||||
border-top: 1px solid $secondary-border-color;
|
||||
border-color:$secondary-border-color;
|
||||
border-left: 1px solid $secondary-border-color;
|
||||
border-top: 1px solid var(--red-ui-secondary-border-color);
|
||||
border-color:var(--red-ui-secondary-border-color);
|
||||
border-left: 1px solid var(--red-ui-secondary-border-color);
|
||||
}
|
||||
div:last-child {
|
||||
border-right: 1px solid $secondary-border-color;
|
||||
border-right: 1px solid var(--red-ui-secondary-border-color);
|
||||
}
|
||||
}
|
||||
|
||||
.red-ui-diff-dialog-toolbar {
|
||||
box-sizing: border-box;
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
text-align: right;
|
||||
padding: 8px 10px;
|
||||
background: $primary-background;
|
||||
border-bottom: 1px solid $secondary-border-color;
|
||||
background: var(--red-ui-primary-background);
|
||||
border-bottom: 1px solid var(--red-ui-secondary-border-color);
|
||||
white-space: nowrap;
|
||||
}
|
||||
.red-ui-diff-list-flow {
|
||||
background: $secondary-background;
|
||||
border: 1px solid $secondary-border-color;
|
||||
background: var(--red-ui-secondary-background);
|
||||
border: 1px solid var(--red-ui-secondary-border-color);
|
||||
border-radius: 1px;
|
||||
overflow: hidden;
|
||||
|
||||
@@ -114,10 +114,10 @@
|
||||
font-size: 0.9em;
|
||||
|
||||
&:first-child {
|
||||
border-top: 1px solid $tertiary-border-color;
|
||||
border-top: 1px solid var(--red-ui-tertiary-border-color);
|
||||
}
|
||||
&:not(:last-child) {
|
||||
border-bottom: 1px solid $tertiary-border-color;
|
||||
border-bottom: 1px solid var(--red-ui-tertiary-border-color);
|
||||
}
|
||||
|
||||
&.collapsed {
|
||||
@@ -150,8 +150,8 @@
|
||||
width: 100%;
|
||||
}
|
||||
td, th {
|
||||
border-top: 1px solid $secondary-border-color;
|
||||
border-left: 1px solid $secondary-border-color;
|
||||
border-top: 1px solid var(--red-ui-secondary-border-color);
|
||||
border-left: 1px solid var(--red-ui-secondary-border-color);
|
||||
&:first-child {
|
||||
border-left: none;
|
||||
}
|
||||
@@ -166,7 +166,7 @@
|
||||
overflow:hidden;
|
||||
}
|
||||
&:hover {
|
||||
background: $secondary-background-selected;
|
||||
background: var(--red-ui-secondary-background-selected);
|
||||
}
|
||||
|
||||
}
|
||||
@@ -212,7 +212,7 @@
|
||||
cursor: pointer;
|
||||
padding: 0;
|
||||
&:hover {
|
||||
background: $secondary-background-selected;
|
||||
background: var(--red-ui-secondary-background-selected);
|
||||
}
|
||||
}
|
||||
.red-ui-diff-list-flow-title-meta {
|
||||
@@ -223,7 +223,7 @@
|
||||
.red-ui-diff-list-node-header {
|
||||
cursor: pointer;
|
||||
&:hover {
|
||||
background: $secondary-background-selected;
|
||||
background: var(--red-ui-secondary-background-selected);
|
||||
}
|
||||
}
|
||||
.red-ui-diff-list-node-icon {
|
||||
@@ -232,9 +232,9 @@
|
||||
margin: 5px;
|
||||
width: 18px;
|
||||
height: 15px;
|
||||
background: $form-input-background;
|
||||
background: var(--red-ui-form-input-background);
|
||||
border-radius: 2px;
|
||||
border: 1px solid $node-border;
|
||||
border: 1px solid var(--red-ui-node-border);
|
||||
background-position: 5% 50%;
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
@@ -267,7 +267,7 @@
|
||||
.red-ui-diff-status-deleted {
|
||||
cursor: default !important;
|
||||
.red-ui-diff-status {
|
||||
color: $diff-state-deleted;
|
||||
color: var(--red-ui-diff-state-deleted);
|
||||
}
|
||||
.red-ui-diff-list-node-node {
|
||||
opacity: 0.5;
|
||||
@@ -280,28 +280,28 @@
|
||||
.red-ui-diff-status-added {
|
||||
cursor: default !important;
|
||||
.red-ui-diff-status {
|
||||
color: $diff-state-added;
|
||||
color: var(--red-ui-diff-state-added);
|
||||
}
|
||||
}
|
||||
.red-ui-diff-status-moved {
|
||||
.red-ui-diff-status {
|
||||
color: $diff-state-moved;
|
||||
color: var(--red-ui-diff-state-moved);
|
||||
}
|
||||
}
|
||||
|
||||
.red-ui-diff-status-changed {
|
||||
.red-ui-diff-status {
|
||||
color: $diff-state-changed;
|
||||
color: var(--red-ui-diff-state-changed);
|
||||
}
|
||||
}
|
||||
.red-ui-diff-status-unchanged {
|
||||
.red-ui-diff-status {
|
||||
color: $diff-state-unchanged;
|
||||
color: var(--red-ui-diff-state-unchanged);
|
||||
}
|
||||
}
|
||||
.red-ui-diff-status-conflict {
|
||||
.red-ui-diff-status {
|
||||
color: $diff-state-conflict;
|
||||
color: var(--red-ui-diff-state-conflict);
|
||||
}
|
||||
}
|
||||
.red-ui-diff-list-node-title {
|
||||
@@ -312,7 +312,7 @@
|
||||
}
|
||||
.red-ui-diff-list-node-properties {
|
||||
margin: 0;
|
||||
color: $primary-text-color;
|
||||
color: var(--red-ui-primary-text-color);
|
||||
}
|
||||
.red-ui-diff-status {
|
||||
display: inline-block;
|
||||
@@ -329,7 +329,7 @@
|
||||
}
|
||||
|
||||
.red-ui-diff-list-node-description {
|
||||
color: $form-text-color;
|
||||
color: var(--red-ui-form-text-color);
|
||||
margin-right: 5px;
|
||||
padding-top: 5px;
|
||||
display: inline-block;
|
||||
@@ -340,11 +340,11 @@
|
||||
}
|
||||
}
|
||||
|
||||
.red-ui-diff-state-added { color: $diff-state-added; }
|
||||
.red-ui-diff-state-deleted { color: $diff-state-deleted; }
|
||||
.red-ui-diff-state-changed { color: $diff-state-changed; }
|
||||
.red-ui-diff-state-unchanged { color: $diff-state-unchanged; }
|
||||
.red-ui-diff-state-conflicted { color: $diff-state-conflicted; }
|
||||
.red-ui-diff-state-added { color: var(--red-ui-diff-state-added); }
|
||||
.red-ui-diff-state-deleted { color: var(--red-ui-diff-state-deleted); }
|
||||
.red-ui-diff-state-changed { color: var(--red-ui-diff-state-changed); }
|
||||
.red-ui-diff-state-unchanged { color: var(--red-ui-diff-state-unchanged); }
|
||||
.red-ui-diff-state-conflicted { color: var(--red-ui-diff-state-conflicted); }
|
||||
|
||||
|
||||
.red-ui-diff-list-node-cell {
|
||||
@@ -353,19 +353,19 @@
|
||||
box-sizing: border-box;
|
||||
width: calc( (100% - 20px) / 2);
|
||||
height: 32px;
|
||||
border-left: 1px solid $secondary-border-color;
|
||||
border-left: 1px solid var(--red-ui-secondary-border-color);
|
||||
padding-top: 2px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
.red-ui-diff-empty {
|
||||
background: $secondary-background-disabled;
|
||||
background: var(--red-ui-secondary-background-disabled);
|
||||
background: repeating-linear-gradient(
|
||||
20deg,
|
||||
$secondary-background, $secondary-background 5px,
|
||||
$secondary-background-disabled 5px,
|
||||
$secondary-background-disabled 10px
|
||||
var(--red-ui-secondary-background), var(--red-ui-secondary-background) 5px,
|
||||
var(--red-ui-secondary-background-disabled) 5px,
|
||||
var(--red-ui-secondary-background-disabled) 10px
|
||||
);
|
||||
}
|
||||
.red-ui-diff-list-node-cell:first-child {
|
||||
@@ -425,10 +425,10 @@
|
||||
background: none;
|
||||
}
|
||||
&.red-ui-diff-status-changed {
|
||||
background: $diff-state-changed-background;
|
||||
background: var(--red-ui-diff-state-changed-background);
|
||||
}
|
||||
&.red-ui-diff-status-conflict {
|
||||
background: $diff-state-conflict-background;
|
||||
background: var(--red-ui-diff-state-conflict-background);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -439,42 +439,42 @@ label.red-ui-diff-selectbox {
|
||||
bottom:0;
|
||||
width: 35px;
|
||||
text-align: center;
|
||||
border-left: 1px solid $secondary-border-color;
|
||||
border-left: 1px solid var(--red-ui-secondary-border-color);
|
||||
margin:0;
|
||||
input[type="radio"] {
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background: $secondary-background-hover;
|
||||
background: var(--red-ui-secondary-background-hover);
|
||||
}
|
||||
}
|
||||
|
||||
.red-ui-diff-list-node-conflict.red-ui-diff-select-remote {
|
||||
.red-ui-diff-list-node-remote {
|
||||
background: $diff-state-added-background;
|
||||
background: var(--red-ui-diff-state-added-background);
|
||||
label {
|
||||
border-left-color: $diff-state-added-border;
|
||||
border-left-color: var(--red-ui-diff-state-added-border);
|
||||
}
|
||||
}
|
||||
.red-ui-diff-list-node-local {
|
||||
background: $diff-state-deleted-background;
|
||||
background: var(--red-ui-diff-state-deleted-background);
|
||||
label {
|
||||
border-left-color: $diff-state-deleted-border;
|
||||
border-left-color: var(--red-ui-diff-state-deleted-border);
|
||||
}
|
||||
}
|
||||
}
|
||||
.red-ui-diff-list-node-conflict.red-ui-diff-select-local {
|
||||
.red-ui-diff-list-node-local {
|
||||
background: $diff-state-added-background;
|
||||
background: var(--red-ui-diff-state-added-background);
|
||||
label {
|
||||
border-left-color: $diff-state-added-border;
|
||||
border-left-color: var(--red-ui-diff-state-added-border);
|
||||
}
|
||||
}
|
||||
.red-ui-diff-list-node-remote {
|
||||
background: $diff-state-deleted-background;
|
||||
background: var(--red-ui-diff-state-deleted-background);
|
||||
label {
|
||||
border-left-color: $diff-state-deleted-border;
|
||||
border-left-color: var(--red-ui-diff-state-deleted-border);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -500,10 +500,10 @@ ul.red-ui-deploy-dialog-confirm-list {
|
||||
width: 30px;
|
||||
margin-right: 10px;
|
||||
&.fa-check {
|
||||
color: $text-color-success;
|
||||
color: var(--red-ui-text-color-success);
|
||||
}
|
||||
&.fa-exclamation {
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
}
|
||||
}
|
||||
div {
|
||||
@@ -529,7 +529,7 @@ ul.red-ui-deploy-dialog-confirm-list {
|
||||
|
||||
table.red-ui-diff-text-content {
|
||||
margin: 10px;
|
||||
border: 1px solid $secondary-border-color;
|
||||
border: 1px solid var(--red-ui-secondary-border-color);
|
||||
border-radius: 3px;
|
||||
table-layout: fixed;
|
||||
width: calc(100% - 20px);
|
||||
@@ -538,88 +538,88 @@ ul.red-ui-deploy-dialog-confirm-list {
|
||||
word-wrap: break-word;
|
||||
}
|
||||
td.lineno {
|
||||
font-family: $monospace-font;
|
||||
font-family: var(--red-ui-monospace-font);
|
||||
text-align: right;
|
||||
color: $tertiary-text-color;
|
||||
background: $tertiary-background;
|
||||
color: var(--red-ui-tertiary-text-color);
|
||||
background: var(--red-ui-tertiary-background);
|
||||
padding: 1px 5px;
|
||||
&.added {
|
||||
background: $diff-state-added-header-background;
|
||||
background: var(--red-ui-diff-state-added-header-background);
|
||||
}
|
||||
&.removed {
|
||||
background: $diff-state-deleted-header-background;
|
||||
background: var(--red-ui-diff-state-deleted-header-background);
|
||||
}
|
||||
}
|
||||
td.lineno:nth-child(3) {
|
||||
border-left: 1px solid $secondary-border-color;
|
||||
border-left: 1px solid var(--red-ui-secondary-border-color);
|
||||
}
|
||||
td.linetext {
|
||||
font-family: $monospace-font;
|
||||
font-family: var(--red-ui-monospace-font);
|
||||
white-space: pre-wrap;
|
||||
padding: 1px 5px;
|
||||
border-left: 1px solid $tertiary-border-color;
|
||||
border-left: 1px solid var(--red-ui-tertiary-border-color);
|
||||
span.prefix {
|
||||
width: 30px;
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
color: $diff-state-prefix-color;
|
||||
color: var(--red-ui-diff-state-prefix-color);
|
||||
}
|
||||
|
||||
&.added {
|
||||
border-left-color: $diff-state-added-header-border;
|
||||
border-left-color: var(--red-ui-diff-state-added-header-border);
|
||||
}
|
||||
&.removed {
|
||||
border-left-color: $diff-state-deleted-header-border;
|
||||
border-left-color: var(--red-ui-diff-state-deleted-header-border);
|
||||
}
|
||||
}
|
||||
td.blank {
|
||||
background: $tertiary-background;
|
||||
background: var(--red-ui-tertiary-background);
|
||||
}
|
||||
td.added {
|
||||
background: $diff-state-added-background;
|
||||
color: $diff-state-color;
|
||||
background: var(--red-ui-diff-state-added-background);
|
||||
color: var(--red-ui-diff-state-color);
|
||||
}
|
||||
td.removed {
|
||||
background: $diff-state-deleted-background;
|
||||
color: $diff-state-color;
|
||||
background: var(--red-ui-diff-state-deleted-background);
|
||||
color: var(--red-ui-diff-state-color);
|
||||
}
|
||||
tr.mergeHeader td {
|
||||
color: $diff-merge-header-color;
|
||||
background: $diff-merge-header-background;
|
||||
color: var(--red-ui-diff-merge-header-color);
|
||||
background: var(--red-ui-diff-merge-header-background);
|
||||
height: 26px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
tr.mergeHeader-separator td {
|
||||
color: $diff-merge-header-color;
|
||||
background: $diff-merge-header-border-color;
|
||||
color: var(--red-ui-diff-merge-header-color);
|
||||
background: var(--red-ui-diff-merge-header-border-color);
|
||||
height: 0px;
|
||||
}
|
||||
tr.mergeHeader-ours td {
|
||||
border-top: 2px solid $diff-merge-header-border-color;
|
||||
border-top: 2px solid var(--red-ui-diff-merge-header-border-color);
|
||||
}
|
||||
tr.mergeHeader-theirs td {
|
||||
border-bottom: 2px solid $diff-merge-header-border-color;
|
||||
border-bottom: 2px solid var(--red-ui-diff-merge-header-border-color);
|
||||
}
|
||||
td.unchanged {
|
||||
background: $diff-state-unchanged-background;
|
||||
color: $diff-state-unchanged;
|
||||
background: var(--red-ui-diff-state-unchanged-background);
|
||||
color: var(--red-ui-diff-state-unchanged);
|
||||
}
|
||||
tr.unchanged {
|
||||
background: $diff-state-unchanged-background;
|
||||
background: var(--red-ui-diff-state-unchanged-background);
|
||||
}
|
||||
tr.start-block {
|
||||
border-top: 1px solid $secondary-border-color;
|
||||
border-top: 1px solid var(--red-ui-secondary-border-color);
|
||||
}
|
||||
tr.end-block {
|
||||
border-bottom: 1px solid $secondary-border-color;
|
||||
border-bottom: 1px solid var(--red-ui-secondary-border-color);
|
||||
}
|
||||
tr.red-ui-diff-text-file-header td {
|
||||
.filename {
|
||||
font-family: $monospace-font;
|
||||
font-family: var(--red-ui-monospace-font);
|
||||
}
|
||||
background: $primary-background;
|
||||
background: var(--red-ui-primary-background);
|
||||
padding: 5px 10px 5px 0;
|
||||
color: $primary-text-color;
|
||||
color: var(--red-ui-primary-text-color);
|
||||
cursor: pointer;
|
||||
i.red-ui-diff-list-chevron {
|
||||
width: 30px;
|
||||
@@ -631,17 +631,17 @@ ul.red-ui-deploy-dialog-confirm-list {
|
||||
}
|
||||
}
|
||||
tr.red-ui-diff-text-commit-header td {
|
||||
background: $primary-background;
|
||||
background: var(--red-ui-primary-background);
|
||||
padding: 5px 10px;
|
||||
color: $primary-text-color;
|
||||
color: var(--red-ui-primary-text-color);
|
||||
h3 {
|
||||
font-size: 1.4em;
|
||||
margin: 0;
|
||||
}
|
||||
.commit-summary {
|
||||
border-top: 1px solid $secondary-border-color;
|
||||
border-top: 1px solid var(--red-ui-secondary-border-color);
|
||||
padding-top: 5px;
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
}
|
||||
.commit-body {
|
||||
margin-bottom:15px;
|
||||
@@ -651,20 +651,20 @@ ul.red-ui-deploy-dialog-confirm-list {
|
||||
}
|
||||
|
||||
tr.red-ui-diff-text-header > td:not(.red-ui-diff-flow-diff) {
|
||||
font-family: $monospace-font;
|
||||
font-family: var(--red-ui-monospace-font);
|
||||
padding: 5px 10px;
|
||||
text-align: left;
|
||||
color: $diff-text-header-color;
|
||||
background: $diff-text-header-background;
|
||||
color: var(--red-ui-diff-text-header-color);
|
||||
background: var(--red-ui-diff-text-header-background);
|
||||
height: 30px;
|
||||
vertical-align: middle;
|
||||
border-top: 1px solid $secondary-border-color;
|
||||
border-bottom: 1px solid $secondary-border-color;
|
||||
border-top: 1px solid var(--red-ui-secondary-border-color);
|
||||
border-bottom: 1px solid var(--red-ui-secondary-border-color);
|
||||
}
|
||||
tr.red-ui-diff-text-expand td {
|
||||
cursor: pointer;
|
||||
&:hover {
|
||||
background: $diff-text-header-background;
|
||||
background: var(--red-ui-diff-text-header-background);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@@ -18,7 +18,7 @@
|
||||
position: absolute;
|
||||
top: 0; bottom: 0;
|
||||
left: 0; right: 0;
|
||||
background: $dnd-background;
|
||||
background: var(--red-ui-dnd-background);
|
||||
display:table;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
@@ -30,7 +30,7 @@
|
||||
vertical-align: middle;
|
||||
text-align: center;
|
||||
font-size: 40px;
|
||||
color: $dnd-color;
|
||||
color: var(--red-ui-dnd-color);
|
||||
i {
|
||||
pointer-events: none;
|
||||
font-size: 80px;
|
||||
|
@@ -15,8 +15,8 @@
|
||||
**/
|
||||
|
||||
.red-ui-menu-dropdown {
|
||||
font-family: $primary-font;
|
||||
font-size: $primary-font-size;
|
||||
font-family: var(--red-ui-primary-font);
|
||||
font-size: var(--red-ui-primary-font-size);
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
width: 230px;
|
||||
@@ -28,9 +28,9 @@
|
||||
margin-left: 0px !important;
|
||||
padding: 5px 0;
|
||||
list-style: none;
|
||||
background: $menuBackground;
|
||||
border: 1px solid $secondary-border-color;
|
||||
box-shadow: 0 5px 10px $shadow;
|
||||
background: var(--red-ui-menuBackground);
|
||||
border: 1px solid var(--red-ui-secondary-border-color);
|
||||
box-shadow: 0 5px 10px var(--red-ui-shadow);
|
||||
|
||||
&.pull-right {
|
||||
right: 0;
|
||||
@@ -41,7 +41,7 @@
|
||||
height: 1px;
|
||||
margin: 9px 1px;
|
||||
overflow: hidden;
|
||||
background-color: $menuDivider;
|
||||
background-color: var(--red-ui-menuDivider);
|
||||
}
|
||||
& > li > a,
|
||||
& > li > a:focus {
|
||||
@@ -50,7 +50,7 @@
|
||||
clear: both;
|
||||
font-weight: normal;
|
||||
line-height: 20px;
|
||||
color: $menuColor;
|
||||
color: var(--red-ui-menuColor);
|
||||
white-space: normal !important;
|
||||
outline: none;
|
||||
}
|
||||
@@ -73,19 +73,19 @@
|
||||
& > .active > a,
|
||||
& > .active > a:hover,
|
||||
& > .active > a:focus {
|
||||
color: $menuActiveColor;
|
||||
color: var(--red-ui-menuActiveColor);
|
||||
text-decoration: none;
|
||||
background-color: $menuActiveBackground;
|
||||
background-color: var(--red-ui-menuActiveBackground);
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
& > .disabled > a,
|
||||
& > .disabled > a:hover,
|
||||
& > .disabled > a:focus {
|
||||
color: $menuDisabledColor;
|
||||
color: var(--red-ui-menuDisabledColor);
|
||||
.red-ui-popover-key {
|
||||
color: $menuDisabledColor;
|
||||
border-color: $menuDisabledColor;
|
||||
color: var(--red-ui-menuDisabledColor);
|
||||
border-color: var(--red-ui-menuDisabledColor);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -133,8 +133,8 @@
|
||||
padding: 0;
|
||||
font-size: 13px;
|
||||
// float: right;
|
||||
color: $menuColor;
|
||||
border-color: $menuColor;
|
||||
color: var(--red-ui-menuColor);
|
||||
border-color: var(--red-ui-menuColor);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -151,9 +151,9 @@
|
||||
.red-ui-menu-dropdown > li > a:focus,
|
||||
.red-ui-menu-dropdown-submenu:hover > a,
|
||||
.red-ui-menu-dropdown-submenu:focus > a {
|
||||
color: $menuHoverColor;
|
||||
color: var(--red-ui-menuHoverColor);
|
||||
text-decoration: none;
|
||||
background-color: $menuHoverBackground;
|
||||
background-color: var(--red-ui-menuHoverBackground);
|
||||
}
|
||||
|
||||
.red-ui-menu-dropdown-submenu {
|
||||
@@ -176,7 +176,7 @@
|
||||
margin-top: 5px;
|
||||
margin-right: -10px;
|
||||
border-color: transparent;
|
||||
border-left-color: $menuCaret;
|
||||
border-left-color: var(--red-ui-menuCaret);
|
||||
border-style: solid;
|
||||
border-width: 5px 0 5px 5px;
|
||||
content: " ";
|
||||
@@ -202,7 +202,7 @@
|
||||
margin-left: -30px;
|
||||
/* Caret Arrow */
|
||||
border-color: transparent;
|
||||
border-right-color: $menuCaret;
|
||||
border-right-color: var(--red-ui-menuCaret);
|
||||
border-style: solid;
|
||||
border-width: 5px 5px 5px 0;
|
||||
content: " ";
|
||||
@@ -227,13 +227,13 @@
|
||||
}
|
||||
}
|
||||
.red-ui-menu-dropdown-submenu.disabled > a:before {
|
||||
border-right-color: $menuCaret;
|
||||
border-right-color: var(--red-ui-menuCaret);
|
||||
}
|
||||
|
||||
|
||||
// Menu NG
|
||||
ul.red-ui-menu:not(.red-ui-menu-dropdown) {
|
||||
font-family: $primary-font;
|
||||
font-family: var(--red-ui-primary-font);
|
||||
font-size: 12px;
|
||||
list-style-type: none;
|
||||
padding: 0;
|
||||
@@ -244,14 +244,14 @@ ul.red-ui-menu:not(.red-ui-menu-dropdown) {
|
||||
clear: both;
|
||||
font-weight: normal;
|
||||
line-height: 20px;
|
||||
color: $menuColor;
|
||||
color: var(--red-ui-menuColor);
|
||||
white-space: nowrap;
|
||||
text-decoration: none;
|
||||
|
||||
&:hover,&:focus {
|
||||
color: $menuHoverColor;
|
||||
color: var(--red-ui-menuHoverColor);
|
||||
text-decoration: none;
|
||||
background-color: $menuHoverBackground;
|
||||
background-color: var(--red-ui-menuHoverBackground);
|
||||
border: none;
|
||||
outline: none;
|
||||
}
|
||||
|
@@ -32,9 +32,9 @@
|
||||
width: auto;
|
||||
right: -1000px;
|
||||
bottom: 0;
|
||||
background: $secondary-background;
|
||||
border-left: 1px solid $secondary-border-color;
|
||||
border-bottom: 1px solid $primary-border-color;
|
||||
background: var(--red-ui-secondary-background);
|
||||
border-left: 1px solid var(--red-ui-secondary-border-color);
|
||||
border-bottom: 1px solid var(--red-ui-primary-border-color);
|
||||
box-sizing: content-box;
|
||||
}
|
||||
.red-ui-tray.open {
|
||||
@@ -67,8 +67,8 @@
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
font-weight: bold;
|
||||
border-bottom: 1px solid $secondary-border-color;
|
||||
background: $palette-header-background;
|
||||
border-bottom: 1px solid var(--red-ui-secondary-border-color);
|
||||
background: var(--red-ui-palette-header-background);
|
||||
&:after {
|
||||
content: "";
|
||||
display: table;
|
||||
@@ -88,8 +88,8 @@
|
||||
height: 26px;
|
||||
line-height: 26px;
|
||||
&.toggle:not(.selected) {
|
||||
color: $workspace-button-color-selected !important;
|
||||
background: $workspace-button-background-active;
|
||||
color: var(--red-ui-workspace-button-color-selected) !important;
|
||||
background: var(--red-ui-workspace-button-background-active);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -116,8 +116,8 @@
|
||||
}
|
||||
|
||||
.red-ui-tray-titlebar {
|
||||
color: $header-text-color;
|
||||
border-bottom: 1px solid $secondary-border-color;
|
||||
color: var(--red-ui-header-text-color);
|
||||
border-bottom: 1px solid var(--red-ui-secondary-border-color);
|
||||
padding: 8px;
|
||||
}
|
||||
.red-ui-editor ul.red-ui-tray-breadcrumbs {
|
||||
@@ -131,7 +131,7 @@
|
||||
margin:0;
|
||||
|
||||
&:not(:last-child) {
|
||||
color: $workspace-button-color;
|
||||
color: var(--red-ui-workspace-button-color);
|
||||
font-weight: normal;
|
||||
|
||||
&:after {
|
||||
@@ -149,10 +149,10 @@
|
||||
bottom: 0px;
|
||||
width: 7px;
|
||||
left: -9px;
|
||||
background-color: $primary-background;
|
||||
background-color: var(--red-ui-primary-background);
|
||||
cursor: col-resize;
|
||||
border-left: 1px solid $primary-border-color;
|
||||
box-shadow: -1px 0 6px $shadow;
|
||||
border-left: 1px solid var(--red-ui-primary-border-color);
|
||||
box-shadow: -1px 0 6px var(--red-ui-shadow);
|
||||
|
||||
&:before {
|
||||
content: '';
|
||||
@@ -167,11 +167,11 @@
|
||||
mask-position: 50% 50%;
|
||||
-webkit-mask-repeat: no-repeat;
|
||||
mask-repeat: no-repeat;
|
||||
background-color: $grip-color;
|
||||
background-color: var(--red-ui-grip-color);
|
||||
}
|
||||
|
||||
&.red-ui-tray-resize-maximised {
|
||||
background: $primary-background;
|
||||
background: var(--red-ui-primary-background);
|
||||
cursor: default;
|
||||
}
|
||||
}
|
||||
@@ -182,10 +182,10 @@ button.red-ui-tray-resize-button {
|
||||
height: 37px;
|
||||
line-height: 35px;
|
||||
border: none;
|
||||
border-bottom: 1px solid $secondary-border-color;
|
||||
border-bottom: 1px solid var(--red-ui-secondary-border-color);
|
||||
margin: 0;
|
||||
background: $primary-background;
|
||||
color: $workspace-button-color;
|
||||
background: var(--red-ui-primary-background);
|
||||
color: var(--red-ui-workspace-button-color);
|
||||
}
|
||||
|
||||
.red-ui-editor .red-ui-tray {
|
||||
@@ -203,16 +203,16 @@ button.red-ui-tray-resize-button {
|
||||
}
|
||||
|
||||
.input-error {
|
||||
border-color: $form-input-border-error-color !important;
|
||||
border-color: var(--red-ui-form-input-border-error-color) !important;
|
||||
}
|
||||
|
||||
.input-updated {
|
||||
border-color: $node-selected-color !important;
|
||||
border-color: var(--red-ui-node-selected-color) !important;
|
||||
}
|
||||
|
||||
.form-row {
|
||||
clear: both;
|
||||
color: $form-text-color;
|
||||
color: var(--red-ui-form-text-color);
|
||||
margin-bottom:12px;
|
||||
}
|
||||
.form-row label {
|
||||
@@ -223,10 +223,10 @@ button.red-ui-tray-resize-button {
|
||||
width:70%;
|
||||
}
|
||||
.form-tips {
|
||||
background: $form-tips-background;
|
||||
background: var(--red-ui-form-tips-background);
|
||||
padding: 8px;
|
||||
border-radius: 2px;
|
||||
border: 1px solid $secondary-border-color;
|
||||
border: 1px solid var(--red-ui-secondary-border-color);
|
||||
max-width: 450px;
|
||||
}
|
||||
.form-tips code {
|
||||
@@ -238,7 +238,7 @@ button.red-ui-tray-resize-button {
|
||||
}
|
||||
|
||||
.form-warning {
|
||||
border-color: $text-color-error;
|
||||
border-color: var(--red-ui-text-color-error);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -255,11 +255,11 @@ button.red-ui-tray-resize-button {
|
||||
}
|
||||
}
|
||||
.red-ui-editor-text-container {
|
||||
border:1px solid $tertiary-border-color;
|
||||
border:1px solid var(--red-ui-tertiary-border-color);
|
||||
border-radius:5px;
|
||||
overflow: hidden;
|
||||
font-size: $primary-font-size !important;
|
||||
font-family: $monospace-font !important;
|
||||
font-size: var(--red-ui-primary-font-size !important);
|
||||
font-family: var(--red-ui-monospace-font !important);
|
||||
height: 100%;
|
||||
|
||||
&.red-ui-editor-text-container-toolbar {
|
||||
@@ -302,7 +302,7 @@ button.red-ui-button-small
|
||||
#red-ui-editor-config-scope-warning {
|
||||
display: inline-block;
|
||||
margin-right: 5px;
|
||||
color: $text-color-warning;
|
||||
color: var(--red-ui-text-color-warning);
|
||||
vertical-align: middle;
|
||||
}
|
||||
#red-ui-editor-config-scope {
|
||||
@@ -358,18 +358,18 @@ button.red-ui-button-small
|
||||
padding: 20px 20px 10px;
|
||||
&:last-child {
|
||||
padding-top: 60px;
|
||||
background: $primary-background;
|
||||
background: var(--red-ui-primary-background);
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
.red-ui-editor-type-markdown-panel-preview {
|
||||
padding: 10px;
|
||||
border:1px solid $secondary-border-color;
|
||||
border:1px solid var(--red-ui-secondary-border-color);
|
||||
border-radius:5px;
|
||||
height: calc(100% - 21px);
|
||||
overflow-y: scroll;
|
||||
background: $secondary-background;
|
||||
background: var(--red-ui-secondary-background);
|
||||
}
|
||||
|
||||
#red-ui-clipboard-hidden {
|
||||
@@ -402,7 +402,7 @@ button.red-ui-button-small
|
||||
span {
|
||||
padding-left: 50px;
|
||||
width: 100px;
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -427,14 +427,14 @@ button.red-ui-button.red-ui-editor-node-appearance-button {
|
||||
|
||||
.red-ui-group-layout-picker {
|
||||
padding: 5px;
|
||||
background: $secondary-background;
|
||||
background: var(--red-ui-secondary-background);
|
||||
}
|
||||
.red-ui-group-layout-picker-cell-text {
|
||||
position: absolute;
|
||||
width: 14px;
|
||||
height: 2px;
|
||||
border-top: 2px solid $secondary-text-color;
|
||||
border-bottom: 2px solid $secondary-text-color;
|
||||
border-top: 2px solid var(--red-ui-secondary-text-color);
|
||||
border-bottom: 2px solid var(--red-ui-secondary-text-color);
|
||||
margin: 2px;
|
||||
|
||||
&.red-ui-group-layout-text-pos-nw { top: 0; left: 0; }
|
||||
@@ -451,7 +451,7 @@ button.red-ui-button.red-ui-editor-node-appearance-button {
|
||||
background-color: #FFF;
|
||||
background-size: 100% 100%;
|
||||
background-position: 0 0, 50% 50%;
|
||||
background-image: linear-gradient(45deg, transparent 45%, $secondary-border-color 45%, $secondary-border-color 55%, transparent 55%, transparent),linear-gradient(-45deg, transparent 45%, $secondary-border-color 45%, $secondary-border-color 55%, transparent 55%, transparent);
|
||||
background-image: linear-gradient(45deg, transparent 45%, var(--red-ui-secondary-border-color) 45%, var(--red-ui-secondary-border-color) 55%, transparent 55%, transparent),linear-gradient(-45deg, transparent 45%, var(--red-ui-secondary-border-color) 45%, var(--red-ui-secondary-border-color) 55%, transparent 55%, transparent);
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
@@ -475,17 +475,17 @@ button.red-ui-group-layout-picker-none {
|
||||
width: 100%;
|
||||
margin-bottom: 0;
|
||||
border: none;
|
||||
border-bottom: 1px solid $form-input-border-color;
|
||||
border-bottom: 1px solid var(--red-ui-form-input-border-color);
|
||||
}
|
||||
small {
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
margin-left: 5px;
|
||||
margin-right: 4px;
|
||||
display: inline-block;
|
||||
min-width: 35px;
|
||||
text-align: right;
|
||||
}
|
||||
background: $primary-background;
|
||||
background: var(--red-ui-primary-background);
|
||||
}
|
||||
.red-ui-editor-node-appearance-button {
|
||||
.red-ui-search-result-node {
|
||||
@@ -496,7 +496,7 @@ button.red-ui-group-layout-picker-none {
|
||||
padding: 0;
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
border-color: $secondary-border-color;
|
||||
border-color: var(--red-ui-secondary-border-color);
|
||||
}
|
||||
.red-ui-color-picker-swatch {
|
||||
position: absolute;
|
||||
@@ -509,7 +509,7 @@ button.red-ui-group-layout-picker-none {
|
||||
background-color: #FFF;
|
||||
background-size: 100% 100%;
|
||||
background-position: 0 0, 50% 50%;
|
||||
background-image: linear-gradient(45deg, transparent 45%, $secondary-border-color 45%, $secondary-border-color 55%, transparent 55%, transparent),linear-gradient(-45deg, transparent 45%, $secondary-border-color 45%, $secondary-border-color 55%, transparent 55%, transparent)
|
||||
background-image: linear-gradient(45deg, transparent 45%, var(--red-ui-secondary-border-color) 45%, var(--red-ui-secondary-border-color) 55%, transparent 55%, transparent),linear-gradient(-45deg, transparent 45%, var(--red-ui-secondary-border-color) 45%, var(--red-ui-secondary-border-color) 55%, transparent 55%, transparent)
|
||||
}
|
||||
.red-ui-search-result-node .red-ui-color-picker-cell-none {
|
||||
border-radius: 4px;
|
||||
@@ -536,7 +536,7 @@ button.red-ui-group-layout-picker-none {
|
||||
top:0;right:0;left:0;bottom:0;
|
||||
background-image:linear-gradient(90deg, transparent 0%, #f00 100%);
|
||||
background-size: 100% 100%;
|
||||
border: 1px solid $primary-border-color;
|
||||
border: 1px solid var(--red-ui-primary-border-color);
|
||||
}
|
||||
|
||||
div.red-ui-button-small.red-ui-color-picker-opacity-slider-handle {
|
||||
@@ -547,9 +547,9 @@ div.red-ui-button-small.red-ui-color-picker-opacity-slider-handle {
|
||||
width: 10px;
|
||||
height: 22px;
|
||||
padding: 0;
|
||||
border: 1px solid $primary-border-color;
|
||||
border: 1px solid var(--red-ui-primary-border-color);
|
||||
border-radius: 1px;
|
||||
background: $secondary-background;
|
||||
background: var(--red-ui-secondary-background);
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.red-ui-icon-picker {
|
||||
@@ -567,10 +567,10 @@ div.red-ui-button-small.red-ui-color-picker-opacity-slider-handle {
|
||||
position: relative;
|
||||
&.red-ui-icon-list-dark {
|
||||
.red-ui-palette-icon-fa {
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
}
|
||||
.red-ui-palette-icon-container {
|
||||
background: $secondary-background;
|
||||
background: var(--red-ui-secondary-background);
|
||||
border-radius: 4px;
|
||||
}
|
||||
}
|
||||
@@ -583,10 +583,10 @@ div.red-ui-button-small.red-ui-color-picker-opacity-slider-handle {
|
||||
border-radius: 4px;
|
||||
|
||||
&:hover {
|
||||
background: $list-item-background-hover;
|
||||
background: var(--red-ui-list-item-background-hover);
|
||||
}
|
||||
&.selected {
|
||||
background: $list-item-background-selected;
|
||||
background: var(--red-ui-list-item-background-selected);
|
||||
.red-ui-search-result-node {
|
||||
// border-color: white;
|
||||
}
|
||||
@@ -597,22 +597,22 @@ div.red-ui-button-small.red-ui-color-picker-opacity-slider-handle {
|
||||
}
|
||||
}
|
||||
.red-ui-icon-list-module {
|
||||
background: $palette-header-background;
|
||||
background: var(--red-ui-palette-header-background);
|
||||
font-size: 0.9em;
|
||||
padding: 3px;
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
clear: both;
|
||||
i {
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
.red-ui-icon-meta {
|
||||
border-top: 1px solid $secondary-border-color;
|
||||
background: $tertiary-background;
|
||||
border-top: 1px solid var(--red-ui-secondary-border-color);
|
||||
background: var(--red-ui-tertiary-background);
|
||||
height: 24px;
|
||||
span {
|
||||
padding: 4px;
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
font-size: 0.9em;
|
||||
line-height: 24px;
|
||||
}
|
||||
@@ -630,7 +630,7 @@ div.red-ui-button-small.red-ui-color-picker-opacity-slider-handle {
|
||||
.red-ui-editor-type-json-editor {
|
||||
height: calc(100% - 10px);
|
||||
.red-ui-treeList-container {
|
||||
background: $secondary-background;
|
||||
background: var(--red-ui-secondary-background);
|
||||
}
|
||||
.red-ui-treeList-label {
|
||||
padding-top: 0;
|
||||
@@ -647,7 +647,7 @@ div.red-ui-button-small.red-ui-color-picker-opacity-slider-handle {
|
||||
vertical-align: middle;
|
||||
}
|
||||
&:hover, &:hover .red-ui-treeList-sublabel-text {
|
||||
background: $secondary-background-disabled;
|
||||
background: var(--red-ui-secondary-background-disabled);
|
||||
.red-ui-editor-type-json-editor-item-gutter {
|
||||
> span, > button {
|
||||
display: inline-block;
|
||||
@@ -656,11 +656,11 @@ div.red-ui-button-small.red-ui-color-picker-opacity-slider-handle {
|
||||
}
|
||||
&.selected {
|
||||
.red-ui-editor-type-json-editor-item-gutter {
|
||||
background: $secondary-background-hover;
|
||||
background: var(--red-ui-secondary-background-hover);
|
||||
}
|
||||
&:hover {
|
||||
.red-ui-editor-type-json-editor-item-gutter {
|
||||
background: $secondary-background-selected;
|
||||
background: var(--red-ui-secondary-background-selected);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -698,7 +698,7 @@ div.red-ui-button-small.red-ui-color-picker-opacity-slider-handle {
|
||||
border: 2px solid rgba(0,0,0,0);
|
||||
border-radius: 3px;
|
||||
&:not(.red-ui-editor-type-json-editor-label-array-key):hover {
|
||||
border-color: $list-item-background-hover;
|
||||
border-color: var(--red-ui-list-item-background-hover);
|
||||
border-style: dashed;
|
||||
}
|
||||
&.readonly {
|
||||
@@ -712,8 +712,8 @@ div.red-ui-button-small.red-ui-color-picker-opacity-slider-handle {
|
||||
|
||||
height: 100%;
|
||||
line-height: 35px;
|
||||
color: $tertiary-text-color;
|
||||
background: $secondary-background-disabled;
|
||||
color: var(--red-ui-tertiary-text-color);
|
||||
background: var(--red-ui-secondary-background-disabled);
|
||||
> span {
|
||||
display: inline-block;
|
||||
height: 35px;
|
||||
@@ -755,7 +755,7 @@ button.red-ui-toggleButton.toggle {
|
||||
}
|
||||
>div:first-child {
|
||||
font-size: 0.9em;
|
||||
color: $tertiary-text-color;
|
||||
color: var(--red-ui-tertiary-text-color);
|
||||
margin: 3px 0 -4px;
|
||||
>div {
|
||||
padding-left: 3px;
|
||||
@@ -767,15 +767,15 @@ button.red-ui-toggleButton.toggle {
|
||||
line-height: 30px;
|
||||
display: inline-block;
|
||||
box-sizing: border-box;
|
||||
// border-left: 2px dashed $secondary-border-color;
|
||||
// border-bottom: 2px dashed $secondary-border-color;
|
||||
// border: 1px dashed $secondary-border-color;
|
||||
// border-left: 2px dashed var(--red-ui-secondary-border-color);
|
||||
// border-bottom: 2px dashed var(--red-ui-secondary-border-color);
|
||||
// border: 1px dashed var(--red-ui-secondary-border-color);
|
||||
border-right: none;
|
||||
&:not(:first-child) {
|
||||
padding: 3px;
|
||||
}
|
||||
// &:last-child {
|
||||
// border-right: 1px dashed $secondary-border-color;
|
||||
// border-right: 1px dashed var(--red-ui-secondary-border-color);
|
||||
// }
|
||||
.placeholder-input {
|
||||
position: relative;
|
||||
@@ -800,8 +800,8 @@ button.red-ui-toggleButton.toggle {
|
||||
height: 100%;
|
||||
width: 20px;
|
||||
text-align:center;
|
||||
border-right: 1px solid $secondary-border-color;
|
||||
background: $tertiary-background;
|
||||
border-right: 1px solid var(--red-ui-secondary-border-color);
|
||||
background: var(--red-ui-tertiary-background);
|
||||
}
|
||||
}
|
||||
input[type="checkbox"] {
|
||||
@@ -817,13 +817,13 @@ button.red-ui-toggleButton.toggle {
|
||||
.red-ui-editableList-item-handle {
|
||||
position:relative;
|
||||
top: 0px;
|
||||
color: $tertiary-text-color;
|
||||
color: var(--red-ui-tertiary-text-color);
|
||||
}
|
||||
}
|
||||
>div:nth-child(2) {
|
||||
margin: 4px;
|
||||
height: 32px;
|
||||
border: 1px dashed $secondary-border-color;
|
||||
border: 1px dashed var(--red-ui-secondary-border-color);
|
||||
text-align: center;
|
||||
a {
|
||||
display: block;
|
||||
@@ -831,7 +831,7 @@ button.red-ui-toggleButton.toggle {
|
||||
height: 100%;
|
||||
line-height: 32px;
|
||||
&:hover {
|
||||
background: $secondary-background-hover;
|
||||
background: var(--red-ui-secondary-background-hover);
|
||||
}
|
||||
i {
|
||||
height: 100%;
|
||||
@@ -851,7 +851,7 @@ button.red-ui-toggleButton.toggle {
|
||||
span.red-ui-editor-subflow-env-lang-icon {
|
||||
position: absolute;
|
||||
display: inline-block;
|
||||
background: $secondary-background;
|
||||
background: var(--red-ui-secondary-background);
|
||||
opacity: 0.8;
|
||||
width: 20px;
|
||||
line-height: 32px;
|
||||
@@ -864,12 +864,12 @@ span.red-ui-editor-subflow-env-lang-icon {
|
||||
}
|
||||
|
||||
.red-ui-editor-subflow-env-input-type {
|
||||
background: $secondary-background;
|
||||
background: var(--red-ui-secondary-background);
|
||||
height: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.red-ui-editor-subflow-env-input-type-placeholder {
|
||||
color: $tertiary-text-color;
|
||||
color: var(--red-ui-tertiary-text-color);
|
||||
padding-left: 4px;
|
||||
}
|
||||
|
||||
@@ -886,7 +886,7 @@ span.red-ui-editor-subflow-env-lang-icon {
|
||||
// border-top: none;
|
||||
// }
|
||||
// &.ui-sortable-helper {
|
||||
// border: 2px dashed $secondary-border-color;
|
||||
// border: 2px dashed var(--red-ui-secondary-border-color);
|
||||
// .red-ui-editableList-item-content {
|
||||
// >div {
|
||||
// border: none;
|
||||
@@ -901,15 +901,15 @@ span.red-ui-editor-subflow-env-lang-icon {
|
||||
// >div>div {
|
||||
// display: inline-block;
|
||||
// box-sizing: border-box;
|
||||
// border-left: 1px dashed $secondary-border-color;
|
||||
// border-bottom: 1px dashed $secondary-border-color;
|
||||
// border-left: 1px dashed var(--red-ui-secondary-border-color);
|
||||
// border-bottom: 1px dashed var(--red-ui-secondary-border-color);
|
||||
// }
|
||||
// >div:first-child {
|
||||
// font-size: 0.9em;
|
||||
// display: grid;
|
||||
// grid-template-columns: 25px auto 20px;
|
||||
// >div {
|
||||
// border-top: 1px dashed $secondary-border-color;
|
||||
// border-top: 1px dashed var(--red-ui-secondary-border-color);
|
||||
// padding: 1px;
|
||||
// }
|
||||
// >div:nth-child(3) {
|
||||
@@ -929,9 +929,9 @@ span.red-ui-editor-subflow-env-lang-icon {
|
||||
// // line-height: 30px;
|
||||
// // box-sizing: border-box;
|
||||
// //
|
||||
// // border-left: 2px dashed $secondary-border-color;
|
||||
// // border-left: 2px dashed var(--red-ui-secondary-border-color);
|
||||
// border-top: none;
|
||||
// // border-bottom: 2px dashed $secondary-border-color;
|
||||
// // border-bottom: 2px dashed var(--red-ui-secondary-border-color);
|
||||
// &:not(:first-child) {
|
||||
// padding: 6px 3px;
|
||||
// }
|
||||
@@ -963,7 +963,7 @@ span.red-ui-editor-subflow-env-lang-icon {
|
||||
// height: 100%;
|
||||
// line-height: 45px;
|
||||
// &:hover {
|
||||
// background: $secondary-background-hover;
|
||||
// background: var(--red-ui-secondary-background-hover);
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
@@ -993,11 +993,11 @@ span.red-ui-editor-subflow-env-lang-icon {
|
||||
// }
|
||||
.red-ui-editor-subflow-ui-edit-panel {
|
||||
padding-bottom: 3px;
|
||||
background: $primary-background;
|
||||
background: var(--red-ui-primary-background);
|
||||
.red-ui-editableList-border {
|
||||
border: none;
|
||||
border-radius: 0;
|
||||
border-bottom: 1px solid $secondary-border-color;
|
||||
border-bottom: 1px solid var(--red-ui-secondary-border-color);
|
||||
}
|
||||
.red-ui-editableList-container {
|
||||
}
|
||||
@@ -1005,10 +1005,10 @@ span.red-ui-editor-subflow-env-lang-icon {
|
||||
margin-left: 2px;
|
||||
}
|
||||
.red-ui-editableList-header {
|
||||
background: $primary-background;
|
||||
background: var(--red-ui-primary-background);
|
||||
display: grid;
|
||||
grid-template-columns: 50% 50%;
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
div:first-child {
|
||||
padding-left: 23px;
|
||||
}
|
||||
@@ -1019,7 +1019,7 @@ span.red-ui-editor-subflow-env-lang-icon {
|
||||
.red-ui-editableList-container {
|
||||
padding: 0 1px;
|
||||
li {
|
||||
background: $secondary-background;
|
||||
background: var(--red-ui-secondary-background);
|
||||
// border-bottom: none;
|
||||
padding: 0;
|
||||
.red-ui-editableList-item-content {
|
||||
@@ -1034,14 +1034,14 @@ span.red-ui-editor-subflow-env-lang-icon {
|
||||
margin-bottom: 0;
|
||||
border:none;
|
||||
width: 100%;
|
||||
border-right: 1px solid $secondary-border-color;
|
||||
border-right: 1px solid var(--red-ui-secondary-border-color);
|
||||
|
||||
border-radius: 0;
|
||||
&:focus {
|
||||
box-shadow: 0 0 0 1px inset $form-input-focus-color;
|
||||
box-shadow: 0 0 0 1px inset var(--red-ui-form-input-focus-color);
|
||||
}
|
||||
&:first-child {
|
||||
border-left: 1px solid $secondary-border-color;
|
||||
border-left: 1px solid var(--red-ui-secondary-border-color);
|
||||
}
|
||||
}
|
||||
button.red-ui-typedInput-type-select, button.red-ui-typedInput-option-expand, button.red-ui-typedInput-option-trigger {
|
||||
@@ -1131,7 +1131,7 @@ span.red-ui-editor-subflow-env-lang-icon {
|
||||
border-top-left-radius: 4px;
|
||||
border-top-right-radius: 4px;
|
||||
|
||||
background: $tertiary-background;
|
||||
background: var(--red-ui-tertiary-background);
|
||||
padding: 0;
|
||||
>div {
|
||||
display: grid;
|
||||
|
@@ -16,14 +16,14 @@
|
||||
|
||||
.nr-ui-view-lasso {
|
||||
stroke-width: 1px;
|
||||
stroke: $view-lasso-stroke;
|
||||
fill: $view-lasso-fill;
|
||||
stroke: var(--red-ui-view-lasso-stroke);
|
||||
fill: var(--red-ui-view-lasso-fill);
|
||||
stroke-dasharray: 10 5;
|
||||
}
|
||||
|
||||
.nr-ui-view-slice {
|
||||
stroke-width: 1px;
|
||||
stroke: $view-lasso-stroke;
|
||||
stroke: var(--red-ui-view-lasso-stroke);
|
||||
fill: none;
|
||||
stroke-dasharray: 10 5;
|
||||
}
|
||||
@@ -33,11 +33,11 @@
|
||||
font-style: italic;
|
||||
}
|
||||
.red-ui-flow-node-label-white {
|
||||
fill: $view-background !important;
|
||||
fill: var(--red-ui-view-background) !important;
|
||||
}
|
||||
.red-ui-flow-node-label {
|
||||
stroke-width: 0;
|
||||
fill: $node-label-color;
|
||||
fill: var(--red-ui-node-label-color);
|
||||
font-size: 14px;
|
||||
pointer-events: none;
|
||||
-webkit-touch-callout: none;
|
||||
@@ -54,7 +54,7 @@
|
||||
|
||||
.red-ui-flow-port-label {
|
||||
stroke-width: 0;
|
||||
fill: $node-port-label-color;
|
||||
fill: var(--red-ui-node-port-label-color);
|
||||
font-size: 16px;
|
||||
dominant-baseline: middle;
|
||||
text-anchor: middle;
|
||||
@@ -65,7 +65,7 @@
|
||||
|
||||
|
||||
.red-ui-flow-node {
|
||||
stroke: $node-border;
|
||||
stroke: var(--red-ui-node-border);
|
||||
cursor: move;
|
||||
stroke-width: 1;
|
||||
}
|
||||
@@ -80,7 +80,7 @@
|
||||
opacity: 0.9;
|
||||
.red-ui-flow-node {
|
||||
stroke-width: 2;
|
||||
stroke: $node-selected-color !important;
|
||||
stroke: var(--red-ui-node-selected-color) !important;
|
||||
stroke-dasharray: 10, 4;
|
||||
}
|
||||
}
|
||||
@@ -95,53 +95,53 @@
|
||||
}
|
||||
&.red-ui-flow-group-active-hovered:not(.red-ui-flow-group-hovered) {
|
||||
.red-ui-flow-group-outline-select {
|
||||
stroke: $link-link-color;
|
||||
stroke: var(--red-ui-link-link-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.red-ui-flow-group-outline {
|
||||
fill: none;
|
||||
stroke: $node-selected-color;
|
||||
stroke: var(--red-ui-node-selected-color);
|
||||
stroke-opacity: 0;
|
||||
stroke-width: 12;
|
||||
pointer-events: stroke;
|
||||
}
|
||||
.red-ui-flow-group-outline-select {
|
||||
fill: none;
|
||||
stroke: $node-selected-color;
|
||||
stroke: var(--red-ui-node-selected-color);
|
||||
pointer-events: stroke;
|
||||
stroke-opacity: 0;
|
||||
stroke-width: 3;
|
||||
|
||||
&.red-ui-flow-group-outline-select-background {
|
||||
stroke: $view-background;
|
||||
stroke: var(--red-ui-view-background);
|
||||
stroke-width: 6;
|
||||
}
|
||||
}
|
||||
.red-ui-flow-group-body {
|
||||
pointer-events: none;
|
||||
fill: $group-default-fill;
|
||||
fill-opacity: $group-default-fill-opacity;
|
||||
fill: var(--red-ui-group-default-fill);
|
||||
fill-opacity: var(--red-ui-group-default-fill-opacity);
|
||||
stroke-width: 2;
|
||||
stroke: $group-default-stroke;
|
||||
stroke-opacity: $group-default-stroke-opacity;
|
||||
stroke: var(--red-ui-group-default-stroke);
|
||||
stroke-opacity: var(--red-ui-group-default-stroke-opacity);
|
||||
}
|
||||
.red-ui-flow-group-label {
|
||||
@include disable-selection;
|
||||
fill: $group-default-label-color;
|
||||
fill: var(--red-ui-group-default-label-color);
|
||||
}
|
||||
|
||||
|
||||
|
||||
.red-ui-flow-node-unknown {
|
||||
stroke-dasharray:10,4;
|
||||
stroke: $node-border-unknown;
|
||||
stroke: var(--red-ui-node-border-unknown);
|
||||
}
|
||||
.red-ui-flow-node-placeholder {
|
||||
stroke-dasharray:10,4;
|
||||
stroke: $node-border-placeholder;
|
||||
fill: $node-background-placeholder;
|
||||
stroke: var(--red-ui-node-border-placeholder);
|
||||
fill: var(--red-ui-node-background-placeholder);
|
||||
opacity: 0.5;
|
||||
stroke-width: 2;
|
||||
}
|
||||
@@ -152,19 +152,19 @@
|
||||
.fa-lg {
|
||||
@include disable-selection;
|
||||
stroke: none;
|
||||
fill: $node-icon-color;
|
||||
fill: var(--red-ui-node-icon-color);
|
||||
text-anchor: middle;
|
||||
font-family: FontAwesome;
|
||||
}
|
||||
}
|
||||
.red-ui-flow-node-icon-shade {
|
||||
stroke: none;
|
||||
fill: $node-icon-background-color-fill;
|
||||
fill-opacity: $node-icon-background-color-opacity;
|
||||
fill: var(--red-ui-node-icon-background-color-fill);
|
||||
fill-opacity: var(--red-ui-node-icon-background-color-opacity);
|
||||
}
|
||||
.red-ui-flow-node-icon-shade-border {
|
||||
stroke-opacity: $node-icon-border-color-opacity;
|
||||
stroke: $node-icon-border-color;
|
||||
stroke-opacity: var(--red-ui-node-icon-border-color-opacity);
|
||||
stroke: var(--red-ui-node-icon-border-color);
|
||||
stroke-width: 1;
|
||||
}
|
||||
|
||||
@@ -176,32 +176,39 @@
|
||||
cursor: default;
|
||||
}
|
||||
}
|
||||
&.red-ui-flow-node-button-stopped {
|
||||
opacity: 0.4;
|
||||
.red-ui-flow-node-button-button {
|
||||
cursor: default;
|
||||
pointer-events: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
.red-ui-flow-node-button-button {
|
||||
cursor: pointer;
|
||||
}
|
||||
.red-ui-flow-node-button-background {
|
||||
fill: $node-background-placeholder;
|
||||
fill: var(--red-ui-node-background-placeholder);
|
||||
}
|
||||
|
||||
.red-ui-flow-port {
|
||||
stroke: $node-border;
|
||||
stroke: var(--red-ui-node-border);
|
||||
stroke-width: 1;
|
||||
fill: $node-port-background;
|
||||
fill: var(--red-ui-node-port-background);
|
||||
cursor: crosshair;
|
||||
}
|
||||
|
||||
.red-ui-flow-node-error {
|
||||
fill: $node-status-error-background;
|
||||
stroke: $node-status-error-border;
|
||||
fill: var(--red-ui-node-status-error-background);
|
||||
stroke: var(--red-ui-node-status-error-border);
|
||||
stroke-width:1px;
|
||||
cursor: default;
|
||||
stroke-linejoin: round;
|
||||
stroke-linecap: round;
|
||||
}
|
||||
.red-ui-flow-node-changed {
|
||||
fill: $node-status-changed-background;
|
||||
stroke: $node-status-changed-border;
|
||||
fill: var(--red-ui-node-status-changed-background);
|
||||
stroke: var(--red-ui-node-status-changed-border);
|
||||
cursor: default;
|
||||
stroke-width:1px;
|
||||
stroke-linejoin: round;
|
||||
@@ -214,13 +221,13 @@ g.red-ui-flow-node-selected {
|
||||
}
|
||||
.red-ui-flow-node,.red-ui-flow-subflow-port {
|
||||
stroke-width: 2;
|
||||
stroke: $node-selected-color !important;
|
||||
stroke: var(--red-ui-node-selected-color) !important;
|
||||
}
|
||||
}
|
||||
.red-ui-flow-node-highlighted {
|
||||
border-color: $node-selected-color !important;
|
||||
border-color: var(--red-ui-node-selected-color) !important;
|
||||
border-style: dashed !important;
|
||||
stroke: $node-selected-color;
|
||||
stroke: var(--red-ui-node-selected-color);
|
||||
stroke-width: 3;
|
||||
stroke-dasharray: 8, 4;
|
||||
}
|
||||
@@ -236,7 +243,7 @@ g.red-ui-flow-node-selected {
|
||||
.red-ui-flow-link-line {
|
||||
stroke-dasharray: 10,8 !important;
|
||||
stroke-width: 2 !important;
|
||||
stroke: $link-disabled-color;
|
||||
stroke: var(--red-ui-link-disabled-color);
|
||||
}
|
||||
.red-ui-flow-port {
|
||||
fill-opacity: 1;
|
||||
@@ -254,7 +261,7 @@ g.red-ui-flow-node-selected {
|
||||
&.red-ui-flow-link-line {
|
||||
stroke-dasharray: 10,8 !important;
|
||||
stroke-width: 2 !important;
|
||||
stroke: $link-disabled-color;
|
||||
stroke: var(--red-ui-link-disabled-color);
|
||||
}
|
||||
.red-ui-flow-port {
|
||||
fill-opacity: 1;
|
||||
@@ -263,49 +270,49 @@ g.red-ui-flow-node-selected {
|
||||
}
|
||||
@each $current-color in red green yellow blue grey gray {
|
||||
.red-ui-flow-node-status-dot-#{""+$current-color} {
|
||||
fill: map-get($node-status-colors,$current-color);
|
||||
stroke: map-get($node-status-colors,$current-color);
|
||||
fill: var(--red-ui-node-status-colors-#{"" + $current-color});
|
||||
stroke: var(--red-ui-node-status-colors-#{"" + $current-color});
|
||||
}
|
||||
.red-ui-flow-node-status-ring-#{""+$current-color} {
|
||||
fill: $view-background;
|
||||
stroke: map-get($node-status-colors,$current-color);
|
||||
fill: var(--red-ui-view-background);
|
||||
stroke: var(--red-ui-node-status-colors-#{"" + $current-color});
|
||||
}
|
||||
}
|
||||
|
||||
.red-ui-flow-node-status-label {
|
||||
@include disable-selection;
|
||||
stroke-width: 0;
|
||||
fill: $secondary-text-color;
|
||||
fill: var(--red-ui-secondary-text-color);
|
||||
font-size:9pt;
|
||||
text-anchor:start;
|
||||
}
|
||||
|
||||
.red-ui-flow-port-hovered {
|
||||
stroke: $port-selected-color;
|
||||
fill: $port-selected-color;
|
||||
stroke: var(--red-ui-port-selected-color);
|
||||
fill: var(--red-ui-port-selected-color);
|
||||
}
|
||||
|
||||
.red-ui-flow-subflow-port {
|
||||
fill: $node-background-placeholder;
|
||||
stroke: $node-border;
|
||||
fill: var(--red-ui-node-background-placeholder);
|
||||
stroke: var(--red-ui-node-border);
|
||||
}
|
||||
|
||||
.red-ui-flow-drag-line {
|
||||
stroke: $node-selected-color !important;
|
||||
stroke: var(--red-ui-node-selected-color) !important;
|
||||
stroke-width: 3;
|
||||
fill: none;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.red-ui-flow-link-line {
|
||||
stroke: $link-color;
|
||||
stroke: var(--red-ui-link-color);
|
||||
stroke-width: 3;
|
||||
fill: none;
|
||||
pointer-events: none;
|
||||
}
|
||||
.red-ui-flow-link-link {
|
||||
stroke-width: 2;
|
||||
stroke: $link-link-color;
|
||||
stroke: var(--red-ui-link-link-color);
|
||||
fill: none;
|
||||
stroke-dasharray: 25,4;
|
||||
}
|
||||
@@ -314,19 +321,19 @@ g.red-ui-flow-node-selected {
|
||||
}
|
||||
|
||||
.red-ui-flow-link-port {
|
||||
fill: $node-link-port-background;
|
||||
stroke: $link-link-color;
|
||||
fill: var(--red-ui-node-link-port-background);
|
||||
stroke: var(--red-ui-link-link-color);
|
||||
stroke-width: 1;
|
||||
}
|
||||
.red-ui-flow-link-group-active .red-ui-flow-link-port {
|
||||
stroke: $link-link-active-color;
|
||||
stroke: var(--red-ui-link-link-active-color);
|
||||
}
|
||||
.red-ui-flow-link-group:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.red-ui-flow-link-outline {
|
||||
stroke: $view-background;
|
||||
stroke: var(--red-ui-view-background);
|
||||
stroke-opacity: 0.4;
|
||||
stroke-width: 5;
|
||||
cursor: crosshair;
|
||||
@@ -334,7 +341,7 @@ g.red-ui-flow-node-selected {
|
||||
pointer-events: none;
|
||||
}
|
||||
.red-ui-flow-link-background {
|
||||
stroke: $view-background;
|
||||
stroke: var(--red-ui-view-background);
|
||||
opacity: 0;
|
||||
stroke-width: 20;
|
||||
cursor: crosshair;
|
||||
@@ -345,10 +352,10 @@ g.red-ui-flow-node-selected {
|
||||
}
|
||||
|
||||
g.red-ui-flow-link-selected path.red-ui-flow-link-line {
|
||||
stroke: $node-selected-color;
|
||||
stroke: var(--red-ui-node-selected-color);
|
||||
}
|
||||
g.red-ui-flow-link-unknown path.red-ui-flow-link-line {
|
||||
stroke: $link-unknown-color;
|
||||
stroke: var(--red-ui-link-unknown-color);
|
||||
stroke-width: 2;
|
||||
stroke-dasharray: 10, 4;
|
||||
}
|
||||
@@ -364,15 +371,15 @@ g.red-ui-flow-link-unknown path.red-ui-flow-link-line {
|
||||
pointer-events: none;
|
||||
|
||||
path:first-child {
|
||||
fill: $popover-background;
|
||||
stroke: $popover-background;
|
||||
fill: var(--red-ui-popover-background);
|
||||
stroke: var(--red-ui-popover-background);
|
||||
stroke-width: 1;
|
||||
}
|
||||
}
|
||||
.red-ui-flow-port-tooltip-label {
|
||||
stroke-width: 0;
|
||||
fill: $popover-color;
|
||||
font-family: $primary-font;
|
||||
fill: var(--red-ui-popover-color);
|
||||
font-family: var(--red-ui-primary-font);
|
||||
font-size: 12px;
|
||||
pointer-events: none;
|
||||
-webkit-touch-callout: none;
|
||||
@@ -401,18 +408,18 @@ g.red-ui-flow-link-unknown path.red-ui-flow-link-line {
|
||||
}
|
||||
}
|
||||
.red-ui-flow-junction-port {
|
||||
stroke: $node-border;
|
||||
stroke: var(--red-ui-node-border);
|
||||
stroke-width: 1;
|
||||
fill: $node-port-background;
|
||||
fill: var(--red-ui-node-port-background);
|
||||
cursor: crosshair;
|
||||
transition: transform 0.1s;
|
||||
opacity: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
.red-ui-flow-junction-background {
|
||||
stroke: $node-border;
|
||||
stroke: var(--red-ui-node-border);
|
||||
stroke-width: 1;
|
||||
fill: $node-port-background;
|
||||
fill: var(--red-ui-node-port-background);
|
||||
cursor: crosshair;
|
||||
transform: scale(1);
|
||||
transition: transform 0.1s;
|
||||
@@ -421,10 +428,10 @@ g.red-ui-flow-link-unknown path.red-ui-flow-link-line {
|
||||
}
|
||||
}
|
||||
.red-ui-flow-junction-hovered {
|
||||
stroke: $port-selected-color;
|
||||
fill: $port-selected-color;
|
||||
stroke: var(--red-ui-port-selected-color);
|
||||
fill: var(--red-ui-port-selected-color);
|
||||
}
|
||||
.red-ui-flow-junction.selected .red-ui-flow-junction-background {
|
||||
stroke: $port-selected-color;
|
||||
// fill: $port-selected-color;
|
||||
stroke: var(--red-ui-port-selected-color);
|
||||
// fill: var(--red-ui-port-selected-color);
|
||||
}
|
||||
|
@@ -99,13 +99,13 @@
|
||||
margin-bottom: 20px;
|
||||
font-size: 21px;
|
||||
line-height: 40px;
|
||||
color: $tertiary-text-color;
|
||||
color: var(--red-ui-tertiary-text-color);
|
||||
border: 0;
|
||||
border-bottom: 1px solid $secondary-border-color;
|
||||
border-bottom: 1px solid var(--red-ui-secondary-border-color);
|
||||
}
|
||||
|
||||
legend small {
|
||||
color: $tertiary-text-color;
|
||||
color: var(--red-ui-tertiary-text-color);
|
||||
}
|
||||
|
||||
|
||||
@@ -125,7 +125,7 @@
|
||||
button,
|
||||
select,
|
||||
textarea {
|
||||
font-family: $primary-font;
|
||||
font-family: var(--red-ui-primary-font);
|
||||
}
|
||||
|
||||
label {
|
||||
@@ -159,7 +159,7 @@
|
||||
margin-bottom: 10px;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
color: $form-text-color;
|
||||
color: var(--red-ui-form-text-color);
|
||||
vertical-align: middle;
|
||||
border-radius: 4px;
|
||||
}
|
||||
@@ -193,8 +193,8 @@
|
||||
div[contenteditable="true"],
|
||||
.uneditable-input,
|
||||
.placeholder-input {
|
||||
background-color: $form-input-background;
|
||||
border: 1px solid $form-input-border-color;
|
||||
background-color: var(--red-ui-form-input-background);
|
||||
border: 1px solid var(--red-ui-form-input-border-color);
|
||||
}
|
||||
|
||||
textarea:focus,
|
||||
@@ -214,7 +214,7 @@
|
||||
input[type="color"]:focus,
|
||||
div[contenteditable="true"]:focus,
|
||||
.uneditable-input:focus {
|
||||
border-color: $form-input-focus-color;
|
||||
border-color: var(--red-ui-form-input-focus-color);
|
||||
outline: 0;
|
||||
outline: thin dotted \9;
|
||||
}
|
||||
@@ -245,8 +245,8 @@
|
||||
|
||||
select {
|
||||
width: 220px;
|
||||
background-color: $form-input-background;
|
||||
border: 1px solid $form-input-border-color;
|
||||
background-color: var(--red-ui-form-input-background);
|
||||
border: 1px solid var(--red-ui-form-input-border-color);
|
||||
}
|
||||
|
||||
select[multiple],
|
||||
@@ -258,16 +258,16 @@
|
||||
input[type="file"]:focus,
|
||||
input[type="radio"]:focus,
|
||||
input[type="checkbox"]:focus {
|
||||
outline: 2px auto $form-input-focus-color;
|
||||
outline: 2px auto var(--red-ui-form-input-focus-color);
|
||||
outline-offset: -3px;
|
||||
}
|
||||
|
||||
.uneditable-input,
|
||||
.uneditable-textarea {
|
||||
color: $form-text-color-disabled;
|
||||
color: var(--red-ui-form-text-color-disabled);
|
||||
cursor: not-allowed;
|
||||
background-color: $form-input-background-disabled;
|
||||
border-color: $form-input-border-color;
|
||||
background-color: var(--red-ui-form-input-background-disabled);
|
||||
border-color: var(--red-ui-form-input-border-color);
|
||||
}
|
||||
|
||||
.uneditable-input {
|
||||
@@ -282,19 +282,19 @@
|
||||
|
||||
input:-moz-placeholder,
|
||||
textarea:-moz-placeholder {
|
||||
color: $form-placeholder-color;
|
||||
color: var(--red-ui-form-placeholder-color);
|
||||
}
|
||||
|
||||
input:-ms-input-placeholder,
|
||||
div[contenteditable="true"]:-ms-input-placeholder,
|
||||
textarea:-ms-input-placeholder {
|
||||
color: $form-placeholder-color;
|
||||
color: var(--red-ui-form-placeholder-color);
|
||||
}
|
||||
|
||||
input::-webkit-input-placeholder,
|
||||
div[contenteditable="true"]::-webkit-input-placeholder,
|
||||
textarea::-webkit-input-placeholder {
|
||||
color: $form-placeholder-color;
|
||||
color: var(--red-ui-form-placeholder-color);
|
||||
}
|
||||
|
||||
.radio,
|
||||
@@ -384,7 +384,7 @@
|
||||
}
|
||||
|
||||
label.disabled {
|
||||
color: $form-text-color-disabled;
|
||||
color: var(--red-ui-form-text-color-disabled);
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
@@ -395,8 +395,8 @@
|
||||
select[readonly],
|
||||
textarea[readonly] {
|
||||
cursor: not-allowed;
|
||||
color: $form-text-color-disabled;
|
||||
background-color: $form-input-background-disabled;
|
||||
color: var(--red-ui-form-text-color-disabled);
|
||||
background-color: var(--red-ui-form-input-background-disabled);
|
||||
}
|
||||
|
||||
input[type="radio"][disabled],
|
||||
@@ -410,21 +410,21 @@
|
||||
div[contenteditable="true"]:invalid,
|
||||
textarea:invalid,
|
||||
select:invalid {
|
||||
border-color: $form-input-border-error-color;
|
||||
border-color: var(--red-ui-form-input-border-error-color);
|
||||
}
|
||||
|
||||
input:focus:invalid,
|
||||
div[contenteditable="true"]:focus:invalid,
|
||||
textarea:focus:invalid,
|
||||
select:focus:invalid {
|
||||
border-color: $form-input-border-error-color;
|
||||
border-color: var(--red-ui-form-input-border-error-color);
|
||||
}
|
||||
|
||||
input:focus:invalid:focus,
|
||||
div[contenteditable="true"]:focus:invalid:focus,
|
||||
textarea:focus:invalid:focus,
|
||||
select:focus:invalid:focus {
|
||||
border-color: $form-input-border-error-color;
|
||||
border-color: var(--red-ui-form-input-border-error-color);
|
||||
}
|
||||
|
||||
.input-append,
|
||||
@@ -488,8 +488,8 @@
|
||||
font-weight: normal;
|
||||
line-height: 20px;
|
||||
text-align: center;
|
||||
background-color: $form-button-background;
|
||||
border: 1px solid $form-input-border-color;
|
||||
background-color: var(--red-ui-form-button-background);
|
||||
border: 1px solid var(--red-ui-form-input-border-color);
|
||||
}
|
||||
|
||||
.input-append .add-on,
|
||||
|
@@ -24,10 +24,10 @@
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
background: $header-background;
|
||||
background: var(--red-ui-header-background);
|
||||
box-sizing: border-box;
|
||||
padding: 0px 0px 0px 20px;
|
||||
color: $header-menu-color;
|
||||
color: var(--red-ui-header-menu-color);
|
||||
font-size: 14px;
|
||||
|
||||
span.red-ui-header-logo {
|
||||
@@ -81,17 +81,17 @@
|
||||
font-size: 20px;
|
||||
padding: 0px 12px;
|
||||
text-decoration: none;
|
||||
color: $header-menu-color;
|
||||
color: var(--red-ui-header-menu-color);
|
||||
margin: auto 5px;
|
||||
vertical-align: middle;
|
||||
border-left: 2px solid $header-background;
|
||||
border-right: 2px solid $header-background;
|
||||
border-left: 2px solid var(--red-ui-header-background);
|
||||
border-right: 2px solid var(--red-ui-header-background);
|
||||
|
||||
&:hover {
|
||||
border-color: $header-menu-item-hover;
|
||||
border-color: var(--red-ui-header-menu-item-hover);
|
||||
}
|
||||
&:active, &.active {
|
||||
background: $header-button-background-active;
|
||||
background: var(--red-ui-header-button-background-active);
|
||||
}
|
||||
&:focus {
|
||||
outline: none;
|
||||
@@ -116,18 +116,18 @@
|
||||
}
|
||||
|
||||
.red-ui-deploy-button {
|
||||
background: $deploy-button-background;
|
||||
color: $deploy-button-color;
|
||||
background: var(--red-ui-deploy-button-background);
|
||||
color: var(--red-ui-deploy-button-color);
|
||||
|
||||
&:hover {
|
||||
background: $deploy-button-background-hover;
|
||||
background: var(--red-ui-deploy-button-background-hover);
|
||||
}
|
||||
&:focus {
|
||||
outline: none;
|
||||
}
|
||||
&:active {
|
||||
background: $deploy-button-background-active;
|
||||
color: $deploy-button-color-active;
|
||||
background: var(--red-ui-deploy-button-background-active);
|
||||
color: var(--red-ui-deploy-button-color-active);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -149,21 +149,21 @@
|
||||
padding: 4px 12px;
|
||||
&.disabled {
|
||||
cursor: default;
|
||||
background: $deploy-button-background-disabled;
|
||||
color: $deploy-button-color-disabled;
|
||||
background: var(--red-ui-deploy-button-background-disabled);
|
||||
color: var(--red-ui-deploy-button-color-disabled);
|
||||
|
||||
.red-ui-deploy-button-content>img {
|
||||
opacity: 0.3;
|
||||
}
|
||||
&+ #red-ui-header-button-deploy-options {
|
||||
background: $deploy-button-background-disabled;
|
||||
color: $deploy-button-color-active;
|
||||
background: var(--red-ui-deploy-button-background-disabled);
|
||||
color: var(--red-ui-deploy-button-color-active);
|
||||
}
|
||||
&+ #red-ui-header-button-deploy-options:hover {
|
||||
background: $deploy-button-background-disabled-hover;
|
||||
background: var(--red-ui-deploy-button-background-disabled-hover);
|
||||
}
|
||||
&+ #red-ui-header-button-deploy-options:active {
|
||||
background: $deploy-button-background-disabled;
|
||||
background: var(--red-ui-deploy-button-background-disabled);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -174,23 +174,23 @@
|
||||
|
||||
.red-ui-deploy-button-group.open {
|
||||
#red-ui-header-button-deploy-options {
|
||||
background: $header-button-background-active !important;
|
||||
background: var(--red-ui-header-button-background-active) !important;
|
||||
}
|
||||
}
|
||||
|
||||
li.open .button {
|
||||
background: $header-button-background-active;
|
||||
border-color: $header-button-background-active;
|
||||
background: var(--red-ui-header-button-background-active);
|
||||
border-color: var(--red-ui-header-button-background-active);
|
||||
}
|
||||
|
||||
|
||||
ul.red-ui-menu-dropdown {
|
||||
background: $header-menu-background;
|
||||
border: 1px solid $header-menu-background;
|
||||
background: var(--red-ui-header-menu-background);
|
||||
border: 1px solid var(--red-ui-header-menu-background);
|
||||
width: 260px !important;
|
||||
margin-top: 0;
|
||||
li a {
|
||||
color: $header-menu-color;
|
||||
color: var(--red-ui-header-menu-color);
|
||||
padding: 3px 10px 3px 40px;
|
||||
img {
|
||||
max-width: 100%;
|
||||
@@ -199,11 +199,11 @@
|
||||
border: 3px solid transparent;
|
||||
}
|
||||
.red-ui-popover-key {
|
||||
color: $header-menu-color-disabled !important;
|
||||
border-color: $header-menu-color-disabled !important;
|
||||
color: var(--red-ui-header-menu-color-disabled) !important;
|
||||
border-color: var(--red-ui-header-menu-color-disabled) !important;
|
||||
}
|
||||
&.active img {
|
||||
border: 3px solid $header-menu-item-border-active;
|
||||
border: 3px solid var(--red-ui-header-menu-item-border-active);
|
||||
}
|
||||
|
||||
span.red-ui-menu-label-container {
|
||||
@@ -217,9 +217,9 @@
|
||||
text-indent: 0px;
|
||||
}
|
||||
span.red-ui-menu-sublabel {
|
||||
color: $header-menu-sublabel-color;
|
||||
color: var(--red-ui-header-menu-sublabel-color);
|
||||
font-size: 13px;
|
||||
display: inline-block;
|
||||
display: block;
|
||||
text-indent: 0px;
|
||||
}
|
||||
}
|
||||
@@ -228,13 +228,13 @@
|
||||
> li > a:focus,
|
||||
> li:hover > a,
|
||||
> li:focus > a {
|
||||
background: $header-menu-item-hover !important;
|
||||
background: var(--red-ui-header-menu-item-hover) !important;
|
||||
}
|
||||
li.red-ui-menu-divider {
|
||||
background: $headerMenuItemDivider;
|
||||
background: var(--red-ui-headerMenuItemDivider);
|
||||
}
|
||||
li.disabled a {
|
||||
color: $header-menu-color-disabled;
|
||||
color: var(--red-ui-header-menu-color-disabled);
|
||||
}
|
||||
> li.disabled > a:hover,
|
||||
> li.disabled > a:focus {
|
||||
@@ -242,7 +242,7 @@
|
||||
}
|
||||
}
|
||||
.red-ui-menu-dropdown-submenu>a:before {
|
||||
border-right-color: $headerMenuCaret;
|
||||
border-right-color: var(--red-ui-headerMenuCaret);
|
||||
}
|
||||
|
||||
/* Deploy menu customisations */
|
||||
@@ -250,7 +250,7 @@
|
||||
width: 300px !important;
|
||||
li a {
|
||||
padding: 10px 30px;
|
||||
color: $header-menu-heading-color;
|
||||
color: var(--red-ui-header-menu-heading-color);
|
||||
span.red-ui-menu-label {
|
||||
font-size: 16px;
|
||||
display: inline-block;
|
||||
@@ -263,7 +263,7 @@
|
||||
}
|
||||
/* User menu customisations */
|
||||
#usermenu-item-username > .red-ui-menu-label {
|
||||
color: $header-menu-heading-color;
|
||||
color: var(--red-ui-header-menu-heading-color);
|
||||
}
|
||||
|
||||
#red-ui-header-button-user .user-profile {
|
||||
|
@@ -16,25 +16,27 @@
|
||||
|
||||
.ui-widget {
|
||||
font-size: 14px !important;
|
||||
font-family: $primary-font;
|
||||
font-family: var(--red-ui-primary-font);
|
||||
}
|
||||
.ui-widget input, .ui-widget div[contenteditable="true"], .ui-widget select, .ui-widget textarea, .ui-widget button {
|
||||
font-size: 14px !important;
|
||||
font-family: $primary-font;
|
||||
font-family: var(--red-ui-primary-font);
|
||||
}
|
||||
.ui-widget input, .ui-widget div[contenteditable="true"] {
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.ui-widget.ui-widget-content {
|
||||
border: 1px solid $tertiary-border-color;
|
||||
border: 1px solid var(--red-ui-tertiary-border-color);
|
||||
}
|
||||
.ui-widget-content {
|
||||
border: 1px solid $secondary-border-color;
|
||||
border: 1px solid var(--red-ui-secondary-border-color);
|
||||
background: var(--red-ui-secondary-background);
|
||||
color: var(--red-ui-primary-text-color);
|
||||
}
|
||||
|
||||
.ui-widget-header {
|
||||
color: $header-text-color;
|
||||
color: var(--red-ui-header-text-color);
|
||||
}
|
||||
|
||||
/* jQuery Theme overrides */
|
||||
@@ -50,7 +52,7 @@
|
||||
|
||||
.ui-dialog {
|
||||
border-radius: 1px;
|
||||
background: $secondary-background;
|
||||
background: var(--red-ui-secondary-background);
|
||||
padding: 0;
|
||||
@include component-shadow;
|
||||
}
|
||||
@@ -62,20 +64,20 @@
|
||||
}
|
||||
.ui-dialog .ui-dialog-titlebar {
|
||||
padding: 10px;
|
||||
background: $primary-background;
|
||||
background: var(--red-ui-primary-background);
|
||||
border: none;
|
||||
border-bottom: 1px solid $primary-border-color;
|
||||
border-bottom: 1px solid var(--red-ui-primary-border-color);
|
||||
border-radius: 0;
|
||||
}
|
||||
.ui-dialog .ui-dialog-buttonpane.ui-widget-content {
|
||||
background: $tertiary-background;
|
||||
background: var(--red-ui-tertiary-background);
|
||||
|
||||
}
|
||||
.ui-corner-all {
|
||||
border-radius: 1px;
|
||||
}
|
||||
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
|
||||
background: $primary-background;
|
||||
background: var(--red-ui-primary-background);
|
||||
}
|
||||
.ui-dialog-no-close .ui-dialog-titlebar-close {
|
||||
display: none;
|
||||
@@ -95,8 +97,8 @@
|
||||
padding: 6px 14px;
|
||||
margin-right: 8px;
|
||||
border-radius: 2px;
|
||||
color: $workspace-button-color;
|
||||
background: $workspace-button-background;
|
||||
color: var(--red-ui-workspace-button-color);
|
||||
background: var(--red-ui-workspace-button-background);
|
||||
|
||||
&.leftButton {
|
||||
float: left;
|
||||
@@ -107,18 +109,18 @@
|
||||
}
|
||||
|
||||
&.primary {
|
||||
border-color: $workspace-button-background-primary;
|
||||
color: $workspace-button-color-primary !important;
|
||||
background: $workspace-button-background-primary;
|
||||
border-color: var(--red-ui-workspace-button-background-primary);
|
||||
color: var(--red-ui-workspace-button-color-primary) !important;
|
||||
background: var(--red-ui-workspace-button-background-primary);
|
||||
&:not(.disabled):hover {
|
||||
border-color: $workspace-button-background-primary-hover;
|
||||
background: $workspace-button-background-primary-hover;
|
||||
color: $workspace-button-color-primary !important;
|
||||
border-color: var(--red-ui-workspace-button-background-primary-hover);
|
||||
background: var(--red-ui-workspace-button-background-primary-hover);
|
||||
color: var(--red-ui-workspace-button-color-primary) !important;
|
||||
}
|
||||
&.disabled {
|
||||
border-color: $form-input-border-color;
|
||||
color: $workspace-button-color-disabled !important;
|
||||
background: $workspace-button-background;
|
||||
border-color: var(--red-ui-form-input-border-color);
|
||||
color: var(--red-ui-workspace-button-color-disabled) !important;
|
||||
background: var(--red-ui-workspace-button-background);
|
||||
}
|
||||
}
|
||||
&.disabled {
|
||||
@@ -142,10 +144,10 @@
|
||||
.ui-spinner {
|
||||
border-radius: 4px;
|
||||
padding: 0;
|
||||
border: 1px solid $form-input-border-color;
|
||||
border: 1px solid var(--red-ui-form-input-border-color);
|
||||
}
|
||||
.ui-spinner input {
|
||||
background: $form-input-background;
|
||||
background: var(--red-ui-form-input-background);
|
||||
margin: 0 17px 0 0;
|
||||
padding: 6px;
|
||||
border: none;
|
||||
@@ -169,8 +171,18 @@
|
||||
.ui-button,
|
||||
html .ui-button.ui-state-disabled:hover,
|
||||
html .ui-button.ui-state-disabled:active {
|
||||
border: 1px solid $secondary-border-color;
|
||||
background: $form-button-background;
|
||||
border: 1px solid var(--red-ui-secondary-border-color);
|
||||
background: var(--red-ui-form-button-background);
|
||||
}
|
||||
|
||||
.ui-state-default a,
|
||||
.ui-state-default a:link,
|
||||
.ui-state-default a:visited,
|
||||
a.ui-button,
|
||||
a:link.ui-button,
|
||||
a:visited.ui-button,
|
||||
.ui-button{
|
||||
color: var(--red-ui-primary-text-color);
|
||||
}
|
||||
|
||||
.ui-state-hover,
|
||||
@@ -180,9 +192,9 @@ html .ui-button.ui-state-disabled:active {
|
||||
.ui-widget-content .ui-state-focus,
|
||||
.ui-widget-header .ui-state-focus,
|
||||
.ui-button:hover, .ui-button:focus {
|
||||
border: 1px solid $secondary-border-color;
|
||||
background: $workspace-button-background-hover;
|
||||
color: $workspace-button-color-hover;
|
||||
border: 1px solid var(--red-ui-secondary-border-color);
|
||||
background: var(--red-ui-workspace-button-background-hover);
|
||||
color: var(--red-ui-workspace-button-color-hover);
|
||||
}
|
||||
|
||||
.ui-state-active,
|
||||
@@ -191,10 +203,10 @@ html .ui-button.ui-state-disabled:active {
|
||||
a.ui-button:active,
|
||||
.ui-button:active,
|
||||
.ui-button.ui-state-active:hover {
|
||||
border: 1px solid $secondary-border-color;
|
||||
background: $workspace-button-background-active;
|
||||
border: 1px solid var(--red-ui-secondary-border-color);
|
||||
background: var(--red-ui-workspace-button-background-active);
|
||||
font-weight: normal;
|
||||
color: $workspace-button-color-active;
|
||||
color: var(--red-ui-workspace-button-color-active);
|
||||
}
|
||||
|
||||
.ui-state-active .ui-icon, .ui-button:active .ui-icon {
|
||||
|
@@ -23,9 +23,9 @@
|
||||
}
|
||||
.keyboard-shortcut-list-header {
|
||||
padding:0 5px 0 5px;
|
||||
border-bottom: 1px solid $primary-border-color;
|
||||
border-bottom: 1px solid var(--red-ui-primary-border-color);
|
||||
div {
|
||||
color: $header-text-color !important;
|
||||
color: var(--red-ui-header-text-color) !important;
|
||||
}
|
||||
.red-ui-searchBox-container {
|
||||
width: calc(100% - 20px);
|
||||
@@ -49,7 +49,7 @@
|
||||
}
|
||||
}
|
||||
li:hover {
|
||||
background: $list-item-background-hover;
|
||||
background: var(--red-ui-list-item-background-hover);
|
||||
}
|
||||
}
|
||||
.keyboard-shortcut-entry {
|
||||
@@ -78,13 +78,13 @@
|
||||
width: calc(100% - 160px - 100px - 10px);
|
||||
overflow: hidden;
|
||||
i {
|
||||
color: $tertiary-text-color;
|
||||
color: var(--red-ui-tertiary-text-color);
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
.keyboard-shortcut-entry-scope {
|
||||
width:100px;
|
||||
color: $tertiary-text-color;
|
||||
color: var(--red-ui-tertiary-text-color);
|
||||
vertical-align: middle;
|
||||
text-align: right;
|
||||
}
|
||||
@@ -94,13 +94,13 @@
|
||||
}
|
||||
}
|
||||
.keyboard-shortcut-entry-unassigned {
|
||||
color: $tertiary-text-color;
|
||||
color: var(--red-ui-tertiary-text-color);
|
||||
.keyboard-shortcut-entry-key {
|
||||
font-style: italic;
|
||||
}
|
||||
}
|
||||
.keyboard-shortcut-entry-expanded {
|
||||
background: $list-item-background-selected;
|
||||
background: var(--red-ui-list-item-background-selected);
|
||||
.keyboard-shortcut-entry-key {
|
||||
width: 150px;
|
||||
}
|
||||
@@ -115,12 +115,12 @@
|
||||
}
|
||||
}
|
||||
.help-key {
|
||||
border: 1px solid $tertiary-border-color;
|
||||
border: 1px solid var(--red-ui-tertiary-border-color);
|
||||
padding: 4px;
|
||||
border-radius: 3px;
|
||||
background: $tertiary-background;
|
||||
font-family: $monospace-font;
|
||||
box-shadow: $shade-color 1px 1px 1px;
|
||||
background: var(--red-ui-tertiary-background);
|
||||
font-family: var(--red-ui-monospace-font);
|
||||
box-shadow: var(--red-ui-shade-color 1px 1px 1px);
|
||||
}
|
||||
.help-key-block {
|
||||
white-space: nowrap;
|
||||
|
@@ -18,13 +18,13 @@
|
||||
pre {
|
||||
margin: 10px 0;
|
||||
border: none;
|
||||
color: $primary-text-color;
|
||||
color: var(--red-ui-primary-text-color);
|
||||
span {
|
||||
padding: 5px 0;
|
||||
}
|
||||
span.error {
|
||||
padding: 5px;
|
||||
border: 1px solid $form-input-border-error-color;
|
||||
border: 1px solid var(--red-ui-form-input-border-error-color);
|
||||
margin: 0 1px;
|
||||
}
|
||||
}
|
||||
@@ -52,16 +52,16 @@
|
||||
|
||||
.red-ui-clipboard-dialog-tab-clipboard {
|
||||
textarea {
|
||||
color: $secondary-text-color-active !important;
|
||||
color: var(--red-ui-secondary-text-color-active) !important;
|
||||
resize: none;
|
||||
width: 100%;
|
||||
border-radius: 4px;
|
||||
font-family: $monospace-font !important;
|
||||
font-family: var(--red-ui-monospace-font !important);
|
||||
font-size: 13px !important;
|
||||
height: 100%;
|
||||
line-height: 1.3em;
|
||||
padding: 6px 10px;
|
||||
background: $clipboard-textarea-background;
|
||||
background: var(--red-ui-clipboard-textarea-background);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -80,7 +80,7 @@
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
padding: 0;
|
||||
background: $form-input-background;
|
||||
background: var(--red-ui-form-input-background);
|
||||
&>div {
|
||||
height: 100%;
|
||||
box-sizing: border-box;
|
||||
@@ -89,7 +89,7 @@
|
||||
.red-ui-clipboard-dialog-box {
|
||||
height: 400px;
|
||||
position:relative;
|
||||
border:1px solid $primary-border-color;
|
||||
border:1px solid var(--red-ui-primary-border-color);
|
||||
}
|
||||
|
||||
#red-ui-clipboard-dialog-export-tab-library-filename {
|
||||
@@ -111,7 +111,7 @@
|
||||
.red-ui-clipboard-dialog-tabs-content>div.red-ui-clipboard-dialog-export-tab-library-browser {
|
||||
height: calc(100% - 60px);
|
||||
margin-bottom: 13px;
|
||||
border-bottom: 1px solid $primary-border-color;
|
||||
border-bottom: 1px solid var(--red-ui-primary-border-color);
|
||||
box-sizing: border-box;
|
||||
}
|
||||
#red-ui-clipboard-dialog-import-tab-library-browser {
|
||||
@@ -124,7 +124,7 @@
|
||||
position: relative;
|
||||
height: 100%;
|
||||
.red-ui-treeList-container {
|
||||
background: $secondary-background;
|
||||
background: var(--red-ui-secondary-background);
|
||||
border: none;
|
||||
border-radius: 0;
|
||||
li {
|
||||
@@ -149,14 +149,14 @@
|
||||
|
||||
#red-ui-library-dialog-save-browser {
|
||||
height: calc(100% - 60px);
|
||||
border: 1px solid $primary-border-color;
|
||||
border: 1px solid var(--red-ui-primary-border-color);
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
#red-ui-library-dialog-load-browser {
|
||||
// border: 1px solid $primary-border-color;
|
||||
// border: 1px solid var(--red-ui-primary-border-color);
|
||||
}
|
||||
#red-ui-library-dialog-load-panes {
|
||||
border: 1px solid $primary-border-color;
|
||||
border: 1px solid var(--red-ui-primary-border-color);
|
||||
}
|
||||
|
||||
|
||||
@@ -180,15 +180,15 @@
|
||||
position: relative;
|
||||
|
||||
li:not(:first-child) .red-ui-clipboard-dialog-import-conflicts-item-header {
|
||||
// border-top: 1px solid $secondary-border-color;
|
||||
// border-top: 1px solid var(--red-ui-secondary-border-color);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.red-ui-clipboard-dialog-import-conflicts-item-header {
|
||||
background: $tertiary-background;
|
||||
background: var(--red-ui-tertiary-background);
|
||||
& > span:first-child {
|
||||
color: $header-text-color;
|
||||
color: var(--red-ui-header-text-color);
|
||||
padding-left: 4px;
|
||||
font-size: 12px;
|
||||
}
|
||||
@@ -199,7 +199,7 @@
|
||||
bottom: 0;
|
||||
right: 0px;
|
||||
text-align: center;
|
||||
color: $form-text-color;
|
||||
color: var(--red-ui-form-text-color);
|
||||
.form-row & label {
|
||||
padding: 2px 0;
|
||||
line-height: 23px;
|
||||
@@ -210,7 +210,7 @@
|
||||
height: 100%;
|
||||
width: 80px;
|
||||
text-align: center;
|
||||
border-left: 1px solid $secondary-border-color;
|
||||
border-left: 1px solid var(--red-ui-secondary-border-color);
|
||||
}
|
||||
input[type="checkbox"] {
|
||||
display: inline-block;
|
||||
@@ -265,7 +265,7 @@
|
||||
span:nth-child(3), span:nth-child(4) {
|
||||
flex-grow: 0;
|
||||
padding-right: 5px;
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
font-size: 0.9em;
|
||||
}
|
||||
}
|
||||
|
@@ -31,33 +31,33 @@
|
||||
}
|
||||
|
||||
@mixin component-border {
|
||||
border: 1px solid $primary-border-color;
|
||||
border: 1px solid var(--red-ui-primary-border-color);
|
||||
box-sizing: border-box;
|
||||
|
||||
}
|
||||
|
||||
@mixin reset-a-style {
|
||||
color: $workspace-button-color !important;
|
||||
background: $workspace-button-background;
|
||||
color: var(--red-ui-workspace-button-color) !important;
|
||||
background: var(--red-ui-workspace-button-background);
|
||||
text-decoration: none;
|
||||
|
||||
&.disabled, &:disabled {
|
||||
cursor: default;
|
||||
color: $workspace-button-color-disabled !important;
|
||||
color: var(--red-ui-workspace-button-color-disabled) !important;
|
||||
}
|
||||
&:hover, &:focus {
|
||||
text-decoration: none;
|
||||
}
|
||||
&:not(.disabled):not(:disabled):hover, {
|
||||
color: $workspace-button-color-hover !important;
|
||||
background: $workspace-button-background-hover;
|
||||
&:not(.disabled):not(:disabled):hover {
|
||||
color: var(--red-ui-workspace-button-color-hover) !important;
|
||||
background: var(--red-ui-workspace-button-background-hover);
|
||||
}
|
||||
&:not(.disabled):not(:disabled):focus {
|
||||
color: $workspace-button-color-focus !important;
|
||||
color: var(--red-ui-workspace-button-color-focus) !important;
|
||||
}
|
||||
&:not(.disabled):not(:disabled):active {
|
||||
color: $workspace-button-color-active !important;
|
||||
background: $workspace-button-background-active;
|
||||
color: var(--red-ui-workspace-button-color-active) !important;
|
||||
background: var(--red-ui-workspace-button-background-active);
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
@@ -68,14 +68,14 @@
|
||||
|
||||
box-sizing: border-box;
|
||||
display: inline-block;
|
||||
border: 1px solid $form-input-border-color;
|
||||
border: 1px solid var(--red-ui-form-input-border-color);
|
||||
text-align: center;
|
||||
margin:0;
|
||||
cursor:pointer;
|
||||
|
||||
&.selected:not(.disabled):not(:disabled) {
|
||||
color: $workspace-button-color-selected !important;
|
||||
background: $workspace-button-background-active;
|
||||
color: var(--red-ui-workspace-button-color-selected) !important;
|
||||
background: var(--red-ui-workspace-button-background-active);
|
||||
}
|
||||
.button-group &:not(:first-child) {
|
||||
border-left: none;
|
||||
@@ -108,23 +108,23 @@
|
||||
}
|
||||
|
||||
&:focus {
|
||||
outline: 1px solid $workspace-button-color-focus-outline;
|
||||
outline: 1px solid var(--red-ui-workspace-button-color-focus-outline);
|
||||
outline-offset: 1px;
|
||||
}
|
||||
|
||||
&.primary {
|
||||
border-color: $workspace-button-background-primary;
|
||||
color: $workspace-button-color-primary !important;
|
||||
background: $workspace-button-background-primary;
|
||||
border-color: var(--red-ui-workspace-button-background-primary);
|
||||
color: var(--red-ui-workspace-button-color-primary) !important;
|
||||
background: var(--red-ui-workspace-button-background-primary);
|
||||
&.disabled, &.ui-state-disabled {
|
||||
background: none;
|
||||
color: $workspace-button-color !important;
|
||||
border-color: $form-input-border-color;
|
||||
color: var(--red-ui-workspace-button-color) !important;
|
||||
border-color: var(--red-ui-form-input-border-color);
|
||||
}
|
||||
&:not(.disabled):not(.ui-button-disabled):hover {
|
||||
border-color: $workspace-button-background-primary-hover;
|
||||
background: $workspace-button-background-primary-hover;
|
||||
color: $workspace-button-color-primary !important;
|
||||
border-color: var(--red-ui-workspace-button-background-primary-hover);
|
||||
background: var(--red-ui-workspace-button-background-primary-hover);
|
||||
color: var(--red-ui-workspace-button-color-primary) !important;
|
||||
}
|
||||
}
|
||||
&.secondary {
|
||||
@@ -151,7 +151,7 @@
|
||||
margin-bottom: 1px;
|
||||
&.selected:not(.disabled):not(:disabled) {
|
||||
border-bottom-width: 2px;
|
||||
border-bottom-color: $form-input-border-selected-color;
|
||||
border-bottom-color: var(--red-ui-form-input-border-selected-color);
|
||||
margin-bottom: 0;
|
||||
cursor: default;
|
||||
}
|
||||
@@ -166,7 +166,7 @@
|
||||
padding: 6px 14px;
|
||||
margin-right: 8px;
|
||||
&:not(.disabled):hover {
|
||||
//color: $workspace-button-color;
|
||||
//color: var(--red-ui-workspace-button-color);
|
||||
}
|
||||
&.disabled {
|
||||
background: none;
|
||||
@@ -187,8 +187,8 @@
|
||||
}
|
||||
|
||||
@mixin component-footer {
|
||||
border-top: 1px solid $primary-border-color;
|
||||
background: $primary-background;
|
||||
border-top: 1px solid var(--red-ui-primary-border-color);
|
||||
background: var(--red-ui-primary-background);
|
||||
text-align: right;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
@@ -231,7 +231,7 @@
|
||||
}
|
||||
|
||||
@mixin component-shadow {
|
||||
box-shadow: 1px 1px 4px $shadow;
|
||||
box-shadow: 1px 1px 4px var(--red-ui-shadow);
|
||||
|
||||
}
|
||||
|
||||
@@ -241,7 +241,7 @@
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
background: $shade-color;
|
||||
background: var(--red-ui-shade-color);
|
||||
z-index: 5;
|
||||
}
|
||||
.red-ui-shade {
|
||||
|
@@ -27,10 +27,10 @@
|
||||
position: relative;
|
||||
padding: 8px 18px 0px;
|
||||
margin-bottom: 4px;
|
||||
box-shadow: 0 1px 1px 1px $shadow;
|
||||
background-color: $secondary-background;
|
||||
color: $primary-text-color;
|
||||
border: 1px solid $notification-border-default;
|
||||
box-shadow: 0 1px 1px 1px var(--red-ui-shadow);
|
||||
background-color: var(--red-ui-secondary-background);
|
||||
color: var(--red-ui-primary-text-color);
|
||||
border: 1px solid var(--red-ui-notification-border-default);
|
||||
border-left-width: 16px;
|
||||
overflow: hidden;
|
||||
.ui-dialog-buttonset {
|
||||
@@ -50,13 +50,13 @@
|
||||
}
|
||||
|
||||
.red-ui-notification-success {
|
||||
border-color: $notification-border-success;
|
||||
border-color: var(--red-ui-notification-border-success);
|
||||
}
|
||||
.red-ui-notification-warning {
|
||||
border-color: $notification-border-warning;
|
||||
border-color: var(--red-ui-notification-border-warning);
|
||||
}
|
||||
.red-ui-notification-error {
|
||||
border-color: $notification-border-error;
|
||||
border-color: var(--red-ui-notification-border-error);
|
||||
}
|
||||
|
||||
.red-ui-notification-compact {
|
||||
|
@@ -27,7 +27,7 @@
|
||||
left:0;
|
||||
padding: 0;
|
||||
box-sizing:border-box;
|
||||
background: $secondary-background;
|
||||
background: var(--red-ui-secondary-background);
|
||||
|
||||
.red-ui-editableList-container {
|
||||
border: none;
|
||||
@@ -37,27 +37,27 @@
|
||||
|
||||
li {
|
||||
// border: none;
|
||||
// border-top: 1px solid $primary-border-color;
|
||||
// border-top: 1px solid var(--red-ui-primary-border-color);
|
||||
padding: 0px;
|
||||
.red-ui-button {
|
||||
min-width: 60px;
|
||||
}
|
||||
|
||||
.disabled {
|
||||
// background: $secondary-background-inactive;//f3f3f3;
|
||||
// background: var(--red-ui-secondary-background-inactive;//f3f3f3);
|
||||
|
||||
.red-ui-palette-module-name {
|
||||
font-style: italic;
|
||||
color: $tertiary-text-color;
|
||||
color: var(--red-ui-tertiary-text-color);
|
||||
}
|
||||
.red-ui-palette-module-version {
|
||||
color: $tertiary-text-color;
|
||||
color: var(--red-ui-tertiary-text-color);
|
||||
}
|
||||
.red-ui-palette-module-errors .fa-warning {
|
||||
opacity: 0.5;
|
||||
}
|
||||
ul.red-ui-palette-module-error-list li {
|
||||
color: $tertiary-text-color;
|
||||
color: var(--red-ui-tertiary-text-color);
|
||||
}
|
||||
|
||||
|
||||
@@ -66,7 +66,7 @@
|
||||
padding: 12px 16px;
|
||||
}
|
||||
&:last-child {
|
||||
// border-bottom: 1px solid $primary-border-color;
|
||||
// border-bottom: 1px solid var(--red-ui-primary-border-color);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -79,14 +79,14 @@
|
||||
bottom:0
|
||||
}
|
||||
.red-ui-palette-editor-toolbar {
|
||||
background: $primary-background;
|
||||
background: var(--red-ui-primary-background);
|
||||
box-sizing: border-box;
|
||||
padding: 8px 10px;
|
||||
border-bottom: 1px solid $primary-border-color;
|
||||
border-bottom: 1px solid var(--red-ui-primary-border-color);
|
||||
text-align: right;
|
||||
}
|
||||
.red-ui-palette-module-shade-status {
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
}
|
||||
.red-ui-palette-module-updated {
|
||||
margin-left: 10px;
|
||||
@@ -98,7 +98,7 @@
|
||||
.red-ui-palette-module-description {
|
||||
margin-left: 20px;
|
||||
font-size: 0.9em;
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
}
|
||||
.red-ui-palette-module-link {
|
||||
}
|
||||
@@ -120,7 +120,7 @@
|
||||
}
|
||||
}
|
||||
.red-ui-palette-module-set {
|
||||
border:1px solid $secondary-border-color;
|
||||
border:1px solid var(--red-ui-secondary-border-color);
|
||||
border-radius: 0;
|
||||
padding: 5px;
|
||||
position: relative;
|
||||
@@ -138,7 +138,7 @@
|
||||
}
|
||||
|
||||
.red-ui-palette-module-type {
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
padding-left: 5px;
|
||||
font-size: 0.9em;
|
||||
@include enable-selection;
|
||||
@@ -150,8 +150,8 @@
|
||||
border-radius: 3px;
|
||||
vertical-align: middle;
|
||||
margin-right: 5px;
|
||||
background: $primary-background;
|
||||
border: 1px dashed $secondary-border-color;
|
||||
background: var(--red-ui-primary-background);
|
||||
border: 1px dashed var(--red-ui-secondary-border-color);
|
||||
}
|
||||
.red-ui-palette-module-set-button-group {
|
||||
position: absolute;
|
||||
@@ -160,35 +160,35 @@
|
||||
}
|
||||
|
||||
.red-ui-palette-module-set-disabled {
|
||||
background: $list-item-background-disabled;
|
||||
background: var(--red-ui-list-item-background-disabled);
|
||||
.red-ui-palette-module-type {
|
||||
color: $secondary-text-color-disabled-active;
|
||||
color: var(--red-ui-secondary-text-color-disabled-active);
|
||||
}
|
||||
}
|
||||
.red-ui-palette-module-more {
|
||||
padding: 0 !important;
|
||||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
background: $tab-background-inactive;
|
||||
background: var(--red-ui-tab-background-inactive);
|
||||
a {
|
||||
display: block;
|
||||
text-align: center;
|
||||
padding: 12px 8px;
|
||||
color: $text-color-code;
|
||||
color: var(--red-ui-text-color-code);
|
||||
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
background: $tab-background-hover;
|
||||
background: var(--red-ui-tab-background-hover);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
.red-ui-palette-module-meta {
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
position: relative;
|
||||
&.disabled {
|
||||
color: $secondary-text-color-disabled;
|
||||
color: var(--red-ui-secondary-text-color-disabled);
|
||||
}
|
||||
|
||||
.fa {
|
||||
@@ -198,7 +198,7 @@
|
||||
}
|
||||
}
|
||||
.red-ui-palette-module-name {
|
||||
color: $primary-text-color;
|
||||
color: var(--red-ui-primary-text-color);
|
||||
white-space: nowrap;
|
||||
@include enable-selection;
|
||||
}
|
||||
@@ -216,7 +216,7 @@
|
||||
}
|
||||
}
|
||||
.red-ui-palette-module-meta .fa-warning {
|
||||
color: $text-color-warning;
|
||||
color: var(--red-ui-text-color-warning);
|
||||
}
|
||||
ul.red-ui-palette-module-error-list {
|
||||
display: inline-block;
|
||||
@@ -264,9 +264,9 @@ button.red-ui-palette-editor-upload-button {
|
||||
right: 0;
|
||||
top: 44px;
|
||||
padding: 20px;
|
||||
background: $secondary-background;
|
||||
border-bottom: 1px $secondary-border-color solid;
|
||||
box-shadow: 1px 1px 4px $shadow;
|
||||
background: var(--red-ui-secondary-background);
|
||||
border-bottom: 1px var(--red-ui-secondary-border-color solid);
|
||||
box-shadow: 1px 1px 4px var(--red-ui-shadow);
|
||||
|
||||
.placeholder-input {
|
||||
width: calc(100% - 180px);
|
||||
|
@@ -20,7 +20,7 @@
|
||||
top: 0px;
|
||||
bottom: 0px;
|
||||
left:0px;
|
||||
background: $primary-background;
|
||||
background: var(--red-ui-primary-background);
|
||||
width: 180px;
|
||||
text-align: center;
|
||||
@include disable-selection;
|
||||
@@ -55,26 +55,26 @@
|
||||
.red-ui-palette-search {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
background: $secondary-background;
|
||||
background: var(--red-ui-secondary-background);
|
||||
text-align: center;
|
||||
height: 35px;
|
||||
padding: 3px;
|
||||
border-bottom: 1px solid $primary-border-color;
|
||||
border-bottom: 1px solid var(--red-ui-primary-border-color);
|
||||
box-sizing:border-box;
|
||||
}
|
||||
|
||||
.red-ui-palette-category {
|
||||
border-bottom: 1px solid $secondary-border-color;
|
||||
border-bottom: 1px solid var(--red-ui-secondary-border-color);
|
||||
}
|
||||
.red-ui-palette-content {
|
||||
background: $palette-content-background;
|
||||
background: var(--red-ui-palette-content-background);
|
||||
padding: 3px;
|
||||
}
|
||||
|
||||
.red-ui-palette-header {
|
||||
position: relative;
|
||||
background: $palette-header-background;
|
||||
color: $palette-header-color;
|
||||
background: var(--red-ui-palette-header-background);
|
||||
color: var(--red-ui-palette-header-color);
|
||||
cursor: pointer;
|
||||
text-align: left;
|
||||
padding: 9px;
|
||||
@@ -83,7 +83,7 @@
|
||||
overflow: hidden;
|
||||
user-select: none;
|
||||
&:hover {
|
||||
background: $palette-header-background !important;
|
||||
background: var(--red-ui-palette-header-background) !important;
|
||||
}
|
||||
}
|
||||
.red-ui-palette-header > i {
|
||||
@@ -106,7 +106,7 @@
|
||||
clear: both;
|
||||
}
|
||||
.red-ui-palette-label {
|
||||
color: $node-label-color;
|
||||
color: var(--red-ui-node-label-color);
|
||||
font-size: 13px;
|
||||
margin: 4px 0 4px 32px;
|
||||
line-height: 20px;
|
||||
@@ -121,11 +121,11 @@
|
||||
.red-ui-palette-node {
|
||||
// display: inline-block;
|
||||
cursor: move;
|
||||
background: $secondary-background;
|
||||
background: var(--red-ui-secondary-background);
|
||||
margin: 10px auto;
|
||||
height: 25px;
|
||||
border-radius: 5px;
|
||||
border: 1px solid $node-border;
|
||||
border: 1px solid var(--red-ui-node-border);
|
||||
background-position: 5% 50%;
|
||||
background-repeat: no-repeat;
|
||||
width: 120px;
|
||||
@@ -141,7 +141,7 @@
|
||||
}
|
||||
.red-ui-palette-node:hover {
|
||||
border-color: transparent;
|
||||
box-shadow: 0 0 0 2px $node-selected-color;
|
||||
box-shadow: 0 0 0 2px var(--red-ui-node-selected-color);
|
||||
}
|
||||
.red-ui-palette-port {
|
||||
position: absolute;
|
||||
@@ -149,11 +149,11 @@
|
||||
left: -5px;
|
||||
box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
background: $node-port-background;
|
||||
background: var(--red-ui-node-port-background);
|
||||
border-radius: 3px;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
border: 1px solid $node-border;
|
||||
border: 1px solid var(--red-ui-node-border);
|
||||
}
|
||||
.red-ui-palette-port-output {
|
||||
left:auto;
|
||||
@@ -161,7 +161,7 @@
|
||||
}
|
||||
|
||||
.red-ui-palette-node:hover .red-ui-palette-port {
|
||||
background-color: $node-port-background-hover;
|
||||
background-color: var(--red-ui-node-port-background-hover);
|
||||
}
|
||||
.red-ui-palette-icon-container {
|
||||
position: absolute;
|
||||
@@ -170,14 +170,14 @@
|
||||
bottom:0;
|
||||
left:0;
|
||||
width: 30px;
|
||||
border-right: 1px solid $node-icon-background-color;
|
||||
background-color: $node-icon-background-color;
|
||||
border-right: 1px solid var(--red-ui-node-icon-background-color);
|
||||
background-color: var(--red-ui-node-icon-background-color);
|
||||
}
|
||||
.red-ui-palette-icon-container-right {
|
||||
left: auto;
|
||||
right: 0;
|
||||
border-right: none;
|
||||
border-left: 1px solid $node-icon-background-color;
|
||||
border-left: 1px solid var(--red-ui-node-icon-background-color);
|
||||
}
|
||||
.red-ui-palette-icon {
|
||||
display: inline-block;
|
||||
@@ -198,7 +198,7 @@
|
||||
background: none;
|
||||
}
|
||||
.red-ui-palette-icon-fa {
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
font-size: 18px;
|
||||
}
|
||||
}
|
||||
@@ -249,12 +249,12 @@
|
||||
// width: 30px;
|
||||
// height: 25px;
|
||||
border-radius: 3px;
|
||||
border: 1px solid $node-border;
|
||||
border: 1px solid var(--red-ui-node-border);
|
||||
background-position: 5% 50%;
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
position: relative;
|
||||
background-color: $node-icon-background-color;
|
||||
background-color: var(--red-ui-node-icon-background-color);
|
||||
text-align: center;
|
||||
|
||||
.red-ui-palette-icon {
|
||||
@@ -278,7 +278,7 @@
|
||||
background: none;
|
||||
}
|
||||
.red-ui-palette-icon-fa {
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
@@ -318,5 +318,5 @@
|
||||
.red-ui-node-label {
|
||||
white-space: nowrap;
|
||||
margin-left: 4px;
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
}
|
||||
|
@@ -35,12 +35,12 @@
|
||||
|
||||
.red-ui-panels-separator {
|
||||
flex: 0 0 auto;
|
||||
border-top: 1px solid $secondary-border-color;
|
||||
border-bottom: 1px solid $secondary-border-color;
|
||||
border-top: 1px solid var(--red-ui-secondary-border-color);
|
||||
border-bottom: 1px solid var(--red-ui-secondary-border-color);
|
||||
height: 7px;
|
||||
box-sizing: border-box;
|
||||
cursor: ns-resize;
|
||||
background-color: $primary-background;
|
||||
background-color: var(--red-ui-primary-background);
|
||||
|
||||
&:before {
|
||||
content: '';
|
||||
@@ -55,7 +55,7 @@
|
||||
mask-position: center;
|
||||
-webkit-mask-repeat: no-repeat;
|
||||
mask-repeat: no-repeat;
|
||||
background-color: $grip-color;
|
||||
background-color: var(--red-ui-grip-color);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -80,14 +80,14 @@
|
||||
vertical-align: top;
|
||||
border-top: none;
|
||||
border-bottom: none;
|
||||
border-left: 1px solid $secondary-border-color;
|
||||
border-right: 1px solid $secondary-border-color;
|
||||
border-left: 1px solid var(--red-ui-secondary-border-color);
|
||||
border-right: 1px solid var(--red-ui-secondary-border-color);
|
||||
height: 100%;
|
||||
width: 7px;
|
||||
display: inline-block;
|
||||
cursor: ew-resize;
|
||||
background-color: $primary-background;
|
||||
|
||||
background-color: var(--red-ui-primary-background);
|
||||
|
||||
&:before {
|
||||
content: '';
|
||||
display: block;
|
||||
@@ -101,7 +101,7 @@
|
||||
mask-position: 50% 50%;
|
||||
-webkit-mask-repeat: no-repeat;
|
||||
mask-repeat: no-repeat;
|
||||
background-color: $grip-color;
|
||||
background-color: var(--red-ui-grip-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@@ -25,7 +25,7 @@
|
||||
color: var(--red-ui-popover-color);
|
||||
border-radius: 4px;
|
||||
z-index: 1000;
|
||||
font-family: $primary-font;
|
||||
font-family: var(--red-ui-primary-font);
|
||||
font-size: 14px;
|
||||
line-height: 1.4em;
|
||||
@include component-shadow;
|
||||
@@ -146,7 +146,7 @@
|
||||
|
||||
.red-ui-popover-key {
|
||||
font-size: 11px;
|
||||
font-family: $monospace-font;
|
||||
font-family: var(--red-ui-monospace-font);
|
||||
margin-left: 3px;
|
||||
border: 1px solid var(--red-ui-popover-color);
|
||||
border-radius:3px;
|
||||
@@ -163,42 +163,42 @@
|
||||
color: var(--red-ui-popover-color) !important;
|
||||
}
|
||||
a:focus {
|
||||
outline: 1px solid $form-input-focus-color;
|
||||
outline: 1px solid var(--red-ui-form-input-focus-color);
|
||||
}
|
||||
}
|
||||
.red-ui-popover a.red-ui-button,
|
||||
.red-ui-popover button.red-ui-button {
|
||||
&:not(.primary) {
|
||||
border-color: $popover-button-border-color;
|
||||
border-color: var(--red-ui-popover-button-border-color);
|
||||
background: var(--red-ui-popover-background);
|
||||
color: var(--red-ui-popover-color) !important;
|
||||
}
|
||||
&:not(.primary):not(.disabled):not(.ui-button-disabled):hover {
|
||||
border-color: $popover-button-border-color-hover;
|
||||
border-color: var(--red-ui-popover-button-border-color-hover);
|
||||
}
|
||||
|
||||
|
||||
&.primary {
|
||||
border-color: $popover-button-border-color;
|
||||
border-color: var(--red-ui-popover-button-border-color);
|
||||
}
|
||||
&.primary:not(.disabled):not(.ui-button-disabled):hover {
|
||||
border-color: $popover-button-border-color-hover;
|
||||
border-color: var(--red-ui-popover-button-border-color-hover);
|
||||
}
|
||||
}
|
||||
.red-ui-popover code {
|
||||
border: none;
|
||||
background: none;
|
||||
color: $tertiary-text-color;
|
||||
color: var(--red-ui-tertiary-text-color);
|
||||
}
|
||||
|
||||
|
||||
.red-ui-popover-panel {
|
||||
@include component-shadow;
|
||||
font-family: $primary-font;
|
||||
font-size: $primary-font-size;
|
||||
font-family: var(--red-ui-primary-font);
|
||||
font-size: var(--red-ui-primary-font-size);
|
||||
position: absolute;
|
||||
box-sizing: border-box;
|
||||
border: 1px solid $primary-border-color;
|
||||
background: $secondary-background;
|
||||
border: 1px solid var(--red-ui-primary-border-color);
|
||||
background: var(--red-ui-secondary-background);
|
||||
z-index: 2000;
|
||||
}
|
||||
|
@@ -29,7 +29,7 @@
|
||||
overflow-y: scroll;
|
||||
}
|
||||
.red-ui-sidebar-vc-shade {
|
||||
background: $primary-background;
|
||||
background: var(--red-ui-primary-background);
|
||||
}
|
||||
|
||||
.red-ui-projects-edit-form form {
|
||||
@@ -37,7 +37,7 @@
|
||||
.form-row {
|
||||
margin-bottom: 15px;
|
||||
label {
|
||||
color: $primary-text-color;
|
||||
color: var(--red-ui-primary-text-color);
|
||||
width: 100%;
|
||||
display: block;
|
||||
&.red-ui-projects-edit-form-inline-label {
|
||||
@@ -57,7 +57,7 @@
|
||||
|
||||
}
|
||||
.red-ui-projects-edit-form-sublabel {
|
||||
color: $tertiary-text-color;
|
||||
color: var(--red-ui-tertiary-text-color);
|
||||
text-align: right;
|
||||
margin-bottom: -15px;
|
||||
font-weight: normal;
|
||||
@@ -76,7 +76,7 @@
|
||||
font-size: 1.4em;
|
||||
padding: 10px;
|
||||
min-height: 40px;
|
||||
color: $primary-text-color;
|
||||
color: var(--red-ui-primary-text-color);
|
||||
}
|
||||
.red-ui-projects-dialog-screen-start-body {
|
||||
min-height: 300px;
|
||||
@@ -132,21 +132,21 @@
|
||||
margin-left: -1px;
|
||||
padding: 15px;
|
||||
margin-top: -15px;
|
||||
border: 1px solid $secondary-border-color;
|
||||
border: 1px solid var(--red-ui-secondary-border-color);
|
||||
border-radius: 3px;
|
||||
}
|
||||
.red-ui-projects-dialog-credentials-box-left {
|
||||
width: 220px;
|
||||
> div {
|
||||
padding: 7px 8px 3px 8px;
|
||||
border: 1px solid $secondary-border-color;
|
||||
border: 1px solid var(--red-ui-secondary-border-color);
|
||||
border-radius: 4px;
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
border-right-color: $form-background;
|
||||
border-right-color: var(--red-ui-form-background);
|
||||
&.disabled {
|
||||
border-color: $form-background;
|
||||
border-right-color:$secondary-border-color;
|
||||
border-color: var(--red-ui-form-background);
|
||||
border-right-color:var(--red-ui-secondary-border-color);
|
||||
}
|
||||
i {
|
||||
font-size: 1.4em;
|
||||
@@ -173,7 +173,7 @@
|
||||
}
|
||||
|
||||
.red-ui-projects-dialog-project-list-container {
|
||||
border: 1px solid $secondary-border-color;
|
||||
border: 1px solid var(--red-ui-secondary-border-color);
|
||||
border-radius: 2px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@@ -197,43 +197,43 @@
|
||||
.red-ui-projects-dialog-project-list-entry {
|
||||
padding: 12px 0;
|
||||
|
||||
color: $list-item-color;
|
||||
background: $list-item-background;
|
||||
border-left: 3px solid $list-item-background;
|
||||
border-right: 3px solid $list-item-background;
|
||||
color: var(--red-ui-list-item-color);
|
||||
background: var(--red-ui-list-item-background);
|
||||
border-left: 3px solid var(--red-ui-list-item-background);
|
||||
border-right: 3px solid var(--red-ui-list-item-background);
|
||||
|
||||
&.projects-list-entry-current {
|
||||
&:not(.selectable) {
|
||||
color: $form-text-color;
|
||||
background: $list-item-background-selected;
|
||||
border-left-color:$list-item-border-selected;
|
||||
border-right-color:$list-item-border-selected;
|
||||
color: var(--red-ui-form-text-color);
|
||||
background: var(--red-ui-list-item-background-selected);
|
||||
border-left-color:var(--red-ui-list-item-border-selected);
|
||||
border-right-color:var(--red-ui-list-item-border-selected);
|
||||
}
|
||||
i {
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
}
|
||||
}
|
||||
&.selectable {
|
||||
cursor: pointer;
|
||||
&:hover:not(.selected) {
|
||||
color: $form-text-color;
|
||||
background: $list-item-background-hover;
|
||||
border-left-color:$list-item-background-hover;
|
||||
border-right-color:$list-item-background-hover;
|
||||
color: var(--red-ui-form-text-color);
|
||||
background: var(--red-ui-list-item-background-hover);
|
||||
border-left-color:var(--red-ui-list-item-background-hover);
|
||||
border-right-color:var(--red-ui-list-item-background-hover);
|
||||
}
|
||||
}
|
||||
.red-ui-projects-dialog-project-list-entry-icon {
|
||||
i {
|
||||
color: $tertiary-text-color;
|
||||
color: var(--red-ui-tertiary-text-color);
|
||||
font-size: 2em;
|
||||
|
||||
}
|
||||
}
|
||||
&.selected {
|
||||
color: $form-text-color;
|
||||
background: $list-item-background-selected;
|
||||
border-left-color:$list-item-border-selected;
|
||||
border-right-color:$list-item-border-selected;
|
||||
color: var(--red-ui-form-text-color);
|
||||
background: var(--red-ui-list-item-background-selected);
|
||||
border-left-color:var(--red-ui-list-item-border-selected);
|
||||
border-right-color:var(--red-ui-list-item-border-selected);
|
||||
}
|
||||
span {
|
||||
display: inline-block;
|
||||
@@ -249,7 +249,7 @@
|
||||
float: right;
|
||||
margin-right: 20px;
|
||||
font-size: 0.9em;
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
padding-top: 4px;
|
||||
}
|
||||
.red-ui-projects-dialog-project-list-entry-tools {
|
||||
@@ -257,7 +257,7 @@
|
||||
top: 16px;
|
||||
right: 30px;
|
||||
display: none;
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
}
|
||||
&:hover {
|
||||
.red-ui-projects-dialog-project-list-entry-tools {
|
||||
@@ -274,7 +274,7 @@
|
||||
width: 1000px;
|
||||
overflow: hidden;
|
||||
padding: 5px 20px;
|
||||
background: $secondary-background;
|
||||
background: var(--red-ui-secondary-background);
|
||||
transition: left 0.4s;
|
||||
white-space: nowrap;
|
||||
> span {
|
||||
@@ -289,7 +289,7 @@
|
||||
position: relative;
|
||||
}
|
||||
.red-ui-projects-dialog-screen-create-type.red-ui-button.toggle.selected:not(.disabled):not(:disabled) {
|
||||
color: $secondary-text-color-active !important;
|
||||
color: var(--red-ui-secondary-text-color-active) !important;
|
||||
}
|
||||
.red-ui-projects-dialog-screen-input-status {
|
||||
text-align: right;
|
||||
@@ -298,7 +298,7 @@
|
||||
right: 8px;
|
||||
width: 70px;
|
||||
height: 30px;
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
}
|
||||
|
||||
.red-ui-sidebar-vc {
|
||||
@@ -338,17 +338,17 @@
|
||||
}
|
||||
.red-ui-palette-module-unused {
|
||||
& > * {
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
}
|
||||
}
|
||||
.red-ui-palette-module-unknown {
|
||||
border: 1px dashed $secondary-border-color;
|
||||
background: $secondary-background-inactive;
|
||||
border: 1px dashed var(--red-ui-secondary-border-color);
|
||||
background: var(--red-ui-secondary-background-inactive);
|
||||
}
|
||||
.red-ui-palette-module-not-installed {
|
||||
border: 1px dashed $text-color-warning;
|
||||
border: 1px dashed var(--red-ui-text-color-warning);
|
||||
i.fa-warning {
|
||||
color: $text-color-warning;
|
||||
color: var(--red-ui-text-color-warning);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -365,11 +365,11 @@
|
||||
}
|
||||
.red-ui-sidebar-vc {
|
||||
.red-ui-editableList-container {
|
||||
background: $tertiary-background;
|
||||
background: var(--red-ui-tertiary-background);
|
||||
padding: 0;
|
||||
li {
|
||||
padding:0;
|
||||
background: $secondary-background;
|
||||
background: var(--red-ui-secondary-background);
|
||||
}
|
||||
}
|
||||
.red-ui-editableList-border {
|
||||
@@ -384,7 +384,7 @@
|
||||
box-sizing: border-box;
|
||||
transition: height 0.2s ease-in-out;
|
||||
&:first-child {
|
||||
// border-bottom: 1px solid $primary-border-color;
|
||||
// border-bottom: 1px solid var(--red-ui-primary-border-color);
|
||||
}
|
||||
}
|
||||
.red-ui-sidebar-vc-merging {
|
||||
@@ -399,7 +399,7 @@
|
||||
right:0;
|
||||
height:0;
|
||||
transition: height 0.2s ease-in-out;
|
||||
background: $tertiary-background;
|
||||
background: var(--red-ui-tertiary-background);
|
||||
box-sizing: border-box;
|
||||
overflow: hidden;
|
||||
&.red-ui-sidebar-vc-slide-box-top {
|
||||
@@ -408,20 +408,20 @@
|
||||
left: auto;
|
||||
width: 100%;
|
||||
max-width: 280px;
|
||||
border-left: 1px solid $primary-border-color;
|
||||
border-right: 1px solid $primary-border-color;
|
||||
border-bottom: 1px solid $primary-border-color;
|
||||
box-shadow: 1px 1px 4px $shadow;
|
||||
border-left: 1px solid var(--red-ui-primary-border-color);
|
||||
border-right: 1px solid var(--red-ui-primary-border-color);
|
||||
border-bottom: 1px solid var(--red-ui-primary-border-color);
|
||||
box-shadow: 1px 1px 4px var(--red-ui-shadow);
|
||||
|
||||
color: $primary-text-color;
|
||||
background: $tertiary-background;
|
||||
color: var(--red-ui-primary-text-color);
|
||||
background: var(--red-ui-tertiary-background);
|
||||
padding: 10px;
|
||||
box-sizing: border-box;
|
||||
|
||||
}
|
||||
&.red-ui-sidebar-vc-slide-box-bottom {
|
||||
bottom: 0px;
|
||||
border-top: 1px solid $secondary-border-color;
|
||||
border-top: 1px solid var(--red-ui-secondary-border-color);
|
||||
}
|
||||
|
||||
textarea {
|
||||
@@ -437,15 +437,15 @@
|
||||
.red-ui-projects-branch-list {
|
||||
position: relative;
|
||||
.red-ui-searchBox-container {
|
||||
border-top: 1px solid $secondary-border-color;
|
||||
border-left: 1px solid $secondary-border-color;
|
||||
border-right: 1px solid $secondary-border-color;
|
||||
border-top: 1px solid var(--red-ui-secondary-border-color);
|
||||
border-left: 1px solid var(--red-ui-secondary-border-color);
|
||||
border-right: 1px solid var(--red-ui-secondary-border-color);
|
||||
border-top-left-radius: 2px;
|
||||
border-top-right-radius: 2px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.red-ui-editableList {
|
||||
border: 1px solid $secondary-border-color;
|
||||
border: 1px solid var(--red-ui-secondary-border-color);
|
||||
border-bottom-left-radius: 2px;
|
||||
border-bottom-right-radius: 2px;
|
||||
& > .red-ui-editableList-border {
|
||||
@@ -456,7 +456,7 @@
|
||||
padding: 0;
|
||||
li {
|
||||
padding: 0;
|
||||
background: $secondary-background;
|
||||
background: var(--red-ui-secondary-background);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -483,23 +483,23 @@
|
||||
.red-ui-sidebar-vc-branch-list-entry {
|
||||
padding: 5px 8px;
|
||||
margin: 0 1px;
|
||||
color: $list-item-color;
|
||||
background: $list-item-background;
|
||||
border-left: 2px solid $list-item-background;
|
||||
border-right: 2px solid $list-item-background;
|
||||
color: var(--red-ui-list-item-color);
|
||||
background: var(--red-ui-list-item-background);
|
||||
border-left: 2px solid var(--red-ui-list-item-background);
|
||||
border-right: 2px solid var(--red-ui-list-item-background);
|
||||
cursor: pointer;
|
||||
&.selected {
|
||||
border-left-color:$list-item-border-selected;
|
||||
border-right-color:$list-item-border-selected;
|
||||
border-left-color:var(--red-ui-list-item-border-selected);
|
||||
border-right-color:var(--red-ui-list-item-border-selected);
|
||||
}
|
||||
i { width: 16px; text-align: center}
|
||||
&.input-error {
|
||||
cursor: default;
|
||||
}
|
||||
&:not(.input-error):hover {
|
||||
background: $list-item-background-hover;
|
||||
border-left-color:$list-item-border-selected;
|
||||
border-right-color:$list-item-border-selected;
|
||||
background: var(--red-ui-list-item-background-hover);
|
||||
border-left-color:var(--red-ui-list-item-border-selected);
|
||||
border-right-color:var(--red-ui-list-item-border-selected);
|
||||
}
|
||||
span {
|
||||
margin-left: 5px;
|
||||
@@ -507,7 +507,7 @@
|
||||
span.current {
|
||||
float: right;
|
||||
font-size: 0.8em;
|
||||
color: $tertiary-text-color;
|
||||
color: var(--red-ui-tertiary-text-color);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -542,7 +542,7 @@
|
||||
}
|
||||
&.red-ui-help-info-node {
|
||||
text-align: center;
|
||||
background: $list-item-background;
|
||||
background: var(--red-ui-list-item-background);
|
||||
white-space: normal;
|
||||
height: auto;
|
||||
}
|
||||
@@ -556,63 +556,63 @@
|
||||
overflow: hidden;
|
||||
cursor: pointer;
|
||||
&:hover {
|
||||
background: $secondary-background-hover;
|
||||
background: var(--red-ui-secondary-background-hover);
|
||||
}
|
||||
}
|
||||
.red-ui-sidebar-vc-commit-more {
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
text-align: center;
|
||||
padding: 10px;
|
||||
font-style: italic;
|
||||
}
|
||||
.red-ui-sidebar-vc-commit-sha {
|
||||
float: right;
|
||||
font-family: $monospace-font;
|
||||
color: $vcCommitShaColor;
|
||||
font-family: var(--red-ui-monospace-font);
|
||||
color: var(--red-ui-vcCommitShaColor);
|
||||
display: inline-block;
|
||||
font-size: 0.85em;
|
||||
margin-left: 5px;
|
||||
}
|
||||
.red-ui-sidebar-vc-commit-subject {
|
||||
color: $primary-text-color;
|
||||
color: var(--red-ui-primary-text-color);
|
||||
}
|
||||
.red-ui-sidebar-vc-commit-refs {
|
||||
min-height: 22px;
|
||||
}
|
||||
.red-ui-sidebar-vc-commit-ref {
|
||||
color: $tertiary-text-color;
|
||||
color: var(--red-ui-tertiary-text-color);
|
||||
font-size: 0.7em;
|
||||
border: 1px solid $tertiary-border-color;
|
||||
border: 1px solid var(--red-ui-tertiary-border-color);
|
||||
border-radius: 10px;
|
||||
padding: 2px 5px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
.red-ui-sidebar-vc-commit-date {
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
font-size: 0.85em;
|
||||
}
|
||||
.red-ui-sidebar-vc-commit-user {
|
||||
float: right;
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
font-size: 0.85em;
|
||||
}
|
||||
.red-ui-sidebar-vc-commit-head {
|
||||
}
|
||||
.red-ui-sidebar-vc-change-header {
|
||||
color: $primary-text-color;
|
||||
background: $tertiary-background;
|
||||
color: var(--red-ui-primary-text-color);
|
||||
background: var(--red-ui-tertiary-background);
|
||||
padding: 4px 10px;
|
||||
height: 30px;
|
||||
box-sizing: border-box;
|
||||
border-top: 1px solid $secondary-border-color;
|
||||
border-bottom: 1px solid $secondary-border-color;
|
||||
border-top: 1px solid var(--red-ui-secondary-border-color);
|
||||
border-bottom: 1px solid var(--red-ui-secondary-border-color);
|
||||
i {
|
||||
transition: all 0.2s ease-in-out;
|
||||
}
|
||||
}
|
||||
.red-ui-sidebar-vc-repo-toolbar {
|
||||
color: $primary-text-color;
|
||||
background: $tertiary-background;
|
||||
color: var(--red-ui-primary-text-color);
|
||||
background: var(--red-ui-tertiary-background);
|
||||
padding: 10px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
@@ -637,7 +637,7 @@
|
||||
.red-ui-projects-file-listing-container > .red-ui-editableList > .red-ui-editableList-border {
|
||||
border-radius: 0;
|
||||
border: none;
|
||||
border-top: 1px solid $secondary-border-color;
|
||||
border-top: 1px solid var(--red-ui-secondary-border-color);
|
||||
|
||||
}
|
||||
.red-ui-editableList-container .red-ui-projects-dialog-file-list {
|
||||
@@ -654,39 +654,39 @@
|
||||
}
|
||||
.red-ui-projects-dialog-file-list-entry {
|
||||
padding: 3px 0;
|
||||
border-left: 2px solid $list-item-background;
|
||||
border-right: 2px solid $list-item-background;
|
||||
background: $list-item-background;
|
||||
border-left: 2px solid var(--red-ui-list-item-background);
|
||||
border-right: 2px solid var(--red-ui-list-item-background);
|
||||
background: var(--red-ui-list-item-background);
|
||||
|
||||
&.projects-list-entry-current {
|
||||
&:not(.selectable) {
|
||||
background: $list-item-background-selected;
|
||||
background: var(--red-ui-list-item-background-selected);
|
||||
}
|
||||
i {
|
||||
color: $secondary-text-color-selected;
|
||||
color: var(--red-ui-secondary-text-color-selected);
|
||||
}
|
||||
}
|
||||
&.selectable {
|
||||
cursor: pointer;
|
||||
&:hover {
|
||||
background: $list-item-background-hover;
|
||||
border-left-color:$list-item-border-selected;
|
||||
border-right-color:$list-item-border-selected;
|
||||
background: var(--red-ui-list-item-background-hover);
|
||||
border-left-color:var(--red-ui-list-item-border-selected);
|
||||
border-right-color:var(--red-ui-list-item-border-selected);
|
||||
}
|
||||
}
|
||||
&.unselectable {
|
||||
color: $secondary-text-color-disabled;
|
||||
color: var(--red-ui-secondary-text-color-disabled);
|
||||
}
|
||||
|
||||
i {
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
width: 16px;
|
||||
text-align: center;
|
||||
}
|
||||
&.selected {
|
||||
background: $list-item-background-selected;
|
||||
border-left-color:$list-item-border-selected;
|
||||
border-right-color:$list-item-border-selected;
|
||||
background: var(--red-ui-list-item-background-selected);
|
||||
border-left-color:var(--red-ui-list-item-border-selected);
|
||||
border-right-color:var(--red-ui-list-item-border-selected);
|
||||
}
|
||||
span {
|
||||
display: inline-block;
|
||||
@@ -696,7 +696,7 @@
|
||||
margin: 0 10px 0 0px;
|
||||
|
||||
.fa-angle-right {
|
||||
color: $primary-text-color;
|
||||
color: var(--red-ui-primary-text-color);
|
||||
transition: all 0.2s ease-in-out;
|
||||
|
||||
}
|
||||
@@ -747,7 +747,7 @@ div.red-ui-projects-dialog-ssh-public-key {
|
||||
padding: 10px 5px;
|
||||
cursor: pointer;
|
||||
&:hover {
|
||||
background: $list-item-background-hover;
|
||||
background: var(--red-ui-list-item-background-hover);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -756,7 +756,7 @@ div.red-ui-projects-dialog-ssh-public-key {
|
||||
position: relative;
|
||||
.red-ui-editableList-container {
|
||||
padding: 1px;
|
||||
background: $tertiary-background;
|
||||
background: var(--red-ui-tertiary-background);
|
||||
li:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
@@ -775,7 +775,7 @@ div.red-ui-projects-dialog-ssh-public-key {
|
||||
text-align: center;
|
||||
min-width: 30px;
|
||||
vertical-align: top;
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
}
|
||||
.entry-name {
|
||||
min-width: 250px;
|
||||
@@ -784,7 +784,7 @@ div.red-ui-projects-dialog-ssh-public-key {
|
||||
font-weight: bold;
|
||||
}
|
||||
.entry-detail {
|
||||
color: $tertiary-text-color;
|
||||
color: var(--red-ui-tertiary-text-color);
|
||||
font-size: 0.9em;
|
||||
}
|
||||
|
||||
@@ -802,9 +802,9 @@ div.red-ui-projects-dialog-ssh-public-key {
|
||||
position: relative;
|
||||
margin-top: 10px;
|
||||
margin-bottom: 20px;
|
||||
background: $secondary-background;
|
||||
background: var(--red-ui-secondary-background);
|
||||
border-radius: 4px;
|
||||
border: 1px solid $secondary-border-color;
|
||||
border: 1px solid var(--red-ui-secondary-border-color);
|
||||
.red-ui-projects-edit-form-sublabel {
|
||||
margin-top: -8px !important;
|
||||
margin-right: 50px;
|
||||
@@ -819,7 +819,7 @@ div.red-ui-projects-dialog-ssh-public-key {
|
||||
|
||||
.red-ui-projects-dialog-list-dialog-header {
|
||||
font-weight: bold;
|
||||
background: $primary-background;
|
||||
background: var(--red-ui-primary-background);
|
||||
margin-top: 0 !important;
|
||||
padding: 5px 10px;
|
||||
margin-bottom: 10px;
|
||||
@@ -830,5 +830,5 @@ div.red-ui-projects-dialog-ssh-public-key {
|
||||
padding: 8px 20px 20px;
|
||||
}
|
||||
.red-ui-settings-section-description {
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
}
|
||||
|
@@ -15,8 +15,8 @@
|
||||
**/
|
||||
|
||||
.red-ui-editor-radial-menu {
|
||||
font-size: $primary-font-size;
|
||||
font-family: $primary-font;
|
||||
font-size: var(--red-ui-primary-font-size);
|
||||
font-family: var(--red-ui-primary-font);
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left:0;
|
||||
@@ -29,8 +29,8 @@
|
||||
border-radius: 80px;
|
||||
width: 160px;
|
||||
height: 160px;
|
||||
background: $shadow;
|
||||
border: 1px solid $primary-border-color;
|
||||
background: var(--red-ui-shadow);
|
||||
border: 1px solid var(--red-ui-primary-border-color);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -39,20 +39,20 @@
|
||||
border-radius: 20px;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
background: $secondary-background;
|
||||
border: 2px solid $primary-border-color;
|
||||
background: var(--red-ui-secondary-background);
|
||||
border: 2px solid var(--red-ui-primary-border-color);
|
||||
text-align: center;
|
||||
line-height:50px;
|
||||
|
||||
&.selected {
|
||||
background: $workspace-button-background-hover;
|
||||
background: var(--red-ui-workspace-button-background-hover);
|
||||
}
|
||||
}
|
||||
|
||||
.red-ui-editor-radial-menu-opt-disabled {
|
||||
border-color: $tertiary-border-color;
|
||||
color: $tertiary-border-color;
|
||||
border-color: var(--red-ui-tertiary-border-color);
|
||||
color: var(--red-ui-tertiary-border-color);
|
||||
}
|
||||
.red-ui-editor-radial-menu-opt-active {
|
||||
background: $secondary-background-hover;
|
||||
background: var(--red-ui-secondary-background-hover);
|
||||
}
|
||||
|
@@ -22,9 +22,9 @@
|
||||
left: 50%;
|
||||
margin-left: -250px;
|
||||
top: 0px;
|
||||
border: 1px solid $primary-border-color;
|
||||
box-shadow: 0 0 10px $shadow;
|
||||
background: $secondary-background;
|
||||
border: 1px solid var(--red-ui-primary-border-color);
|
||||
box-shadow: 0 0 10px var(--red-ui-shadow);
|
||||
background: var(--red-ui-secondary-background);
|
||||
|
||||
.red-ui-searchBox-container {
|
||||
display: inline-block;
|
||||
@@ -47,17 +47,17 @@
|
||||
.red-ui-search-container {
|
||||
border-top-left-radius: 5px;
|
||||
border-top-right-radius: 5px;
|
||||
border: 1px dashed $primary-border-color;
|
||||
border: 1px dashed var(--red-ui-primary-border-color);
|
||||
border-bottom: none;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
}
|
||||
.red-ui-search-results-container {
|
||||
display: none;
|
||||
height: 150px;
|
||||
height: 195px;
|
||||
.red-ui-editableList-container {
|
||||
border: 1px dashed $primary-border-color;
|
||||
border-top: 1px solid $secondary-border-color;
|
||||
border: 1px dashed var(--red-ui-primary-border-color);
|
||||
border-top: 1px solid var(--red-ui-secondary-border-color);
|
||||
}
|
||||
}
|
||||
.red-ui-search-result {
|
||||
@@ -73,7 +73,7 @@
|
||||
}
|
||||
}
|
||||
.red-ui-search-result-separator {
|
||||
border-bottom: 3px solid $secondary-border-color;
|
||||
border-bottom: 3px solid var(--red-ui-secondary-border-color);
|
||||
}
|
||||
.red-ui-search-result-node {
|
||||
position: relative;
|
||||
@@ -89,7 +89,7 @@
|
||||
height: 7px;
|
||||
top:4px;
|
||||
left:-4px;
|
||||
background: $node-port-background;
|
||||
background: var(--red-ui-node-port-background);
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.red-ui-search-result-node-output{
|
||||
@@ -107,26 +107,26 @@
|
||||
margin-left:8px;
|
||||
}
|
||||
.red-ui-search-result-node-label {
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
}
|
||||
}
|
||||
|
||||
.red-ui-search-container {
|
||||
padding: 3px;
|
||||
background: $form-input-background;
|
||||
border-bottom: 1px solid $secondary-border-color;
|
||||
background: var(--red-ui-form-input-background);
|
||||
border-bottom: 1px solid var(--red-ui-secondary-border-color);
|
||||
}
|
||||
.red-ui-search-results-container {
|
||||
position:relative;
|
||||
height: 300px;
|
||||
padding: 5px;
|
||||
background: $primary-background;
|
||||
background: var(--red-ui-primary-background);
|
||||
.red-ui-search-results-list {
|
||||
|
||||
}
|
||||
.red-ui-editableList-container {
|
||||
padding: 0;
|
||||
background: $primary-background;
|
||||
background: var(--red-ui-primary-background);
|
||||
li {
|
||||
padding: 0;
|
||||
}
|
||||
@@ -137,21 +137,21 @@
|
||||
display: flex;
|
||||
align-items: start;
|
||||
cursor: pointer;
|
||||
color: $list-item-color;
|
||||
background: $list-item-background;
|
||||
border-left: 3px solid $list-item-background;
|
||||
border-right: 3px solid $list-item-background;
|
||||
color: var(--red-ui-list-item-color);
|
||||
background: var(--red-ui-list-item-background);
|
||||
border-left: 3px solid var(--red-ui-list-item-background);
|
||||
border-right: 3px solid var(--red-ui-list-item-background);
|
||||
li.selected & {
|
||||
background: $list-item-background-selected;
|
||||
border-left-color: $list-item-border-selected;
|
||||
border-right-color: $list-item-border-selected;
|
||||
background: var(--red-ui-list-item-background-selected);
|
||||
border-left-color: var(--red-ui-list-item-border-selected);
|
||||
border-right-color: var(--red-ui-list-item-border-selected);
|
||||
}
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
color: $form-text-color;
|
||||
background: $list-item-background-hover;
|
||||
border-left-color:$list-item-background-hover;
|
||||
border-right-color:$list-item-background-hover;
|
||||
color: var(--red-ui-form-text-color);
|
||||
background: var(--red-ui-list-item-background-hover);
|
||||
border-left-color:var(--red-ui-list-item-background-hover);
|
||||
border-right-color:var(--red-ui-list-item-background-hover);
|
||||
}
|
||||
&:after {
|
||||
content: "";
|
||||
@@ -165,7 +165,7 @@
|
||||
float:left;
|
||||
height: 25px;
|
||||
border-radius: 3px;
|
||||
border: 1px solid $node-border;
|
||||
border: 1px solid var(--red-ui-node-border);
|
||||
background-position: 5% 50%;
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
@@ -182,28 +182,28 @@
|
||||
flex-grow: 1;
|
||||
}
|
||||
.red-ui-search-result-node-label {
|
||||
color: $primary-text-color;
|
||||
color: var(--red-ui-primary-text-color);
|
||||
}
|
||||
.red-ui-search-result-node-type {
|
||||
font-style: italic;
|
||||
font-size: 0.9em;
|
||||
color: $tertiary-text-color;
|
||||
color: var(--red-ui-tertiary-text-color);
|
||||
}
|
||||
.red-ui-search-result-node-flow {
|
||||
float:right;
|
||||
font-size: 0.8em;
|
||||
color: $tertiary-text-color;
|
||||
color: var(--red-ui-tertiary-text-color);
|
||||
}
|
||||
.red-ui-search-result-node-id {
|
||||
display:none;
|
||||
font-size: 0.8em;
|
||||
color: $tertiary-text-color;
|
||||
color: var(--red-ui-tertiary-text-color);
|
||||
}
|
||||
.red-ui-search-empty {
|
||||
padding: 10px;
|
||||
text-align: center;
|
||||
font-style: italic;
|
||||
color: $form-placeholder-color;
|
||||
color: var(--red-ui-form-placeholder-color);
|
||||
}
|
||||
.red-ui-search-history {
|
||||
button {
|
||||
@@ -229,12 +229,12 @@
|
||||
}
|
||||
|
||||
.red-ui-search-result-action {
|
||||
color: $primary-text-color;
|
||||
color: var(--red-ui-primary-text-color);
|
||||
}
|
||||
.red-ui-search-result-action-key {
|
||||
position: absolute;
|
||||
top: 9px;
|
||||
right: 0;
|
||||
margin-right: 10px;
|
||||
color: $tertiary-text-color;
|
||||
color: var(--red-ui-tertiary-text-color);
|
||||
}
|
||||
|
@@ -20,7 +20,7 @@
|
||||
right: 0px;
|
||||
bottom: 0px;
|
||||
width: 315px;
|
||||
background: $primary-background;
|
||||
background: var(--red-ui-primary-background);
|
||||
box-sizing: border-box;
|
||||
z-index: 10;
|
||||
@include component-border;
|
||||
@@ -32,7 +32,7 @@
|
||||
|
||||
#red-ui-sidebar-content {
|
||||
position: absolute;
|
||||
background: $secondary-background;
|
||||
background: var(--red-ui-secondary-background);
|
||||
top: 35px;
|
||||
right: 0;
|
||||
bottom: 25px;
|
||||
@@ -47,7 +47,7 @@
|
||||
bottom:10px;
|
||||
width: 7px;
|
||||
// z-index: 11;
|
||||
background-color: $primary-background;
|
||||
background-color: var(--red-ui-primary-background);
|
||||
cursor: col-resize;
|
||||
|
||||
&:before {
|
||||
@@ -63,7 +63,7 @@
|
||||
mask-position: 50% 50%;
|
||||
-webkit-mask-repeat: no-repeat;
|
||||
mask-repeat: no-repeat;
|
||||
background-color: $grip-color;
|
||||
background-color: var(--red-ui-grip-color);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -82,11 +82,11 @@
|
||||
|
||||
.sidebar-header, /* Deprecated -> red-ui-sidebar-header */
|
||||
.red-ui-sidebar-header {
|
||||
color: $primary-text-color;
|
||||
color: var(--red-ui-primary-text-color);
|
||||
text-align: right;
|
||||
padding: 8px 10px;
|
||||
background: $primary-background;
|
||||
border-bottom: 1px solid $secondary-border-color;
|
||||
background: var(--red-ui-primary-background);
|
||||
border-bottom: 1px solid var(--red-ui-secondary-border-color);
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
@@ -138,9 +138,9 @@ button.red-ui-sidebar-header-button-toggle {
|
||||
top: calc(50% - 26px);
|
||||
|
||||
padding:15px 8px;
|
||||
border:1px solid $primary-border-color;
|
||||
background:$primary-background;
|
||||
color: $secondary-text-color;
|
||||
border:1px solid var(--red-ui-primary-border-color);
|
||||
background:var(--red-ui-primary-background);
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
18
packages/node_modules/@node-red/editor-client/src/sass/style-custom-theme.scss
vendored
Normal file
18
packages/node_modules/@node-red/editor-client/src/sass/style-custom-theme.scss
vendored
Normal file
@@ -0,0 +1,18 @@
|
||||
/**
|
||||
* 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.
|
||||
**/
|
||||
|
||||
@import "colors";
|
||||
@import "variables";
|
@@ -16,7 +16,7 @@
|
||||
|
||||
.red-ui-sidebar-node-config {
|
||||
position: relative;
|
||||
background: $secondary-background;
|
||||
background: var(--red-ui-secondary-background);
|
||||
height: 100%;
|
||||
overflow-y:auto;
|
||||
@include disable-selection;
|
||||
@@ -37,14 +37,14 @@ ul.red-ui-sidebar-node-config-list {
|
||||
}
|
||||
.red-ui-palette-node {
|
||||
overflow: hidden;
|
||||
|
||||
cursor: default;
|
||||
&.selected {
|
||||
border-color: transparent;
|
||||
box-shadow: 0 0 0 2px $node-selected-color;
|
||||
box-shadow: 0 0 0 2px var(--red-ui-node-selected-color);
|
||||
}
|
||||
&.highlighted {
|
||||
border-color: transparent;
|
||||
outline: dashed $node-selected-color 4px;
|
||||
outline: dashed var(--red-ui-node-selected-color) 4px;
|
||||
}
|
||||
}
|
||||
.red-ui-palette-label {
|
||||
@@ -58,7 +58,7 @@ ul.red-ui-sidebar-node-config-list {
|
||||
.red-ui-palette-icon-container {
|
||||
font-size: 12px;
|
||||
line-height: 30px;
|
||||
background-color: $node-icon-background-color;
|
||||
background-color: var(--red-ui-node-icon-background-color);
|
||||
border-top-right-radius: 4px;
|
||||
border-bottom-right-radius: 4px;
|
||||
a {
|
||||
@@ -67,10 +67,11 @@ ul.red-ui-sidebar-node-config-list {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
color: $node-port-label-color;
|
||||
color: var(--red-ui-node-port-label-color);
|
||||
cursor: pointer;
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
background: $node-port-background-hover;
|
||||
background: var(--red-ui-node-port-background-hover);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -78,12 +79,12 @@ ul.red-ui-sidebar-node-config-list {
|
||||
.red-ui-palette-node-config {
|
||||
width: 160px;
|
||||
height: 30px;
|
||||
background: $node-config-background;
|
||||
color: $primary-text-color;
|
||||
background: var(--red-ui-node-config-background);
|
||||
color: var(--red-ui-primary-text-color);
|
||||
cursor: pointer;
|
||||
}
|
||||
ul.red-ui-sidebar-node-config-list li.red-ui-palette-node-config-type {
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
text-align: right;
|
||||
padding-right: 3px;
|
||||
&:not(:first-child) {
|
||||
@@ -91,21 +92,21 @@ ul.red-ui-sidebar-node-config-list li.red-ui-palette-node-config-type {
|
||||
}
|
||||
}
|
||||
.red-ui-palette-node-config-none {
|
||||
color: $tertiary-text-color;
|
||||
color: var(--red-ui-tertiary-text-color);
|
||||
text-align:right;
|
||||
padding-right: 3px;
|
||||
}
|
||||
.red-ui-palette-node-config-unused,.red-ui-palette-node-config-disabled {
|
||||
border-color: $primary-border-color;
|
||||
background: $secondary-background-inactive;
|
||||
border-color: var(--red-ui-primary-border-color);
|
||||
background: var(--red-ui-secondary-background-inactive);
|
||||
border-style: dashed;
|
||||
color: $tertiary-text-color;
|
||||
color: var(--red-ui-tertiary-text-color);
|
||||
}
|
||||
.red-ui-palette-node-config-disabled {
|
||||
opacity: 0.6;
|
||||
font-style: italic;
|
||||
i {
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
@@ -116,8 +117,8 @@ ul.red-ui-sidebar-node-config-list li.red-ui-palette-node-config-type {
|
||||
height: 38px;
|
||||
line-height: 38px;
|
||||
padding: 0 8px;
|
||||
background: $palette-header-background;
|
||||
background: var(--red-ui-palette-header-background);
|
||||
font-size: 0.8em;
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
font-weight: normal;
|
||||
}
|
||||
|
@@ -63,12 +63,12 @@
|
||||
.red-ui-sidebar-context-updated {
|
||||
text-align: right;
|
||||
font-size: 11px;
|
||||
color: $tertiary-text-color;
|
||||
color: var(--red-ui-tertiary-text-color);
|
||||
padding: 1px 3px;
|
||||
}
|
||||
.red-ui-sidebar-context-property-storename {
|
||||
display: block;
|
||||
font-size: 0.8em;
|
||||
font-style: italic;
|
||||
color: $tertiary-text-color;
|
||||
color: var(--red-ui-tertiary-text-color);
|
||||
}
|
||||
|
@@ -2,7 +2,7 @@
|
||||
// height: calc(100% - 39px);
|
||||
}
|
||||
.red-ui-help-search {
|
||||
border-bottom: 1px solid $secondary-border-color;
|
||||
border-bottom: 1px solid var(--red-ui-secondary-border-color);
|
||||
}
|
||||
|
||||
.red-ui-sidebar-help-toc {
|
||||
|
@@ -32,7 +32,7 @@
|
||||
display: inline-block;
|
||||
margin-left: 5px;
|
||||
}
|
||||
border-bottom: 1px solid $secondary-border-color;
|
||||
border-bottom: 1px solid var(--red-ui-secondary-border-color);
|
||||
}
|
||||
table.red-ui-info-table {
|
||||
font-size: 14px;
|
||||
@@ -40,8 +40,8 @@ table.red-ui-info-table {
|
||||
width: 100%;
|
||||
}
|
||||
table.red-ui-info-table tr:not(.blank) {
|
||||
border-top: 1px solid $secondary-border-color;
|
||||
border-bottom: 1px solid $secondary-border-color;
|
||||
border-top: 1px solid var(--red-ui-secondary-border-color);
|
||||
border-bottom: 1px solid var(--red-ui-secondary-border-color);
|
||||
}
|
||||
.red-ui-help-property-expand {
|
||||
font-size: 0.8em;
|
||||
@@ -57,7 +57,7 @@ table.red-ui-info-table tr.blank {
|
||||
th {
|
||||
text-align: left;
|
||||
font-weight: 500;
|
||||
color: $primary-text-color;
|
||||
color: var(--red-ui-primary-text-color);
|
||||
padding: 6px 3px 3px;
|
||||
}
|
||||
>* {
|
||||
@@ -69,9 +69,9 @@ table.red-ui-info-table tr.blank {
|
||||
|
||||
a {
|
||||
display: block;
|
||||
color: $primary-text-color;
|
||||
color: var(--red-ui-primary-text-color);
|
||||
&:hover,&:focus {
|
||||
color: $primary-text-color;
|
||||
color: var(--red-ui-primary-text-color);
|
||||
text-decoration: none;
|
||||
}
|
||||
&:not(.expanded) {
|
||||
@@ -103,36 +103,36 @@ table.red-ui-info-table tr.blank {
|
||||
}
|
||||
.red-ui-help-info-none {
|
||||
font-style: italic;
|
||||
color: $tertiary-text-color;
|
||||
color: var(--red-ui-tertiary-text-color);
|
||||
}
|
||||
table.red-ui-info-table tr:not(.blank) td:first-child{
|
||||
color: $header-text-color;
|
||||
color: var(--red-ui-header-text-color);
|
||||
vertical-align: top;
|
||||
width: 90px;
|
||||
padding: 3px 3px 3px 6px;
|
||||
background:$tertiary-background;
|
||||
border-right: 1px solid $secondary-border-color;
|
||||
background:var(--red-ui-tertiary-background);
|
||||
border-right: 1px solid var(--red-ui-secondary-border-color);
|
||||
}
|
||||
table.red-ui-info-table tr:not(.blank) td:last-child{
|
||||
padding: 3px 3px 3px 6px;
|
||||
color: $primary-text-color;
|
||||
color: var(--red-ui-primary-text-color);
|
||||
overflow-y: hidden;
|
||||
}
|
||||
div.red-ui-info-table {
|
||||
margin: 5px;
|
||||
}
|
||||
.red-ui-help {
|
||||
font-size: $primary-font-size;
|
||||
font-size: var(--red-ui-primary-font-size);
|
||||
line-height: 1.5em;
|
||||
|
||||
a {
|
||||
color: $text-color-link;
|
||||
color: var(--red-ui-text-color-link);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a:hover,
|
||||
a:focus {
|
||||
color: $text-color-link;
|
||||
color: var(--red-ui-text-color-link);
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
@@ -143,7 +143,7 @@ div.red-ui-info-table {
|
||||
line-height: 1.3em;
|
||||
margin: 8px auto;
|
||||
&.red-ui-help-title {
|
||||
border-bottom: 1px solid $tertiary-border-color;
|
||||
border-bottom: 1px solid var(--red-ui-tertiary-border-color);
|
||||
}
|
||||
}
|
||||
h2 {
|
||||
@@ -168,24 +168,24 @@ div.red-ui-info-table {
|
||||
& > span > p:first-child {
|
||||
}
|
||||
dl.message-properties {
|
||||
border: 1px solid $secondary-border-color;
|
||||
border: 1px solid var(--red-ui-secondary-border-color);
|
||||
border-radius: 2px;
|
||||
|
||||
margin: 5px auto 10px;
|
||||
&>dt {
|
||||
padding: 0px 3px 2px 3px;
|
||||
font-family: $monospace-font;
|
||||
font-family: var(--red-ui-monospace-font);
|
||||
font-weight: normal;
|
||||
margin: 5px 3px 1px;
|
||||
color: $text-color-code;
|
||||
color: var(--red-ui-text-color-code);
|
||||
white-space: nowrap;
|
||||
&.optional {
|
||||
font-style: italic;
|
||||
|
||||
}
|
||||
.property-type {
|
||||
font-family: $primary-font;
|
||||
color: $primary-text-color;
|
||||
font-family: var(--red-ui-primary-font);
|
||||
color: var(--red-ui-primary-text-color);
|
||||
font-style: italic;
|
||||
font-size: 11px;
|
||||
float: right;
|
||||
@@ -204,7 +204,7 @@ div.red-ui-info-table {
|
||||
ol.node-ports {
|
||||
margin: 0;
|
||||
li {
|
||||
border: 1px solid $secondary-border-color;
|
||||
border: 1px solid var(--red-ui-secondary-border-color);
|
||||
border-radius: 2px;
|
||||
list-style-position: inside;
|
||||
padding: 3px;
|
||||
@@ -224,7 +224,7 @@ div.red-ui-info-table {
|
||||
transition: transform 0.2s ease-in-out;
|
||||
margin-right: 4px;
|
||||
}
|
||||
color: $header-text-color;
|
||||
color: var(--red-ui-header-text-color);
|
||||
&:hover, &:focus {
|
||||
text-decoration: none;
|
||||
}
|
||||
@@ -242,7 +242,7 @@ div.red-ui-info-table {
|
||||
overflow : hidden;
|
||||
}
|
||||
table thead tr {
|
||||
background-color: var(--red-ui-primary-background); //$primary-text-color;
|
||||
background-color: var(--red-ui-primary-background); //var(--red-ui-primary-text-color);
|
||||
border-bottom: 1px solid var(--red-ui-secondary-border-color);
|
||||
color: var(--red-ui-header-text-color);
|
||||
text-align: left;
|
||||
@@ -252,7 +252,7 @@ div.red-ui-info-table {
|
||||
padding: 6px 8px;
|
||||
}
|
||||
table tbody tr:nth-of-type(even) {
|
||||
background-color: var(--red-ui-tertiary-background); //$primary-background;
|
||||
background-color: var(--red-ui-tertiary-background); //var(--red-ui-primary-background);
|
||||
}
|
||||
}
|
||||
.red-ui-sidebar-info-stack {
|
||||
@@ -273,10 +273,10 @@ div.red-ui-info-table {
|
||||
height: 0;
|
||||
transition: height 0.2s, padding 0.2s;
|
||||
box-sizing: border-box;
|
||||
border-top: 1px solid $secondary-border-color;
|
||||
background-color: $secondary-background;
|
||||
border-top: 1px solid var(--red-ui-secondary-border-color);
|
||||
background-color: var(--red-ui-secondary-background);
|
||||
padding: 0;
|
||||
box-shadow: 0 5px 20px 0px $shadow;
|
||||
box-shadow: 0 5px 20px 0px var(--red-ui-shadow);
|
||||
overflow-y: auto;
|
||||
}
|
||||
.red-ui-sidebar-info.show-tips {
|
||||
@@ -305,7 +305,7 @@ div.red-ui-info-table {
|
||||
font-size: 16px;
|
||||
text-align: center;
|
||||
line-height: 1.9em;
|
||||
color : $tertiary-text-color;
|
||||
color : var(--red-ui-tertiary-text-color);
|
||||
@include disable-selection;
|
||||
cursor: default;
|
||||
}
|
||||
@@ -314,14 +314,14 @@ div.red-ui-info-table {
|
||||
top: 4px;
|
||||
right: 6px;
|
||||
a {
|
||||
color: $secondary-text-color;
|
||||
border-color: $secondary-border-color !important;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
border-color: var(--red-ui-secondary-border-color) !important;
|
||||
margin-left: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
.node-info-property-config-node {
|
||||
border: 1px solid $secondary-border-color;
|
||||
border: 1px solid var(--red-ui-secondary-border-color);
|
||||
border-radius: 4px;
|
||||
padding: 2px 4px 2px;
|
||||
}
|
||||
@@ -346,7 +346,7 @@ div.red-ui-info-table {
|
||||
}
|
||||
|
||||
.red-ui-info-outline-project {
|
||||
border-bottom: 1px solid $secondary-border-color;
|
||||
border-bottom: 1px solid var(--red-ui-secondary-border-color);
|
||||
}
|
||||
}
|
||||
.red-ui-info-outline,
|
||||
@@ -380,13 +380,13 @@ div.red-ui-info-table {
|
||||
background: none;
|
||||
}
|
||||
.red-ui-palette-icon-fa {
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
font-size: 18px;
|
||||
}
|
||||
}
|
||||
&.red-ui-info-outline-item-empty {
|
||||
font-style: italic;
|
||||
color: $form-placeholder-color;
|
||||
color: var(--red-ui-form-placeholder-color);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -414,7 +414,7 @@ div.red-ui-info-table {
|
||||
white-space: nowrap;
|
||||
}
|
||||
.red-ui-search-result-node-label {
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -439,16 +439,16 @@ div.red-ui-info-table {
|
||||
right: 1px;
|
||||
padding: 1px 2px 0 1px;
|
||||
text-align: right;
|
||||
background: $list-item-background;
|
||||
background: var(--red-ui-list-item-background);
|
||||
|
||||
.red-ui-treeList-label:hover & {
|
||||
background: $list-item-background-hover;
|
||||
background: var(--red-ui-list-item-background-hover);
|
||||
}
|
||||
.red-ui-treeList-label.focus & {
|
||||
background: $list-item-background-hover;
|
||||
background: var(--red-ui-list-item-background-hover);
|
||||
}
|
||||
.red-ui-treeList-label.selected & {
|
||||
background: $list-item-background-selected;
|
||||
background: var(--red-ui-list-item-background-selected);
|
||||
}
|
||||
|
||||
|
||||
@@ -510,7 +510,7 @@ div.red-ui-info-table {
|
||||
}
|
||||
.red-ui-info-outline-item-label {
|
||||
font-style: italic;
|
||||
color: $secondary-text-color-disabled;
|
||||
color: var(--red-ui-secondary-text-color-disabled);
|
||||
}
|
||||
.red-ui-icons-flow {
|
||||
opacity: 0.4;
|
||||
@@ -538,7 +538,7 @@ div.red-ui-info-table {
|
||||
-webkit-mask-size: contain;
|
||||
mask-repeat: no-repeat;
|
||||
-webkit-mask-repeat: no-repeat;
|
||||
background-color: $icons-flow-color;
|
||||
background-color: var(--red-ui-icons-flow-color);
|
||||
// filter: brightness(2.5);
|
||||
}
|
||||
|
||||
@@ -549,8 +549,8 @@ div.red-ui-info-table {
|
||||
text-align: left;
|
||||
// padding-left: 9px;
|
||||
// box-sizing: border-box;
|
||||
// background: $palette-header-background;
|
||||
// border-bottom: 1px solid $secondary-border-color;
|
||||
// background: var(--red-ui-palette-header-background);
|
||||
// border-bottom: 1px solid var(--red-ui-secondary-border-color);
|
||||
|
||||
.red-ui-searchBox-container {
|
||||
position: absolute;
|
||||
@@ -558,7 +558,7 @@ div.red-ui-info-table {
|
||||
right: 8px;
|
||||
width: calc(100% - 130px);
|
||||
max-width: 250px;
|
||||
background: $palette-header-background;
|
||||
background: var(--red-ui-palette-header-background);
|
||||
}
|
||||
|
||||
}
|
||||
|
@@ -16,7 +16,7 @@
|
||||
|
||||
.red-ui-tabs {
|
||||
position: relative;
|
||||
background: $tab-background;
|
||||
background: var(--red-ui-tab-background);
|
||||
overflow: hidden;
|
||||
height: 35px;
|
||||
box-sizing: border-box;
|
||||
@@ -39,18 +39,18 @@
|
||||
display: block;
|
||||
height: 35px;
|
||||
box-sizing:border-box;
|
||||
border-bottom: 1px solid $primary-border-color;
|
||||
border-bottom: 1px solid var(--red-ui-primary-border-color);
|
||||
white-space: nowrap;
|
||||
@include disable-selection;
|
||||
|
||||
li {
|
||||
box-sizing: border-box;
|
||||
display: inline-block;
|
||||
border-left: 1px solid $primary-border-color;
|
||||
border-top: 1px solid $primary-border-color;
|
||||
border-right: 1px solid $primary-border-color;
|
||||
border-bottom: 1px solid $primary-border-color;
|
||||
background: $tab-background-inactive;
|
||||
border-left: 1px solid var(--red-ui-primary-border-color);
|
||||
border-top: 1px solid var(--red-ui-primary-border-color);
|
||||
border-right: 1px solid var(--red-ui-primary-border-color);
|
||||
border-bottom: 1px solid var(--red-ui-primary-border-color);
|
||||
background: var(--red-ui-tab-background-inactive);
|
||||
margin: 3px 3px 0 3px;
|
||||
height: 32px;
|
||||
line-height: 29px;
|
||||
@@ -73,7 +73,7 @@
|
||||
padding-left: 12px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
color: $tab-text-color-inactive;
|
||||
color: var(--red-ui-tab-text-color-inactive);
|
||||
}
|
||||
a:hover {
|
||||
text-decoration: none;
|
||||
@@ -83,27 +83,27 @@
|
||||
}
|
||||
|
||||
&:not(.active) a:hover+a.red-ui-tab-close {
|
||||
background: $tab-background-hover;
|
||||
background: var(--red-ui-tab-background-hover);
|
||||
}
|
||||
&.highlighted {
|
||||
box-shadow: 0px 0px 4px 2px $node-selected-color;
|
||||
border: dashed 1px $node-selected-color;
|
||||
box-shadow: 0px 0px 4px 2px var(--red-ui-node-selected-color);
|
||||
border: dashed 1px var(--red-ui-node-selected-color);
|
||||
}
|
||||
&.active {
|
||||
background: $tab-background-active;
|
||||
background: var(--red-ui-tab-background-active);
|
||||
font-weight: bold;
|
||||
border-bottom: 1px solid $tab-background-active;
|
||||
border-bottom: 1px solid var(--red-ui-tab-background-active);
|
||||
z-index: 2;
|
||||
|
||||
a {
|
||||
color: $tab-text-color-active;
|
||||
color: var(--red-ui-tab-text-color-active);
|
||||
}
|
||||
a.red-ui-tab-close {
|
||||
color: $workspace-button-color;
|
||||
background: $tab-background-active;
|
||||
color: var(--red-ui-workspace-button-color);
|
||||
background: var(--red-ui-tab-background-active);
|
||||
&:hover {
|
||||
background: $workspace-button-background-hover !important;
|
||||
color: $workspace-button-color-hover;
|
||||
background: var(--red-ui-workspace-button-background-hover) !important;
|
||||
color: var(--red-ui-workspace-button-color-hover);
|
||||
}
|
||||
}
|
||||
img.red-ui-tab-icon {
|
||||
@@ -111,24 +111,24 @@
|
||||
}
|
||||
|
||||
.red-ui-tabs-fade {
|
||||
background-image: linear-gradient(to right, change-color($tab-background-active, $alpha: 0.001), $tab-background-active);
|
||||
background-image: linear-gradient(to right, var(--red-ui-tab-background-active-alpha), var(--red-ui-tab-background-active));
|
||||
}
|
||||
|
||||
}
|
||||
&.selected {
|
||||
&:not(.active) {
|
||||
background: $tab-background-selected;
|
||||
background: var(--red-ui-tab-background-selected);
|
||||
.red-ui-tabs-fade {
|
||||
background-image: linear-gradient(to right, change-color($tab-background-selected, $alpha: 0.001), $tab-background-selected);
|
||||
background-image: linear-gradient(to right, var(--red-ui-tab-background-selected-alpha), var(--red-ui-tab-background-selected));
|
||||
}
|
||||
.red-ui-tabs-badge-selected {
|
||||
background: $tab-background-selected;
|
||||
background: var(--red-ui-tab-background-selected);
|
||||
}
|
||||
}
|
||||
font-weight: bold;
|
||||
.red-ui-tabs-badge-selected {
|
||||
display: inline;
|
||||
background: $tab-background;
|
||||
background: var(--red-ui-tab-background);
|
||||
}
|
||||
.red-ui-tabs-badge-changed {
|
||||
display: none;
|
||||
@@ -136,10 +136,10 @@
|
||||
|
||||
}
|
||||
&:not(.active) a:hover {
|
||||
color: $workspace-button-color-hover;
|
||||
background: $tab-background-hover;
|
||||
color: var(--red-ui-workspace-button-color-hover);
|
||||
background: var(--red-ui-tab-background-hover);
|
||||
&+.red-ui-tabs-fade {
|
||||
background-image: linear-gradient(to right, change-color($tab-background-hover, $alpha: 0.001), $tab-background-hover);
|
||||
background-image: linear-gradient(to right, var(--red-ui-tab-background-hover-alpha), var(--red-ui-tab-background-hover));
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -182,9 +182,9 @@
|
||||
&.red-ui-tabs-vertical {
|
||||
box-sizing: border-box;
|
||||
height: 100%;
|
||||
border-right: 1px solid $primary-border-color;
|
||||
border-right: 1px solid var(--red-ui-primary-border-color);
|
||||
margin: 0;
|
||||
background: $tertiary-background;
|
||||
background: var(--red-ui-tertiary-background);
|
||||
overflow: visible;
|
||||
|
||||
.red-ui-tabs-scroll-container {
|
||||
@@ -203,13 +203,13 @@
|
||||
display: block;
|
||||
margin: 0;
|
||||
border: none;
|
||||
border-right: 1px solid $primary-border-color;
|
||||
border-right: 1px solid var(--red-ui-primary-border-color);
|
||||
height: auto;
|
||||
&:not(:first-child) {
|
||||
border-top: 1px solid $secondary-border-color;
|
||||
border-top: 1px solid var(--red-ui-secondary-border-color);
|
||||
}
|
||||
&:last-child {
|
||||
border-bottom: 1px solid $secondary-border-color;
|
||||
border-bottom: 1px solid var(--red-ui-secondary-border-color);
|
||||
}
|
||||
|
||||
a.red-ui-tab-label {
|
||||
@@ -217,7 +217,7 @@
|
||||
}
|
||||
|
||||
&.active {
|
||||
border-right: 1px solid $tab-background-active;
|
||||
border-right: 1px solid var(--red-ui-tab-background-active);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -238,8 +238,8 @@
|
||||
top: 0;
|
||||
right: 0;
|
||||
height: 35px;
|
||||
background: $tab-background;
|
||||
border-bottom: 1px solid $primary-border-color;
|
||||
background: var(--red-ui-tab-background);
|
||||
border-bottom: 1px solid var(--red-ui-primary-border-color);
|
||||
z-index: 2;
|
||||
|
||||
a {
|
||||
@@ -261,8 +261,8 @@
|
||||
top: 0;
|
||||
right: 0;
|
||||
height: 35px;
|
||||
background: $tab-background;
|
||||
border-bottom: 1px solid $primary-border-color;
|
||||
background: var(--red-ui-tab-background);
|
||||
border-bottom: 1px solid var(--red-ui-primary-border-color);
|
||||
z-index: 2;
|
||||
a {
|
||||
@include workspace-button-toggle;
|
||||
@@ -272,7 +272,7 @@
|
||||
margin: 4px 3px 3px;
|
||||
z-index: 2;
|
||||
&.red-ui-tab-link-button-menu {
|
||||
border-color: $tab-background;
|
||||
border-color: var(--red-ui-tab-background);
|
||||
}
|
||||
&:not(.single):not(.selected) {
|
||||
margin-top: 4px;
|
||||
@@ -286,27 +286,27 @@
|
||||
height: 35px;
|
||||
width: 21px;
|
||||
display: block;
|
||||
color: $workspace-button-color;
|
||||
color: var(--red-ui-workspace-button-color);
|
||||
font-size: 22px;
|
||||
text-align: center;
|
||||
margin:0;
|
||||
border-left: none;
|
||||
border-right: none;
|
||||
border-top: none;
|
||||
border-bottom: 1px solid $primary-border-color;
|
||||
border-bottom: 1px solid var(--red-ui-primary-border-color);
|
||||
line-height: 34px;
|
||||
}
|
||||
}
|
||||
.red-ui-tab-scroll-left {
|
||||
left:0;
|
||||
a {
|
||||
border-right: 1px solid $primary-border-color;
|
||||
border-right: 1px solid var(--red-ui-primary-border-color);
|
||||
}
|
||||
}
|
||||
.red-ui-tab-scroll-right {
|
||||
right: 0px;
|
||||
a {
|
||||
border-left: 1px solid $primary-border-color;
|
||||
border-left: 1px solid var(--red-ui-primary-border-color);
|
||||
}
|
||||
|
||||
}
|
||||
@@ -341,7 +341,7 @@
|
||||
top: 0;
|
||||
right: 0;
|
||||
width: 15px;
|
||||
background-image: linear-gradient(to right, change-color($tab-background-inactive, $alpha: 0.001), $tab-background-inactive);
|
||||
background-image: linear-gradient(to right, var(--red-ui-tab-background-inactive-alpha), var(--red-ui-tab-background-inactive));
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
@@ -365,7 +365,7 @@ i.red-ui-tab-icon {
|
||||
mask-position: center;
|
||||
-webkit-mask-repeat: no-repeat;
|
||||
mask-repeat: no-repeat;
|
||||
background-color: $tab-icon-color;
|
||||
background-color: var(--red-ui-tab-icon-color);
|
||||
}
|
||||
}
|
||||
.red-ui-tabs-badges {
|
||||
@@ -379,7 +379,7 @@ i.red-ui-tab-icon {
|
||||
line-height: 28px;
|
||||
text-align: center;
|
||||
padding:0px;
|
||||
color: $tab-badge-color;
|
||||
color: var(--red-ui-tab-badge-color);
|
||||
}
|
||||
|
||||
.red-ui-tabs-badges i {
|
||||
@@ -415,7 +415,7 @@ i.red-ui-tab-icon {
|
||||
}
|
||||
.red-ui-tab-close {
|
||||
display: none;
|
||||
background: $tab-background-inactive;
|
||||
background: var(--red-ui-tab-background-inactive);
|
||||
opacity: 0.8;
|
||||
position: absolute;
|
||||
right: 0px;
|
||||
@@ -425,10 +425,10 @@ i.red-ui-tab-icon {
|
||||
line-height: 28px;
|
||||
text-align: center;
|
||||
padding: 0px;
|
||||
color: $workspace-button-color;
|
||||
color: var(--red-ui-workspace-button-color);
|
||||
&:hover {
|
||||
background: $workspace-button-background-hover !important;
|
||||
color: $workspace-button-color-hover;
|
||||
background: var(--red-ui-workspace-button-background-hover) !important;
|
||||
color: var(--red-ui-workspace-button-color-hover);
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
@@ -97,7 +97,7 @@
|
||||
color: var(--red-ui-primary-text-color) !important;
|
||||
}
|
||||
&:not(.primary):not(.disabled):not(.ui-button-disabled):hover {
|
||||
border-color: $popover-button-border-color-hover;
|
||||
border-color: var(--red-ui-popover-button-border-color-hover);
|
||||
}
|
||||
}
|
||||
|
||||
|
@@ -16,7 +16,7 @@
|
||||
.red-ui-checkboxSet {
|
||||
width: 15px;
|
||||
display: inline-block;
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
cursor: pointer;
|
||||
input {
|
||||
display:none !important;
|
||||
@@ -24,6 +24,6 @@
|
||||
|
||||
&.disabled {
|
||||
pointer-events: none;
|
||||
color: $secondary-text-color-disabled;
|
||||
color: var(--red-ui-secondary-text-color-disabled);
|
||||
}
|
||||
}
|
||||
|
@@ -14,10 +14,10 @@
|
||||
* limitations under the License.
|
||||
**/
|
||||
.red-ui-editableList-border {
|
||||
border: 1px solid $form-input-border-color;
|
||||
border: 1px solid var(--red-ui-form-input-border-color);
|
||||
border-radius: 4px;
|
||||
.red-ui-editableList-header {
|
||||
border-bottom: 1px solid $form-input-border-color;
|
||||
border-bottom: 1px solid var(--red-ui-form-input-border-color);
|
||||
padding: 2px 16px 2px 4px;
|
||||
font-size: 0.9em;
|
||||
}
|
||||
@@ -32,22 +32,22 @@
|
||||
margin: 0;
|
||||
}
|
||||
.red-ui-editabelList-item-placeholder {
|
||||
border: 2px dashed $secondary-border-color !important;
|
||||
border: 2px dashed var(--red-ui-secondary-border-color) !important;
|
||||
}
|
||||
li {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
background: $secondary-background;
|
||||
background: var(--red-ui-secondary-background);
|
||||
margin:0;
|
||||
padding:8px 0px;
|
||||
border-bottom: 1px solid $secondary-border-color;
|
||||
border-bottom: 1px solid var(--red-ui-secondary-border-color);
|
||||
min-height: 20px;
|
||||
.red-ui-editableList-item-handle {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 2px;
|
||||
margin-top: -7px;
|
||||
color: $tertiary-text-color;
|
||||
color: var(--red-ui-tertiary-text-color);
|
||||
cursor: move;
|
||||
}
|
||||
.red-ui-editableList-item-remove {
|
||||
@@ -57,7 +57,7 @@
|
||||
margin-top: -9px;
|
||||
}
|
||||
&.ui-sortable-helper {
|
||||
border-top: 1px solid $secondary-border-color;
|
||||
border-top: 1px solid var(--red-ui-secondary-border-color);
|
||||
}
|
||||
//.red-ui-editableList-item-content { outline: 1px solid red}
|
||||
|
||||
@@ -68,7 +68,7 @@
|
||||
margin-right: 28px;
|
||||
}
|
||||
&.red-ui-editableList-item-deleting {
|
||||
background: $secondary-background-inactive;
|
||||
background: var(--red-ui-secondary-background-inactive);
|
||||
}
|
||||
}
|
||||
|
||||
|
@@ -21,9 +21,9 @@
|
||||
margin: 0;
|
||||
white-space: nowrap;
|
||||
border: none;
|
||||
background: $secondary-background;
|
||||
background: var(--red-ui-secondary-background);
|
||||
&:hover {
|
||||
background: $secondary-background-hover;
|
||||
background: var(--red-ui-secondary-background-hover);
|
||||
}
|
||||
|
||||
i.fa-angle-right {
|
||||
@@ -44,12 +44,12 @@
|
||||
}
|
||||
}
|
||||
.red-ui-editableList-item-content.disabled {
|
||||
color: $secondary-text-color-disabled;
|
||||
color: var(--red-ui-secondary-text-color-disabled);
|
||||
}
|
||||
&.red-ui-editableList-section-header {
|
||||
background: $primary-background;
|
||||
background: var(--red-ui-primary-background);
|
||||
.red-ui-editableList-item-content.disabled {
|
||||
color: $secondary-text-color-disabled;
|
||||
color: var(--red-ui-secondary-text-color-disabled);
|
||||
}
|
||||
}
|
||||
|
||||
|
@@ -21,7 +21,7 @@
|
||||
position: absolute;
|
||||
top: 9px;
|
||||
font-size: 10px;
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
}
|
||||
i.fa-search {
|
||||
pointer-events: none;
|
||||
@@ -41,8 +41,8 @@
|
||||
margin: 0;
|
||||
}
|
||||
a.red-ui-searchBox-opts:hover {
|
||||
color: $workspace-button-color-hover;
|
||||
background: $workspace-button-background-hover;
|
||||
color: var(--red-ui-workspace-button-color-hover);
|
||||
background: var(--red-ui-workspace-button-background-hover);
|
||||
}
|
||||
input.red-ui-searchBox-input {
|
||||
border-radius: 0;
|
||||
@@ -76,8 +76,8 @@
|
||||
position: absolute;
|
||||
right: 18px;
|
||||
top: 4px;
|
||||
background: $primary-background;
|
||||
color: $secondary-text-color;
|
||||
background: var(--red-ui-primary-background);
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
padding: 1px 8px;
|
||||
font-size: 9px;
|
||||
border-radius: 4px;
|
||||
@@ -97,12 +97,12 @@
|
||||
.red-ui-searchBox-compact {
|
||||
|
||||
input:focus.red-ui-searchBox-input {
|
||||
outline: 1px solid $form-input-focus-color;
|
||||
outline: 1px solid var(--red-ui-form-input-focus-color);
|
||||
}
|
||||
|
||||
|
||||
input.red-ui-searchBox-input,input:focus.red-ui-searchBox-input {
|
||||
border: 1px solid $secondary-border-color;
|
||||
border: 1px solid var(--red-ui-secondary-border-color);
|
||||
border-radius: 3px;
|
||||
font-size: 12px;
|
||||
height: 26px;
|
||||
|
@@ -15,9 +15,9 @@
|
||||
**/
|
||||
|
||||
.red-ui-stack {
|
||||
background: $secondary-background;
|
||||
background: var(--red-ui-secondary-background);
|
||||
.red-ui-palette-category {
|
||||
background: $secondary-background;
|
||||
background: var(--red-ui-secondary-background);
|
||||
|
||||
&:last-child {
|
||||
border-bottom: none;
|
||||
|
@@ -24,9 +24,9 @@
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
background: $tertiary-background;
|
||||
background: var(--red-ui-tertiary-background);
|
||||
|
||||
border: 1px solid $form-input-border-color;
|
||||
border: 1px solid var(--red-ui-form-input-border-color);
|
||||
border-radius: 4px;
|
||||
|
||||
box-sizing: border-box;
|
||||
@@ -71,7 +71,7 @@
|
||||
padding: 6px 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: $list-item-color;
|
||||
color: var(--red-ui-list-item-color);
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
vertical-align: middle;
|
||||
@@ -79,26 +79,26 @@
|
||||
position: relative;
|
||||
|
||||
&:hover, &:hover .red-ui-treeList-sublabel-text {
|
||||
background: $list-item-background-hover;
|
||||
color: $list-item-color;
|
||||
background: var(--red-ui-list-item-background-hover);
|
||||
color: var(--red-ui-list-item-color);
|
||||
text-decoration: none;
|
||||
}
|
||||
&:focus, &:focus .red-ui-treeList-sublabel-text {
|
||||
background: $list-item-background-hover;
|
||||
background: var(--red-ui-list-item-background-hover);
|
||||
outline: none;
|
||||
color: $list-item-color;
|
||||
color: var(--red-ui-list-item-color);
|
||||
text-decoration: none;
|
||||
}
|
||||
&.focus, &.focus .red-ui-treeList-sublabel-text {
|
||||
background: $list-item-background-hover;
|
||||
outline: 1px solid $form-input-focus-color !important;
|
||||
background: var(--red-ui-list-item-background-hover);
|
||||
outline: 1px solid var(--red-ui-form-input-focus-color) !important;
|
||||
outline-offset: -1px;
|
||||
color: $list-item-color;
|
||||
color: var(--red-ui-list-item-color);
|
||||
}
|
||||
&.selected, &.selected .red-ui-treeList-sublabel-text {
|
||||
background: $list-item-background-selected;
|
||||
background: var(--red-ui-list-item-background-selected);
|
||||
outline: none;
|
||||
color: $list-item-color;
|
||||
color: var(--red-ui-list-item-color);
|
||||
}
|
||||
|
||||
input.red-ui-treeList-checkbox,
|
||||
@@ -121,9 +121,9 @@
|
||||
padding: 0 10px 0 5px;
|
||||
line-height: 32px;
|
||||
font-size: 0.9em;
|
||||
color: $list-item-secondary-color;
|
||||
color: var(--red-ui-list-item-secondary-color);
|
||||
position: absolute;
|
||||
background: $list-item-background;
|
||||
background: var(--red-ui-list-item-background);
|
||||
}
|
||||
|
||||
|
||||
@@ -143,5 +143,5 @@
|
||||
mask-position: 50% 50%;
|
||||
-webkit-mask-repeat: no-repeat;
|
||||
mask-repeat: no-repeat;
|
||||
background-color: $spinner-color;
|
||||
background-color: var(--red-ui-spinner-color);
|
||||
}
|
||||
|
@@ -15,7 +15,7 @@
|
||||
**/
|
||||
|
||||
.red-ui-typedInput-container {
|
||||
border: 1px solid $form-input-border-color;
|
||||
border: 1px solid var(--red-ui-form-input-border-color);
|
||||
border-radius: 5px;
|
||||
height: 34px;
|
||||
line-height: 14px;
|
||||
@@ -28,7 +28,7 @@
|
||||
position: relative;
|
||||
&[disabled] {
|
||||
input, button {
|
||||
background: $secondary-background-inactive;
|
||||
background: var(--red-ui-secondary-background-inactive);
|
||||
pointer-events: none;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
@@ -50,7 +50,7 @@
|
||||
}
|
||||
|
||||
&.red-ui-typedInput-focus:not(.input-error) {
|
||||
border-color: $form-input-focus-color !important;
|
||||
border-color: var(--red-ui-form-input-focus-color) !important;
|
||||
}
|
||||
.red-ui-typedInput-value-label {
|
||||
flex-grow: 1;
|
||||
@@ -61,42 +61,42 @@
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
.red-ui-typedInput-value-label-inactive {
|
||||
background: $secondary-background-disabled;
|
||||
color: $secondary-text-color-disabled;
|
||||
background: var(--red-ui-secondary-background-disabled);
|
||||
color: var(--red-ui-secondary-text-color-disabled);
|
||||
}
|
||||
}
|
||||
}
|
||||
.red-ui-typedInput-options {
|
||||
@include component-shadow;
|
||||
font-family: $primary-font;
|
||||
font-size: $primary-font-size;
|
||||
font-family: var(--red-ui-primary-font);
|
||||
font-size: var(--red-ui-primary-font-size);
|
||||
|
||||
position: absolute;
|
||||
max-height: 350px;
|
||||
overflow-y: auto;
|
||||
border: 1px solid $primary-border-color;
|
||||
border: 1px solid var(--red-ui-primary-border-color);
|
||||
box-sizing: border-box;
|
||||
background: $secondary-background;
|
||||
background: var(--red-ui-secondary-background);
|
||||
white-space: nowrap;
|
||||
z-index: 2000;
|
||||
a {
|
||||
padding: 6px 18px 6px 6px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-bottom: 1px solid $secondary-border-color;
|
||||
color: $form-text-color;
|
||||
border-bottom: 1px solid var(--red-ui-secondary-border-color);
|
||||
color: var(--red-ui-form-text-color);
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
background: $workspace-button-background-hover;
|
||||
background: var(--red-ui-workspace-button-background-hover);
|
||||
}
|
||||
&:focus {
|
||||
text-decoration: none;
|
||||
background: $workspace-button-background-active;
|
||||
background: var(--red-ui-workspace-button-background-active);
|
||||
outline: none;
|
||||
}
|
||||
&:active {
|
||||
text-decoration: none;
|
||||
background: $workspace-button-background-active;
|
||||
background: var(--red-ui-workspace-button-background-active);
|
||||
}
|
||||
input[type="checkbox"] {
|
||||
margin: 0 6px 0 0;
|
||||
@@ -111,7 +111,7 @@
|
||||
mask-position: center;
|
||||
-webkit-mask-repeat: no-repeat;
|
||||
mask-repeat: no-repeat;
|
||||
background-color: $primary-text-color;
|
||||
background-color: var(--red-ui-primary-text-color);
|
||||
height: 14px;
|
||||
width: 12px;
|
||||
}
|
||||
@@ -128,11 +128,11 @@ button.red-ui-typedInput-option-trigger
|
||||
border-top-left-radius: 4px;
|
||||
border-bottom-left-radius: 4px;
|
||||
padding: 0 1px 0 5px;
|
||||
background: $form-button-background;
|
||||
background: var(--red-ui-form-button-background);
|
||||
height: 32px;
|
||||
line-height: 30px;
|
||||
vertical-align: middle;
|
||||
color: $form-text-color;
|
||||
color: var(--red-ui-form-text-color);
|
||||
white-space: nowrap;
|
||||
i.red-ui-typedInput-icon {
|
||||
margin-left: 1px;
|
||||
@@ -142,7 +142,7 @@ button.red-ui-typedInput-option-trigger
|
||||
&.disabled {
|
||||
cursor: default;
|
||||
> i.red-ui-typedInput-icon {
|
||||
color: $secondary-text-color-disabled;
|
||||
color: var(--red-ui-secondary-text-color-disabled);
|
||||
}
|
||||
}
|
||||
.red-ui-typedInput-type-label,.red-ui-typedInput-option-label {
|
||||
@@ -161,21 +161,21 @@ button.red-ui-typedInput-option-trigger
|
||||
mask-position: center;
|
||||
-webkit-mask-repeat: no-repeat;
|
||||
mask-repeat: no-repeat;
|
||||
background-color: $primary-text-color;
|
||||
background-color: var(--red-ui-primary-text-color);
|
||||
}
|
||||
}
|
||||
|
||||
&:not(.disabled):hover {
|
||||
text-decoration: none;
|
||||
background: $workspace-button-background-hover;
|
||||
background: var(--red-ui-workspace-button-background-hover);
|
||||
}
|
||||
&:focus {
|
||||
text-decoration: none;
|
||||
outline: none;
|
||||
box-shadow: inset 0 0 0 1px $form-input-focus-color;
|
||||
box-shadow: inset 0 0 0 1px var(--red-ui-form-input-focus-color);
|
||||
}
|
||||
&:not(.disabled):active {
|
||||
background: $workspace-button-background-active;
|
||||
background: var(--red-ui-workspace-button-background-active);
|
||||
text-decoration: none;
|
||||
}
|
||||
&.red-ui-typedInput-full-width {
|
||||
@@ -208,8 +208,8 @@ button.red-ui-typedInput-option-trigger {
|
||||
line-height: 32px;
|
||||
display: inline-flex;
|
||||
.red-ui-typedInput-option-label {
|
||||
background:$form-button-background;
|
||||
color: $form-text-color;
|
||||
background:var(--red-ui-form-button-background);
|
||||
color: var(--red-ui-form-text-color);
|
||||
flex-grow: 1;
|
||||
padding: 0 0 0 8px;
|
||||
display:inline-block;
|
||||
@@ -231,6 +231,6 @@ button.red-ui-typedInput-option-trigger {
|
||||
box-shadow: none;
|
||||
}
|
||||
&:focus .red-ui-typedInput-option-caret {
|
||||
box-shadow: inset 0 0 0 1px $form-input-focus-color;
|
||||
box-shadow: inset 0 0 0 1px var(--red-ui-form-input-focus-color);
|
||||
}
|
||||
}
|
||||
|
@@ -20,7 +20,7 @@
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 120px;
|
||||
background: $tertiary-background;
|
||||
background: var(--red-ui-tertiary-background);
|
||||
}
|
||||
.red-ui-settings-tabs-content {
|
||||
position: absolute;
|
||||
@@ -30,7 +30,7 @@
|
||||
bottom: 0;
|
||||
padding: 0;
|
||||
h3:not(:first-child) {
|
||||
border-top: 1px solid $secondary-border-color;
|
||||
border-top: 1px solid var(--red-ui-secondary-border-color);
|
||||
margin-top: 15px;
|
||||
margin-bottom: 10px;
|
||||
padding-top: 20px;
|
||||
|
@@ -1,4 +1,5 @@
|
||||
:root {
|
||||
|
||||
--red-ui-primary-font: #{$primary-font};
|
||||
--red-ui-primary-font-size: #{$primary-font-size};
|
||||
--red-ui-monospace-font: #{$monospace-font};
|
||||
@@ -40,7 +41,6 @@
|
||||
--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};
|
||||
@@ -50,20 +50,38 @@
|
||||
--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-color-focus: #{$form-input-focus-color};
|
||||
--red-ui-form-input-border-color-selected: #{$form-input-border-selected-color};
|
||||
--red-ui-form-input-border-color-error: #{$form-input-border-error-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};
|
||||
@@ -72,8 +90,120 @@
|
||||
--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-link-port-background: #{$node-link-port-background};
|
||||
|
||||
--red-ui-node-status-error-border: #{$node-status-error-border};
|
||||
@@ -81,18 +211,87 @@
|
||||
--red-ui-node-status-changed-border: #{$node-status-changed-border};
|
||||
--red-ui-node-status-changed-background: #{$node-status-changed-background};
|
||||
|
||||
--red-ui-node-border: #{$node-border};
|
||||
--red-ui-node-port-background:#{$node-port-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-label-color: #{$node-label-color};
|
||||
--red-ui-node-selected-color: #{$node-selected-color};
|
||||
--red-ui-port-selected-color: #{$port-selected-color};
|
||||
|
||||
--red-ui-popover-background: #{$popover-background};
|
||||
--red-ui-popover-border: #{$popover-border};
|
||||
--red-ui-popover-color: #{$popover-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};
|
||||
|
||||
}
|
||||
|
@@ -47,12 +47,12 @@
|
||||
}
|
||||
|
||||
.red-ui-workspace-chart-background {
|
||||
fill: $view-background;
|
||||
fill: var(--red-ui-view-background);
|
||||
}
|
||||
.red-ui-workspace-chart-grid line {
|
||||
fill: none;
|
||||
shape-rendering: crispEdges;
|
||||
stroke: $view-grid-color;
|
||||
stroke: var(--red-ui-view-grid-color);
|
||||
stroke-width: 1px;
|
||||
}
|
||||
.red-ui-workspace-select-mode {
|
||||
@@ -94,11 +94,11 @@
|
||||
|
||||
a {
|
||||
font-style: italic;
|
||||
color: $tab-text-color-disabled-inactive !important;
|
||||
color: var(--red-ui-tab-text-color-disabled-inactive) !important;
|
||||
}
|
||||
&.active a {
|
||||
font-weight: normal;
|
||||
color: $tab-text-color-disabled-active !important;
|
||||
color: var(--red-ui-tab-text-color-disabled-active) !important;
|
||||
}
|
||||
.red-ui-workspace-disabled-icon {
|
||||
display: inline;
|
||||
@@ -112,17 +112,17 @@
|
||||
bottom: 0;
|
||||
right:0;
|
||||
z-index: 101;
|
||||
border-left: 1px solid $primary-border-color;
|
||||
border-top: 1px solid $primary-border-color;
|
||||
background: $view-navigator-background;
|
||||
box-shadow: -1px 0 3px $shadow;
|
||||
border-left: 1px solid var(--red-ui-primary-border-color);
|
||||
border-top: 1px solid var(--red-ui-primary-border-color);
|
||||
background: var(--red-ui-view-navigator-background);
|
||||
box-shadow: -1px 0 3px var(--red-ui-shadow);
|
||||
}
|
||||
.red-ui-navigator-border {
|
||||
stroke-dasharray: 5,5;
|
||||
pointer-events: none;
|
||||
stroke: $secondary-border-color;
|
||||
stroke: var(--red-ui-secondary-border-color);
|
||||
stroke-width: 1;
|
||||
fill: $view-background;
|
||||
fill: var(--red-ui-view-background);
|
||||
}
|
||||
|
||||
.red-ui-component-footer {
|
||||
@@ -182,7 +182,7 @@ button.red-ui-footer-button-toggle {
|
||||
|
||||
#red-ui-loading-progress {
|
||||
position: absolute;
|
||||
background: $primary-background;
|
||||
background: var(--red-ui-primary-background);
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
@@ -196,7 +196,7 @@ button.red-ui-footer-button-toggle {
|
||||
width: 300px;
|
||||
height:80px;
|
||||
text-align: center;
|
||||
color: $secondary-text-color;
|
||||
color: var(--red-ui-secondary-text-color);
|
||||
|
||||
}
|
||||
}
|
||||
@@ -204,13 +204,13 @@ button.red-ui-footer-button-toggle {
|
||||
box-sizing: border-box;
|
||||
width: 300px;
|
||||
height: 30px;
|
||||
border: 2px solid $primary-border-color;
|
||||
border: 2px solid var(--red-ui-primary-border-color);
|
||||
border-radius: 4px;
|
||||
|
||||
> span {
|
||||
display: block;
|
||||
height: 100%;
|
||||
background: $secondary-border-color;
|
||||
background: var(--red-ui-secondary-border-color);
|
||||
transition: width 0.2s;
|
||||
width: 10%;
|
||||
}
|
||||
|
@@ -17,7 +17,7 @@
|
||||
|
||||
#red-ui-workspace-toolbar {
|
||||
display: none;
|
||||
color: $workspace-button-color;
|
||||
color: var(--red-ui-workspace-button-color);
|
||||
font-size: 12px;
|
||||
line-height: 18px;
|
||||
position: absolute;
|
||||
@@ -27,8 +27,8 @@
|
||||
padding: 7px;
|
||||
height: 40px;
|
||||
box-sizing: border-box;
|
||||
background: $secondary-background;
|
||||
border-bottom: 1px solid $secondary-border-color;
|
||||
background: var(--red-ui-secondary-background);
|
||||
border-bottom: 1px solid var(--red-ui-secondary-border-color);
|
||||
white-space: nowrap;
|
||||
transition: right 0.2s ease;
|
||||
overflow: hidden;
|
||||
@@ -61,23 +61,23 @@
|
||||
}
|
||||
}
|
||||
.button.active {
|
||||
background: $workspace-button-background-active;
|
||||
background: var(--red-ui-workspace-button-background-active);
|
||||
cursor: default;
|
||||
}
|
||||
}
|
||||
|
||||
.spinner-value {
|
||||
width: 25px;
|
||||
color: $workspace-button-color;
|
||||
color: var(--red-ui-workspace-button-color);
|
||||
padding: 0 5px;
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
border-top: 1px solid $secondary-border-color;
|
||||
border-bottom: 1px solid $secondary-border-color;
|
||||
border-top: 1px solid var(--red-ui-secondary-border-color);
|
||||
border-bottom: 1px solid var(--red-ui-secondary-border-color);
|
||||
margin: 0;
|
||||
height: 24px;
|
||||
font-size: 12px;
|
||||
background: $form-input-background;
|
||||
background: var(--red-ui-form-input-background);
|
||||
line-height: 22px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
229
packages/node_modules/@node-red/editor-client/src/tours/2.1/welcome.js
vendored
Normal file
229
packages/node_modules/@node-red/editor-client/src/tours/2.1/welcome.js
vendored
Normal file
@@ -0,0 +1,229 @@
|
||||
export default {
|
||||
version: "2.1.0",
|
||||
steps: [
|
||||
{
|
||||
titleIcon: "fa fa-map-o",
|
||||
title: {
|
||||
"en-US": "Welcome to Node-RED 2.1!",
|
||||
"ja": "Node-RED 2.1へようこそ!"
|
||||
},
|
||||
description: {
|
||||
"en-US": "Let's take a moment to discover the new features in this release.",
|
||||
"ja": "本リリースの新機能を見つけてみましょう。"
|
||||
}
|
||||
},
|
||||
{
|
||||
title: {
|
||||
"en-US": "A new Tour Guide",
|
||||
"ja": "新しいツアーガイド"
|
||||
},
|
||||
description: {
|
||||
"en-US": "<p>First, as you've already found, we now have this tour of new features. We'll only show the tour the first time you open the editor for each new version of Node-RED.</p>" +
|
||||
"<p>You can choose not to see this tour in the future by disabling it under the View tab of User Settings.</p>",
|
||||
"ja": "<p>最初に、既に見つけている様に、新機能の本ツアーがあります。本ツアーは、新バージョンのNode-REDフローエディタを初めて開いた時のみ表示されます。</p>" +
|
||||
"<p>ユーザ設定の表示タブの中で、この機能を無効化することで、本ツアーを表示しないようにすることもできます。</p>"
|
||||
}
|
||||
},
|
||||
{
|
||||
title: {
|
||||
"en-US": "New Edit menu",
|
||||
"ja": "新しい編集メニュー"
|
||||
},
|
||||
prepare() {
|
||||
$("#red-ui-header-button-sidemenu").trigger("click");
|
||||
$("#menu-item-edit-menu").parent().addClass("open");
|
||||
},
|
||||
complete() {
|
||||
$("#menu-item-edit-menu").parent().removeClass("open");
|
||||
},
|
||||
element: "#menu-item-edit-menu-submenu",
|
||||
interactive: false,
|
||||
direction: "left",
|
||||
description: {
|
||||
"en-US": "<p>The main menu has been updated with a new 'Edit' section. This includes all of the familar options, like cut/paste and undo/redo.</p>" +
|
||||
"<p>The menu now displays keyboard shortcuts for the options.</p>",
|
||||
"ja": "<p>メインメニューに「編集」セクションが追加されました。本セクションには、切り取り/貼り付けや、変更操作を戻す/やり直しの様な使い慣れたオプションが含まれています。</p>" +
|
||||
"<p>本メニューには、オプションのためのキーボードショートカットも表示されるようになりました。</p>"
|
||||
}
|
||||
},
|
||||
{
|
||||
title: {
|
||||
"en-US": "Arranging nodes",
|
||||
"ja": "ノードの配置"
|
||||
},
|
||||
prepare() {
|
||||
$("#red-ui-header-button-sidemenu").trigger("click");
|
||||
$("#menu-item-arrange-menu").parent().addClass("open");
|
||||
},
|
||||
complete() {
|
||||
$("#menu-item-arrange-menu").parent().removeClass("open");
|
||||
},
|
||||
element: "#menu-item-arrange-menu-submenu",
|
||||
interactive: false,
|
||||
direction: "left",
|
||||
description: {
|
||||
"en-US": "<p>The new 'Arrange' section of the menu provides new options to help arrange your nodes. You can align them to a common edge, spread them out evenly or change their order.</p>",
|
||||
"ja": "<p>メニューの新しい「配置」セクションには、ノードの配置を助ける新しいオプションが提供されています。ノードの端を揃えたり、均等に配置したり、表示順序を変更したりできます。</p>"
|
||||
}
|
||||
},
|
||||
{
|
||||
title: {
|
||||
"en-US": "Hiding tabs",
|
||||
"ja": "タブの非表示"
|
||||
},
|
||||
element: "#red-ui-workspace-tabs > li.active",
|
||||
description: {
|
||||
"en-US": '<p>Tabs can now be hidden by clicking their <i class="fa fa-eye-slash"></i> icon.</p><p>The Info Sidebar will still list all of your tabs, and tell you which ones are currently hidden.',
|
||||
"ja": '<p><i class="fa fa-eye-slash"></i> アイコンをクリックすることで、タブを非表示にできます。</p><p>情報サイドバーには、全てのタブが一覧表示されており、現在非表示になっているタブを確認できます。'
|
||||
},
|
||||
interactive: false,
|
||||
prepare() {
|
||||
$("#red-ui-workspace-tabs > li.active .red-ui-tab-close").css("display","block");
|
||||
},
|
||||
complete() {
|
||||
$("#red-ui-workspace-tabs > li.active .red-ui-tab-close").css("display","");
|
||||
}
|
||||
},
|
||||
{
|
||||
title: {
|
||||
"en-US": "Tab menu",
|
||||
"ja": "タブメニュー"
|
||||
},
|
||||
element: "#red-ui-workspace-tabs-menu",
|
||||
description: {
|
||||
"en-US": "<p>The new tab menu also provides lots of new options for your tabs.</p>",
|
||||
"ja": "<p>新しいタブメニューには、タブに関する沢山の新しいオプションが提供されています。</p>"
|
||||
},
|
||||
interactive: false,
|
||||
direction: "left",
|
||||
prepare() {
|
||||
$("#red-ui-workspace > .red-ui-tabs > .red-ui-tabs-menu a").trigger("click");
|
||||
},
|
||||
complete() {
|
||||
$(document).trigger("click");
|
||||
}
|
||||
},
|
||||
{
|
||||
title: {
|
||||
"en-US": "Flow and Group level environment variables",
|
||||
"ja": "フローとグループの環境変数"
|
||||
},
|
||||
element: "#red-ui-workspace-tabs > li.active",
|
||||
interactive: false,
|
||||
description: {
|
||||
"en-US": "<p>Flows and Groups can now have their own environment variables that can be referenced by nodes inside them.</p>",
|
||||
"ja": "<p>フローとグループには、内部のノードから参照できる環境変数を設定できるようになりました。</p>"
|
||||
}
|
||||
},
|
||||
{
|
||||
prepare(done) {
|
||||
RED.editor.editFlow(RED.nodes.workspace(RED.workspaces.active()),"editor-tab-envProperties");
|
||||
setTimeout(done,700);
|
||||
},
|
||||
element: "#red-ui-tab-editor-tab-envProperties-link-button",
|
||||
description: {
|
||||
"en-US": "<p>Their edit dialogs have a new Environment Variables section.</p>",
|
||||
"ja": "<p>編集ダイアログに環境変数セクションが追加されました。</p>"
|
||||
}
|
||||
},
|
||||
{
|
||||
element: ".node-input-env-container-row",
|
||||
direction: "left",
|
||||
description: {
|
||||
"en-US": '<p>The environment variables are listed in this table and new ones can be added by clicking the <i class="fa fa-plus"></i> button.</p>',
|
||||
"ja": '<p>この表に環境変数が一覧表示されており、<i class="fa fa-plus"></i>ボタンをクリックすることで新しい変数を追加できます。</p>'
|
||||
},
|
||||
complete(done) {
|
||||
$("#node-dialog-cancel").trigger("click");
|
||||
setTimeout(done,500);
|
||||
}
|
||||
},
|
||||
{
|
||||
title: {
|
||||
"en-US": "Link Call node added",
|
||||
"ja": "Link Callノードを追加"
|
||||
},
|
||||
prepare(done) {
|
||||
this.paletteWasClosed = $("#red-ui-main-container").hasClass("red-ui-palette-closed");
|
||||
RED.actions.invoke("core:toggle-palette",true)
|
||||
$('[data-palette-type="link call"]')[0].scrollIntoView({block:"center"})
|
||||
setTimeout(done,100);
|
||||
},
|
||||
element: '[data-palette-type="link call"]',
|
||||
direction: "right",
|
||||
description: {
|
||||
"en-US": "<p>The <code>Link Call</code> node lets you call another flow that begins with a <code>Link In</code> node and get the result back when the message reaches a <code>Link Out</code> node.</p>",
|
||||
"ja": "<p><code>Link Call</code>ノードを用いることで、<code>Link In</code>ノードから始まるフローを呼び出し、<code>Link Out</code>ノードに到達した時に、結果を取得できます。</p>"
|
||||
}
|
||||
},
|
||||
{
|
||||
title: {
|
||||
"en-US": "MQTT nodes support dynamic connections",
|
||||
"ja": "MQTTノードが動的接続をサポート"
|
||||
},
|
||||
prepare(done) {
|
||||
$('[data-palette-type="mqtt out"]')[0].scrollIntoView({block:"center"})
|
||||
setTimeout(done,100);
|
||||
},
|
||||
element: '[data-palette-type="mqtt out"]',
|
||||
direction: "right",
|
||||
description: {
|
||||
"en-US": '<p>The <code>MQTT</code> nodes now support creating their connections and subscriptions dynamically.</p>',
|
||||
"ja": '<p><code>MQTT</code>ノードは、動的な接続や購読ができるようになりました。</p>'
|
||||
},
|
||||
},
|
||||
{
|
||||
title: {
|
||||
"en-US": "File nodes renamed",
|
||||
"ja": "ファイルノードの名前変更"
|
||||
},
|
||||
prepare(done) {
|
||||
$('[data-palette-type="file"]')[0].scrollIntoView({block:"center"});
|
||||
setTimeout(done,100);
|
||||
},
|
||||
complete() {
|
||||
if (this.paletteWasClosed) {
|
||||
RED.actions.invoke("core:toggle-palette",false)
|
||||
}
|
||||
},
|
||||
element: '[data-palette-type="file"]',
|
||||
direction: "right",
|
||||
description: {
|
||||
"en-US": "<p>The file nodes have been renamed to make it clearer which node does what.</p>",
|
||||
"ja": "<p>fileノードの名前が変更され、どのノードが何を行うかが明確になりました。</p>"
|
||||
}
|
||||
},
|
||||
{
|
||||
title: {
|
||||
"en-US": "Deep copy option on Change node",
|
||||
"ja": "Changeノードのディープコピーオプション"
|
||||
},
|
||||
prepare(done) {
|
||||
var def = RED.nodes.getType('change');
|
||||
RED.editor.edit({id:"test",type:"change",rules:[{t:"set",p:"payload",pt:"msg", tot:"msg",to:"anotherProperty"}],_def:def, _:def._});
|
||||
setTimeout(done,700);
|
||||
},
|
||||
complete(done) {
|
||||
$("#node-dialog-cancel").trigger("click");
|
||||
setTimeout(done,500);
|
||||
},
|
||||
element: function() {
|
||||
return $(".node-input-rule-property-deepCopy").next();
|
||||
},
|
||||
description: {
|
||||
"en-US": "<p>The Set rule has a new option to create a deep copy of the value. This ensures a complete copy is made, rather than using a reference.</p>",
|
||||
"ja": "<p>値を代入に、値のディープコピーを作成するオプションが追加されました。これによって参照ではなく、完全なコピーが作成されます。</p>"
|
||||
}
|
||||
},
|
||||
{
|
||||
title: {
|
||||
"en-US": "And that's not all...",
|
||||
"ja": "これが全てではありません..."
|
||||
},
|
||||
description: {
|
||||
"en-US": "<p>There are many more smaller changes, including:</p><ul><li>Auto-complete suggestions in the <code>msg</code> TypedInput.</li><li>Support for <code>msg.resetTimeout</code> in the <code>Join</code> node.</li><li>Pushing messages to the front of the queue in the <code>Delay</code> node's rate limiting mode.</li><li>An optional second output on the <code>Delay</code> node for rate limited messages.</li></ul>",
|
||||
"ja": "<p>以下の様な小さな変更が沢山あります:</p><ul><li><code>msg</code> TypedInputの自動補完提案</li><li><code>Join</code>ノードで<code>msg.resetTimeout</code>のサポート</li><li><code>Delay</code>ノードの流量制御モードにおいて先頭メッセージをキューに追加</li><li><code>Delay</code>ノードで流量制限されたメッセージ向けの任意の2つ目の出力</li></ul>"
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
BIN
packages/node_modules/@node-red/editor-client/src/tours/2.2/images/delete-repair.gif
vendored
Normal file
BIN
packages/node_modules/@node-red/editor-client/src/tours/2.2/images/delete-repair.gif
vendored
Normal file
Binary file not shown.
After Width: | Height: | Size: 29 KiB |
BIN
packages/node_modules/@node-red/editor-client/src/tours/2.2/images/detach-repair.gif
vendored
Normal file
BIN
packages/node_modules/@node-red/editor-client/src/tours/2.2/images/detach-repair.gif
vendored
Normal file
Binary file not shown.
After Width: | Height: | Size: 70 KiB |
BIN
packages/node_modules/@node-red/editor-client/src/tours/2.2/images/slice.gif
vendored
Normal file
BIN
packages/node_modules/@node-red/editor-client/src/tours/2.2/images/slice.gif
vendored
Normal file
Binary file not shown.
After Width: | Height: | Size: 81 KiB |
BIN
packages/node_modules/@node-red/editor-client/src/tours/2.2/images/subflow-labels.png
vendored
Normal file
BIN
packages/node_modules/@node-red/editor-client/src/tours/2.2/images/subflow-labels.png
vendored
Normal file
Binary file not shown.
After Width: | Height: | Size: 29 KiB |
156
packages/node_modules/@node-red/editor-client/src/tours/2.2/welcome.js
vendored
Normal file
156
packages/node_modules/@node-red/editor-client/src/tours/2.2/welcome.js
vendored
Normal file
@@ -0,0 +1,156 @@
|
||||
export default {
|
||||
version: "2.2.0",
|
||||
steps: [
|
||||
{
|
||||
titleIcon: "fa fa-map-o",
|
||||
title: {
|
||||
"en-US": "Welcome to Node-RED 2.2!",
|
||||
"ja": "Node-RED 2.2へようこそ!"
|
||||
},
|
||||
description: {
|
||||
"en-US": "Let's take a moment to discover the new features in this release.",
|
||||
"ja": "本リリースの新機能を見つけてみましょう。"
|
||||
}
|
||||
},
|
||||
{
|
||||
title: {
|
||||
"en-US": "Search history",
|
||||
"ja": "検索履歴"
|
||||
},
|
||||
description: {
|
||||
"en-US": "<p>The Search dialog now keeps a history of your searches, making it easier to go back to a previous search.</p>",
|
||||
"ja": "<p>検索ダイアログが検索履歴を保持するようになりました。これによって、過去の検索に戻りやすくなりました。</p>"
|
||||
},
|
||||
element: "#red-ui-search .red-ui-searchBox-form",
|
||||
prepare(done) {
|
||||
RED.search.show();
|
||||
setTimeout(done,400);
|
||||
},
|
||||
complete() {
|
||||
RED.search.hide();
|
||||
},
|
||||
},
|
||||
{
|
||||
title: {
|
||||
"en-US": "Remembering Zoom & Position",
|
||||
"ja": "拡大/縮小のレベルや位置を記憶"
|
||||
},
|
||||
description: {
|
||||
"en-US": "<p>The editor has new options to restore the zoom level and scroll position when reloading the editor.</p>",
|
||||
"ja": "<p>エディタを再読み込みした時に、拡大/縮小のレベルやスクロール位置を復元するための新しいオプションを利用できます。</p>"
|
||||
},
|
||||
element: function() { return $("#user-settings-view-store-position").parent()},
|
||||
prepare(done) {
|
||||
RED.actions.invoke("core:show-user-settings")
|
||||
setTimeout(done,400);
|
||||
},
|
||||
complete(done) {
|
||||
$("#node-dialog-ok").trigger("click");
|
||||
setTimeout(done,400);
|
||||
},
|
||||
},
|
||||
{
|
||||
title: {
|
||||
"en-US": "New wiring actions",
|
||||
"ja": "新しいワイヤー操作"
|
||||
},
|
||||
// image: "images/",
|
||||
description: {
|
||||
"en-US": `<p>A pair of new actions have been added to help with wiring nodes together:</p>
|
||||
<ul>
|
||||
<li><b><code>Wire Series Of Nodes</code></b> - adds a wire (if necessary) between each pair of nodes in the order they were selected.</li>
|
||||
<li><b><code>Wire Node To Multiple</code></b> - wires the first node selected to all of the other selected nodes.</li>
|
||||
</ul>
|
||||
<p>Actions can be accessed from the Action List in the main menu.</p>`,
|
||||
"ja": `<p>ノード接続を支援する2つの新しい操作が追加されました:</p>
|
||||
<ul>
|
||||
<li><b><code>Wire Series Of Nodes</code></b> - ノードを選択した順序で、各ノードのペアの間にワイヤーを(必要に応じて)追加します。</li>
|
||||
<li><b><code>Wire Node To Multiple</code></b> - 最初に選択したノードから、他の選択した全てのノードに対して、ワイヤーを追加します。</li>
|
||||
</ul>
|
||||
<p>メインメニュー内の動作一覧から、これらの操作を利用できます。</p>`
|
||||
},
|
||||
},
|
||||
{
|
||||
title: {
|
||||
"en-US": "Deleting nodes and reconnecting wires",
|
||||
"ja": "ノードの削除とワイヤーの再接続"
|
||||
},
|
||||
image: "2.2/images/delete-repair.gif",
|
||||
description: {
|
||||
"en-US": `<p>It is now possible to delete a selection of nodes and automatically repair the wiring behind them.</p>
|
||||
<p>This is really useful if you want to remove a node from the middle of the flow.</p>
|
||||
<p>Hold the Ctrl (or Cmd) key when you press Delete and the nodes will be gone and the wires repaired.</p>
|
||||
`,
|
||||
"ja": `<p>選択したノードを削除した後、その背後にあるワイヤーを自動的に修復できるようになりました。</p>
|
||||
<p>これは、フローの中からノードを削除する時に、とても便利に使えます。</p>
|
||||
<p>Ctrl (またはCmd)キーを押しながらDeleteキーを押すと、ノードがなくなり、ワイヤーが修復されます。</p>
|
||||
`
|
||||
}
|
||||
},
|
||||
{
|
||||
title: {
|
||||
"en-US": "Detaching nodes from a flow",
|
||||
"ja": "フローからノードの切り離し"
|
||||
},
|
||||
image: "2.2/images/detach-repair.gif",
|
||||
description: {
|
||||
"en-US": `<p>If you want to remove a node from a flow without deleting it,
|
||||
you can use the <b><code>Detach Selected Nodes</code></b> action.</p>
|
||||
<p>The nodes will be removed from their flow, the wiring repaired behind them, and then attached to the mouse
|
||||
so you can drop them wherever you want in the workspace.</p>
|
||||
<p>There isn't a default keyboard shortcut assigned for this new action, but
|
||||
you can add your own via the Keyboard pane of the main Settings dialog.</p>`,
|
||||
"ja": `<p>ノードを削除することなく、フローからノードを除きたい場合は、<b><code>Detach Selected Nodes</code></b>操作を利用できます。</p>
|
||||
<p>フローからノードが除かれた後、背後のワイヤーが修復され、ノードはマウスポインタにつながります。そのため、ワークスペースの好きな所にノードを配置できます。</p>
|
||||
<p>この新しい操作に対して、デフォルトのキーボードショートカットは登録されていませんが、メイン設定ダイアログのキーボード設定から追加できます。</p>`
|
||||
}
|
||||
},
|
||||
{
|
||||
title: {
|
||||
"en-US": "More wiring tricks",
|
||||
"ja": "その他のワイヤー操作"
|
||||
},
|
||||
image: "2.2/images/slice.gif",
|
||||
description: {
|
||||
"en-US": `<p>A couple more wiring tricks to share.</p>
|
||||
<p>You can now select multiple wires by holding the Ctrl (or Cmd) key
|
||||
when clicking on a wire. This makes it easier to delete multiple wires in one go.</p>
|
||||
<p>If you hold the Ctrl (or Cmd) key, then click and drag with the right-hand mouse button,
|
||||
you can slice through wires to remove them.</p>`,
|
||||
"ja": `<p>その他のいくつかのワイヤー操作</p>
|
||||
<p>Ctrl (またはCmd)キーを押しながらワイヤーをクリックすることで、複数のワイヤーを選択できるようになりました。これによって、複数のワイヤーを一度に削除することが簡単になりました。</p>
|
||||
<p>Ctrl (またはCmd)キーを押しながら、マウスの右ボタンを用いてドラッグすると、ワイヤーを切って削除できます。</p>`
|
||||
}
|
||||
},
|
||||
{
|
||||
title: {
|
||||
"en-US": "Subflow Output Labels",
|
||||
"ja": "サブフローの出力ラベル"
|
||||
},
|
||||
image: "2.2/images/subflow-labels.png",
|
||||
description: {
|
||||
"en-US": "<p>If a subflow has labels set for its outputs, they now get shown on the ports within the subflow template view.</p>",
|
||||
"ja": "<p>サブフローの出力にラベルが設定されている場合、サブフローテンプレート画面内のポートにラベルが表示されるようになりました。</p>"
|
||||
},
|
||||
},
|
||||
{
|
||||
title: {
|
||||
"en-US": "Node Updates",
|
||||
"ja": "ノードの更新"
|
||||
},
|
||||
// image: "images/",
|
||||
description: {
|
||||
"en-US": `<ul>
|
||||
<li>The JSON node will now handle parsing Buffer payloads</li>
|
||||
<li>The TCP Client nodes support TLS connections</li>
|
||||
<li>The WebSocket node allows you to specify a sub-protocol when connecting</li>
|
||||
</ul>`,
|
||||
"ja": `<ul>
|
||||
<li>JSONノードが、バッファ形式のペイロードを解析できるようになりました。</li>
|
||||
<li>TCPクライアントノードが、TLS接続をサポートしました。</li>
|
||||
<li>WebSocketノードで、接続時にサブプロトコルを指定できるようになりました。</li>
|
||||
</ul>`
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
@@ -1,14 +1,14 @@
|
||||
export default {
|
||||
version: "3.0.0-beta.3",
|
||||
version: "3.0.0-beta.4",
|
||||
steps: [
|
||||
{
|
||||
titleIcon: "fa fa-map-o",
|
||||
title: {
|
||||
"en-US": "Welcome to Node-RED 3.0 Beta 3!",
|
||||
"en-US": "Welcome to Node-RED 3.0 Beta 4!",
|
||||
"ja": "Node-RED 3.0 ベータ3へようこそ!"
|
||||
},
|
||||
description: {
|
||||
"en-US": "<p>This is the final beta release of Node-RED 3.0.</p><p>Let's take a moment to discover the new features in this release.</p>",
|
||||
"en-US": "<p>This is another final beta release of Node-RED 3.0.</p><p>Let's take a moment to discover the new features in this release.</p>",
|
||||
"ja": "<p>これはNode-RED 3.0の最後のベータリリースです。</p><p>本リリースの新機能を見つけてみましょう。</p>"
|
||||
}
|
||||
},
|
||||
|
Reference in New Issue
Block a user