frodovdr
/
node-red
mirror of https://github.com/node-red/node-red.git
1
0
Fork 0
Code Issues Releases Wiki Activity

Namespace more editor component CSS

This commit is contained in:
Nick O'Leary 2019-05-08 13:26:48 +01:00
parent b98e85016a
commit 50228c5970
No known key found for this signature in database
GPG Key ID: 4F2157149161A6C9
15 changed files with 354 additions and 770 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
packages/node_modules/@node-red/editor-client/src/js/ui/event-log.js vendored
View File

@ -15,7 +15,7 @@
**/ **/
RED.eventLog = (function() { RED.eventLog = (function() {
var template = '<script type="text/x-red" data-template-name="_eventLog"><div class="form-row node-text-editor-row"><div style="height: 100%;min-height: 150px;" class="node-text-editor" id="event-log-editor"></div></div></script>'; var template = '<script type="text/x-red" data-template-name="_eventLog"><div class="form-row node-text-editor-row"><div style="height: 100%;min-height: 150px;" class="node-text-editor" id="red-ui-event-log-editor"></div></div></script>';
var eventLogEditor; var eventLogEditor;
var backlog = []; var backlog = [];
@ -73,7 +73,7 @@ RED.eventLog = (function() {
var trayBody = tray.find('.red-ui-tray-body'); var trayBody = tray.find('.red-ui-tray-body');
var dialogForm = RED.editor.buildEditForm(tray.find('.red-ui-tray-body'),'dialog-form',type,'editor'); var dialogForm = RED.editor.buildEditForm(tray.find('.red-ui-tray-body'),'dialog-form',type,'editor');
eventLogEditor = RED.editor.createEditor({ eventLogEditor = RED.editor.createEditor({
id: 'event-log-editor', id: 'red-ui-event-log-editor',
value: backlog.join("\n"), value: backlog.join("\n"),
lineNumbers: false, lineNumbers: false,
readOnly: true, readOnly: true,

2
packages/node_modules/@node-red/editor-client/src/js/ui/search.js vendored
View File

@ -194,7 +194,7 @@ RED.search = (function() {
searchInput.i18n(); searchInput.i18n();
var searchResultsDiv = $("<div>",{class:"red-ui-search-results-container"}).appendTo(dialog); var searchResultsDiv = $("<div>",{class:"red-ui-search-results-container"}).appendTo(dialog);
searchResults = $('<ol>',{id:"search-result-list", style:"position: absolute;top: 5px;bottom: 5px;left: 5px;right: 5px;"}).appendTo(searchResultsDiv).editableList({ searchResults = $('<ol>',{style:"position: absolute;top: 5px;bottom: 5px;left: 5px;right: 5px;"}).appendTo(searchResultsDiv).editableList({
addButton: false, addButton: false,
addItem: function(container,i,object) { addItem: function(container,i,object) {
var node = object.node; var node = object.node;

38
packages/node_modules/@node-red/editor-client/src/js/ui/tab-config.js vendored
View File

@ -22,15 +22,15 @@ RED.sidebar.config = (function() {
content.tabIndex = 0; content.tabIndex = 0;
$('<div class="red-ui-sidebar-header"><span class="button-group">'+ $('<div class="red-ui-sidebar-header"><span class="button-group">'+
'<a class="red-ui-sidebar-header-button-toggle selected" id="workspace-config-node-filter-all" href="#"><span data-i18n="sidebar.config.filterAll"></span></a>'+ '<a class="red-ui-sidebar-header-button-toggle selected" id="red-ui-sidebar-config-filter-all" href="#"><span data-i18n="sidebar.config.filterAll"></span></a>'+
'<a class="red-ui-sidebar-header-button-toggle" id="workspace-config-node-filter-unused" href="#"><span data-i18n="sidebar.config.filterUnused"></span></a> '+ '<a class="red-ui-sidebar-header-button-toggle" id="red-ui-sidebar-config-filter-unused" href="#"><span data-i18n="sidebar.config.filterUnused"></span></a> '+
'</span></div>' '</span></div>'
).appendTo(content); ).appendTo(content);
var toolbar = $('<div>'+ var toolbar = $('<div>'+
'<a class="red-ui-footer-button" id="workspace-config-node-collapse-all" href="#"><i class="fa fa-angle-double-up"></i></a> '+ '<a class="red-ui-footer-button" id="red-ui-sidebar-config-collapse-all" href="#"><i class="fa fa-angle-double-up"></i></a> '+
'<a class="red-ui-footer-button" id="workspace-config-node-expand-all" href="#"><i class="fa fa-angle-double-down"></i></a>'+ '<a class="red-ui-footer-button" id="red-ui-sidebar-config-expand-all" href="#"><i class="fa fa-angle-double-down"></i></a>'+
'</div>'); '</div>');
var globalCategories = $("<div>").appendTo(content); var globalCategories = $("<div>").appendTo(content);
@ -44,8 +44,8 @@ RED.sidebar.config = (function() {
function getOrCreateCategory(name,parent,label) { function getOrCreateCategory(name,parent,label) {
name = name.replace(/\./i,"-"); name = name.replace(/\./i,"-");
if (!categories[name]) { if (!categories[name]) {
var container = $('<div class="red-ui-palette-category workspace-config-node-category" id="workspace-config-node-category-'+name+'"></div>').appendTo(parent); var container = $('<div class="red-ui-palette-category red-ui-sidebar-config-category" id="red-ui-sidebar-config-category-'+name+'"></div>').appendTo(parent);
var header = $('<div class="workspace-config-node-tray-header red-ui-palette-header"><i class="fa fa-angle-down expanded"></i></div>').appendTo(container); var header = $('<div class="red-ui-sidebar-config-tray-header red-ui-palette-header"><i class="fa fa-angle-down expanded"></i></div>').appendTo(container);
if (label) { if (label) {
$('<span class="red-ui-palette-node-config-label"/>').text(label).appendTo(header); $('<span class="red-ui-palette-node-config-label"/>').text(label).appendTo(header);
} else { } else {
@ -208,8 +208,8 @@ RED.sidebar.config = (function() {
validList[sf.id.replace(/\./g,"-")] = true; validList[sf.id.replace(/\./g,"-")] = true;
getOrCreateCategory(sf.id,subflowCategories,sf.name); getOrCreateCategory(sf.id,subflowCategories,sf.name);
}) })
$(".workspace-config-node-category").each(function() { $(".red-ui-sidebar-config-category").each(function() {
var id = $(this).attr('id').substring("workspace-config-node-category-".length); var id = $(this).attr('id').substring("red-ui-sidebar-config-category-".length);
if (!validList[id]) { if (!validList[id]) {
$(this).remove(); $(this).remove();
delete categories[id]; delete categories[id];
@ -299,7 +299,7 @@ RED.sidebar.config = (function() {
$(content).find(".red-ui-palette-node").removeClass("selected"); $(content).find(".red-ui-palette-node").removeClass("selected");
}); });
$("#workspace-config-node-collapse-all").on("click", function(e) { $("#red-ui-sidebar-config-collapse-all").on("click", function(e) {
e.preventDefault(); e.preventDefault();
for (var cat in categories) { for (var cat in categories) {
if (categories.hasOwnProperty(cat)) { if (categories.hasOwnProperty(cat)) {
@ -307,7 +307,7 @@ RED.sidebar.config = (function() {
} }
} }
}); });
$("#workspace-config-node-expand-all").on("click", function(e) { $("#red-ui-sidebar-config-expand-all").on("click", function(e) {
e.preventDefault(); e.preventDefault();
for (var cat in categories) { for (var cat in categories) {
if (categories.hasOwnProperty(cat)) { if (categories.hasOwnProperty(cat)) {
@ -317,39 +317,39 @@ RED.sidebar.config = (function() {
} }
} }
}); });
$('#workspace-config-node-filter-all').on("click",function(e) { $('#red-ui-sidebar-config-filter-all').on("click",function(e) {
e.preventDefault(); e.preventDefault();
if (showUnusedOnly) { if (showUnusedOnly) {
$(this).addClass('selected'); $(this).addClass('selected');
$('#workspace-config-node-filter-unused').removeClass('selected'); $('#red-ui-sidebar-config-filter-unused').removeClass('selected');
showUnusedOnly = !showUnusedOnly; showUnusedOnly = !showUnusedOnly;
refreshConfigNodeList(); refreshConfigNodeList();
} }
}); });
$('#workspace-config-node-filter-unused').on("click",function(e) { $('#red-ui-sidebar-config-filter-unused').on("click",function(e) {
e.preventDefault(); e.preventDefault();
if (!showUnusedOnly) { if (!showUnusedOnly) {
$(this).addClass('selected'); $(this).addClass('selected');
$('#workspace-config-node-filter-all').removeClass('selected'); $('#red-ui-sidebar-config-filter-all').removeClass('selected');
showUnusedOnly = !showUnusedOnly; showUnusedOnly = !showUnusedOnly;
refreshConfigNodeList(); refreshConfigNodeList();
} }
}); });
RED.popover.tooltip($('#workspace-config-node-filter-all'),"Show all config nodes"); RED.popover.tooltip($('#red-ui-sidebar-config-filter-all'),"Show all config nodes");
RED.popover.tooltip($('#workspace-config-node-filter-unused'),"Show all unused config nodes"); RED.popover.tooltip($('#red-ui-sidebar-config-filter-unused'),"Show all unused config nodes");
} }
function show(id) { function show(id) {
if (typeof id === 'boolean') { if (typeof id === 'boolean') {
if (id) { if (id) {
$('#workspace-config-node-filter-unused').trigger("click"); $('#red-ui-sidebar-config-filter-unused').trigger("click");
} else { } else {
$('#workspace-config-node-filter-all').trigger("click"); $('#red-ui-sidebar-config-filter-all').trigger("click");
} }
} }
refreshConfigNodeList(); refreshConfigNodeList();
if (typeof id === "string") { if (typeof id === "string") {
$('#workspace-config-node-filter-all').trigger("click"); $('#red-ui-sidebar-config-filter-all').trigger("click");
id = id.replace(/\./g,"-"); id = id.replace(/\./g,"-");
setTimeout(function() { setTimeout(function() {
var node = $(".red-ui-palette-node_id_"+id); var node = $(".red-ui-palette-node_id_"+id);

3
packages/node_modules/@node-red/editor-client/src/js/ui/typeSearch.js vendored
View File

@ -45,7 +45,6 @@ RED.typeSearch = (function() {
} }
function createDialog() { function createDialog() {
//shade = $('<div>',{class:"red-ui-type-search-shade"}).appendTo("#red-ui-main-container");
dialog = $("<div>",{id:"red-ui-type-search",class:"red-ui-search red-ui-type-search"}).appendTo("#red-ui-main-container"); dialog = $("<div>",{id:"red-ui-type-search",class:"red-ui-search red-ui-type-search"}).appendTo("#red-ui-main-container");
var searchDiv = $("<div>",{class:"red-ui-search-container"}).appendTo(dialog); var searchDiv = $("<div>",{class:"red-ui-search-container"}).appendTo(dialog);
searchInput = $('<input type="text" id="red-ui-type-search-input">').attr("placeholder",RED._("search.addNode")).appendTo(searchDiv).searchBox({ searchInput = $('<input type="text" id="red-ui-type-search-input">').attr("placeholder",RED._("search.addNode")).appendTo(searchDiv).searchBox({
@ -104,7 +103,7 @@ RED.typeSearch = (function() {
}); });
searchResultsDiv = $("<div>",{class:"red-ui-search-results-container"}).appendTo(dialog); searchResultsDiv = $("<div>",{class:"red-ui-search-results-container"}).appendTo(dialog);
searchResults = $('<ol>',{id:"search-result-list", style:"position: absolute;top: 0;bottom: 0;left: 0;right: 0;"}).appendTo(searchResultsDiv).editableList({ searchResults = $('<ol>',{style:"position: absolute;top: 0;bottom: 0;left: 0;right: 0;"}).appendTo(searchResultsDiv).editableList({
addButton: false, addButton: false,
filter: function(data) { filter: function(data) {
if (activeFilter === "" ) { if (activeFilter === "" ) {

34
packages/node_modules/@node-red/editor-client/src/js/ui/view-navigator.js vendored
View File

@ -36,10 +36,10 @@
if (!isShowing) { if (!isShowing) {
return; return;
} }
var navNode = navVis.selectAll(".navnode").data(RED.view.getActiveNodes(),function(d){return d.id}); var navNode = navVis.selectAll(".red-ui-navigator-node").data(RED.view.getActiveNodes(),function(d){return d.id});
navNode.exit().remove(); navNode.exit().remove();
navNode.enter().insert("rect") navNode.enter().insert("rect")
.attr('class','navnode') .attr('class','red-ui-navigator-node')
.attr("pointer-events", "none"); .attr("pointer-events", "none");
navNode.each(function(d) { navNode.each(function(d) {
d3.select(this).attr("x",function(d) { return (d.x-d.w/2)/nav_scale }) d3.select(this).attr("x",function(d) { return (d.x-d.w/2)/nav_scale })
@ -68,7 +68,7 @@
function toggle() { function toggle() {
if (!isShowing) { if (!isShowing) {
isShowing = true; isShowing = true;
$("#btn-navigate").addClass("selected"); $("#red-ui-view-navigate").addClass("selected");
resizeNavBorder(); resizeNavBorder();
refreshNodes(); refreshNodes();
$("#red-ui-workspace-chart").on("scroll",onScroll); $("#red-ui-workspace-chart").on("scroll",onScroll);
@ -77,7 +77,7 @@
isShowing = false; isShowing = false;
navContainer.fadeOut(100); navContainer.fadeOut(100);
$("#red-ui-workspace-chart").off("scroll",onScroll); $("#red-ui-workspace-chart").off("scroll",onScroll);
$("#btn-navigate").removeClass("selected"); $("#red-ui-view-navigate").removeClass("selected");
} }
} }
@ -101,16 +101,7 @@
.attr("width", nav_width) .attr("width", nav_width)
.attr("height", nav_height) .attr("height", nav_height)
.attr("pointer-events", "all") .attr("pointer-events", "all")
.style({ .attr("id","red-ui-navigator-canvas")
position: "absolute",
bottom: 0,
right:0,
zIndex: 101,
"border-left": "1px solid #ccc",
"border-top": "1px solid #ccc",
background: "rgba(245,245,245,0.8)",
"box-shadow": "-1px 0 3px rgba(0,0,0,0.1)"
});
navBox.append("rect").attr("x",0).attr("y",0).attr("width",nav_width).attr("height",nav_height).style({ navBox.append("rect").attr("x",0).attr("y",0).attr("width",nav_width).attr("height",nav_height).style({
fill:"none", fill:"none",
@ -142,28 +133,21 @@
isDragging = false; isDragging = false;
}) })
navBorder = navBox.append("rect") navBorder = navBox.append("rect").attr("class","red-ui-navigator-border")
.attr("stroke-dasharray","5,5")
.attr("pointer-events", "none")
.style({
stroke: "#999",
strokeWidth: 1,
fill: "white",
});
navVis = navBox.append("svg:g") navVis = navBox.append("svg:g")
RED.statusBar.add({ RED.statusBar.add({
id: "view-navigator", id: "view-navigator",
align: "right", align: "right",
element: $('<button class="red-ui-footer-button-toggle single" id="btn-navigate"><i class="fa fa-map-o"></i></button>') element: $('<button class="red-ui-footer-button-toggle single" id="red-ui-view-navigate"><i class="fa fa-map-o"></i></button>')
}) })
$("#btn-navigate").on("click", function(evt) { $("#red-ui-view-navigate").on("click", function(evt) {
evt.preventDefault(); evt.preventDefault();
toggle(); toggle();
}) })
RED.popover.tooltip($("#btn-navigate"),RED._('actions.toggle-navigator'),'core:toggle-navigator'); RED.popover.tooltip($("#red-ui-view-navigate"),RED._('actions.toggle-navigator'),'core:toggle-navigator');
}, },
refresh: refreshNodes, refresh: refreshNodes,
resize: resizeNavBorder, resize: resizeNavBorder,

21
packages/node_modules/@node-red/editor-client/src/js/ui/view.js vendored
View File

@ -184,7 +184,7 @@ RED.view = (function() {
// .attr("y",point[1]) // .attr("y",point[1])
// .attr("width",0) // .attr("width",0)
// .attr("height",0) // .attr("height",0)
// .attr("class","lasso"); // .attr("class","nr-ui-view-lasso");
},touchLongPressTimeout); },touchLongPressTimeout);
} }
}) })
@ -962,7 +962,7 @@ RED.view = (function() {
.attr("y",point[1]) .attr("y",point[1])
.attr("width",0) .attr("width",0)
.attr("height",0) .attr("height",0)
.attr("class","lasso"); .attr("class","nr-ui-view-lasso");
d3.event.preventDefault(); d3.event.preventDefault();
} }
} }
@ -2766,7 +2766,7 @@ RED.view = (function() {
.attr("x", 38) .attr("x", 38)
.attr("dy", ".35em") .attr("dy", ".35em")
.attr("text-anchor","start") .attr("text-anchor","start")
.classed("hidden",hideLabel); .classed("hide",hideLabel);
if (d._def.align) { if (d._def.align) {
text.attr("class","node_label node_label_"+d._def.align); text.attr("class","node_label node_label_"+d._def.align);
@ -2788,8 +2788,8 @@ RED.view = (function() {
//node.append("path").attr("class","node_error").attr("d","M 3,-3 l 10,0 l -5,-8 z"); //node.append("path").attr("class","node_error").attr("d","M 3,-3 l 10,0 l -5,-8 z");
//TODO: these ought to be SVG //TODO: these ought to be SVG
node.append("image").attr("class","node_error hidden").attr("xlink:href","red/images/icons/node-error.png").attr("x",0).attr("y",-6).attr("width",10).attr("height",9); node.append("image").attr("class","node_error hide").attr("xlink:href","red/images/icons/node-error.png").attr("x",0).attr("y",-6).attr("width",10).attr("height",9);
node.append("image").attr("class","node_changed hidden").attr("xlink:href","red/images/icons/node-changed.png").attr("x",12).attr("y",-6).attr("width",10).attr("height",10); node.append("image").attr("class","node_changed hide").attr("xlink:href","red/images/icons/node-changed.png").attr("x",12).attr("y",-6).attr("width",10).attr("height",10);
}); });
node.each(function(d,i) { node.each(function(d,i) {
@ -2944,9 +2944,8 @@ RED.view = (function() {
} }
s = " "+s; s = " "+s;
} }
return "node_label"+ return "node_label"+(d._def.align?" node_label_"+d._def.align:"")+s;
(d._def.align?" node_label_"+d._def.align:"")+s; }).classed("hide",hideLabel);
}).classed("hidden",hideLabel);
if (d._def.icon) { if (d._def.icon) {
var icon = thisNode.select(".node_icon"); var icon = thisNode.select(".node_icon");
var faIcon = thisNode.select(".fa-lg"); var faIcon = thisNode.select(".fa-lg");
@ -2968,15 +2967,13 @@ RED.view = (function() {
} }
} }
thisNode.selectAll(".node_tools").attr("x",function(d){return d.w-35;}).attr("y",function(d){return d.h-20;});
thisNode.selectAll(".node_changed") thisNode.selectAll(".node_changed")
.attr("x",function(d){return d.w-10}) .attr("x",function(d){return d.w-10})
.classed("hidden",function(d) { return !(d.changed||d.moved); }); .classed("hide",function(d) { return !(d.changed||d.moved); });
thisNode.selectAll(".node_error") thisNode.selectAll(".node_error")
.attr("x",function(d){return d.w-10-((d.changed||d.moved)?13:0)}) .attr("x",function(d){return d.w-10-((d.changed||d.moved)?13:0)})
.classed("hidden",function(d) { return d.valid; }); .classed("hide",function(d) { return d.valid; });
thisNode.selectAll(".port_input").each(function(d,i) { thisNode.selectAll(".port_input").each(function(d,i) {
var port = d3.select(this); var port = d3.select(this);

2
packages/node_modules/@node-red/editor-client/src/sass/ace.scss vendored
View File

@ -7,7 +7,7 @@
border-bottom-right-radius: 4px; border-bottom-right-radius: 4px;
} }
#event-log-editor { #red-ui-event-log-editor {
.ace_scroller { .ace_scroller {
background: #444; background: #444;
color: #dd9; color: #dd9;

14
packages/node_modules/@node-red/editor-client/src/sass/base.scss vendored
View File

@ -221,20 +221,6 @@ table {
border-spacing: 0; border-spacing: 0;
} }
.pull-right {
float: right;
}
.pull-left {
float: left;
}
.hide {
display: none;
}
.show {
display: block;
}
.red-ui-component-spinner { .red-ui-component-spinner {
position: absolute; position: absolute;
top: 1px; top: 1px;

30
packages/node_modules/@node-red/editor-client/src/sass/colors.scss vendored
View File

@ -17,23 +17,19 @@
$background-color: #f3f3f3; $background-color: #f3f3f3;
$form-placeholder-color: #bbbbbb; $form-placeholder-color: #bbbbbb;
$form-text-color: #444; $form-text-color: #555;
$form-input-focus-color: rgba(85,150,230,0.8); $form-input-focus-color: rgba(85,150,230,0.8);
$form-input-border-color: #ccc; $form-input-border-color: #ccc;
$form-input-border-selected-color: #aaa; $form-input-border-selected-color: #aaa;
$form-input-background: #fff;
$form-input-background-disabled: #eee;
$list-item-color: #666; $list-item-color: #666;
$list-item-background: #fff;
$list-item-background-hover: #f3f3f3; $list-item-background-hover: #f3f3f3;
$list-item-background-active: #efefef; $list-item-background-active: #efefef;
$list-item-background-selected: #eee; $list-item-background-selected: #eee;
$list-item-border-selected: #999;
$node-selected-color: #ff7f0e;
$port-selected-color: #ff7f0e;
$link-color: #888;
$link-link-color: #ccc;
$link-link-active-color: #ff7f0e;
$link-subflow-color: #bbb;
$link-unknown-color: #f00;
$primary-border-color: #bbbbbb; $primary-border-color: #bbbbbb;
$secondary-border-color: #dddddd; $secondary-border-color: #dddddd;
@ -43,7 +39,7 @@ $tab-background-selected: #f9f9f9;
$tab-background-inactive: #f0f0f0; $tab-background-inactive: #f0f0f0;
$tab-background-hover: #ddd; $tab-background-hover: #ddd;
$palette-header-background: #f3f3f3; $palette-header-background: $background-color;
$workspace-button-background: #fff; $workspace-button-background: #fff;
$workspace-button-background-hover: #ddd; $workspace-button-background-hover: #ddd;
@ -93,3 +89,17 @@ $menuDisabledColor: #999;
$menuHoverColor: #ffffff; $menuHoverColor: #ffffff;
$menuHoverBackground: #999; $menuHoverBackground: #999;
$menuCaret: #e0e0e0; $menuCaret: #e0e0e0;
$view-navigator-background: rgba(245,245,245,0.8);
$view-lasso-stroke: #ff7f0e;
$view-lasso-fill: rgba(20,125,255,0.1);
$node-selected-color: #ff7f0e;
$port-selected-color: #ff7f0e;
$link-color: #888;
$link-link-color: #ccc;
$link-link-active-color: #ff7f0e;
$link-subflow-color: #bbb;
$link-unknown-color: #f00;

54
packages/node_modules/@node-red/editor-client/src/sass/flow.scss vendored
View File

@ -14,41 +14,13 @@
* limitations under the License. * limitations under the License.
**/ **/
.hidden { .nr-ui-view-lasso {
display: none;
}
.lasso {
stroke-width: 1px; stroke-width: 1px;
stroke: #ff7f0e; stroke: $view-lasso-stroke;
fill: rgba(20,125,255,0.1); fill: $view-lasso-fill;
stroke-dasharray: 10 5; stroke-dasharray: 10 5;
} }
.group-box {
stroke-width: 1px;
stroke: #aaaaaa;
fill: rgba(208, 211, 238, 0.1);
stroke-dasharray: 3 3;
}
.group-box-active {
fill: #fff;
stroke: #ff7f0e;
}
.group_label {
stroke-width: 0;
fill: #999;
font-size: 11px;
pointer-events: none;
-webkit-touch-callout: none;
@include disable-selection;
}
.pull-right {
margin-left: 20px;
}
.node_label_italic { .node_label_italic {
font-style: italic; font-style: italic;
} }
@ -100,28 +72,10 @@
stroke-width: 2; stroke-width: 2;
} }
.tool_arrow {
stroke-width: 1;
stroke: #999;
fill: #999;
cursor: pointer;
}
.node_tools {
fill: #ddd;
stroke: #999;
cursor: move;
stroke-width: 1;
cursor: pointer;
}
.node_tools_hovered {
stroke: #ff7f0e;
fill: #eee;
}
.node_button { .node_button {
fill: inherit; fill: inherit;
} }
.port { .port {
stroke: #999; stroke: #999;
stroke-width: 1; stroke-width: 1;

794
packages/node_modules/@node-red/editor-client/src/sass/forms.scss vendored
View File

File diff suppressed because it is too large Load Diff

46
packages/node_modules/@node-red/editor-client/src/sass/search.scss vendored
View File

@ -19,22 +19,13 @@
display: none; display: none;
position: absolute; position: absolute;
width: 500px; width: 500px;
background: white;
left: 50%; left: 50%;
margin-left: -250px; margin-left: -250px;
top: 0px; top: 0px;
border: 1px solid $primary-border-color; border: 1px solid $primary-border-color;
box-shadow: 0 0 10px rgba(0,0,0,0.4); box-shadow: 0 0 10px rgba(0,0,0,0.4);
}
ol {
}
}
.red-ui-type-search-shade {
@include shade;
z-index: 20;
position: fixed;
background: rgba(255,255,255,0.05);
}
.red-ui-type-search { .red-ui-type-search {
box-shadow: 0 1px 6px -3px black; box-shadow: 0 1px 6px -3px black;
background: none; background: none;
@ -45,7 +36,7 @@
.red-ui-search-container { .red-ui-search-container {
border-top-left-radius: 5px; border-top-left-radius: 5px;
border-top-right-radius: 5px; border-top-right-radius: 5px;
border: 1px dashed #aaa; border: 1px dashed $primary-border-color;
border-bottom: none; border-bottom: none;
padding: 0; padding: 0;
} }
@ -53,8 +44,8 @@
display: none; display: none;
height: 150px; height: 150px;
.red-ui-editableList-container { .red-ui-editableList-container {
border: 1px dashed #aaa; border: 1px dashed $primary-border-color;
border-top: 1px solid #ccc; border-top: 1px solid $secondary-border-color;
} }
} }
.red-ui-search-result { .red-ui-search-result {
@ -69,7 +60,7 @@
} }
} }
.red-ui-search-result-separator { .red-ui-search-result-separator {
border-bottom: 3px solid #ddd; border-bottom: 3px solid $secondary-border-color;
} }
.red-ui-search-result-node { .red-ui-search-result-node {
position: relative; position: relative;
@ -107,25 +98,27 @@
.red-ui-search-container { .red-ui-search-container {
padding: 3px; padding: 3px;
background: $form-input-background;
border-bottom: 1px solid $secondary-border-color; border-bottom: 1px solid $secondary-border-color;
} }
.red-ui-search-results-container { .red-ui-search-results-container {
position:relative; position:relative;
height: 300px; height: 300px;
padding: 5px; padding: 5px;
background: #f9f9f9; background: $background-color;
.red-ui-search-results-list {
}
.red-ui-editableList-container { .red-ui-editableList-container {
background: white;
padding: 0; padding: 0;
background: #f9f9f9; background: $background-color;
li { li {
padding: 0; padding: 0;
&.selected { &.selected {
background: #efefef; background: $list-item-background-selected;
.red-ui-search-result { .red-ui-search-result {
border-left-color:#999; border-left-color: $list-item-border-selected;
border-right-color:#999; border-right-color: $list-item-border-selected;
} }
} }
} }
@ -135,15 +128,16 @@
padding: 8px 2px 8px 5px; padding: 8px 2px 8px 5px;
display: block; display: block;
cursor: pointer; cursor: pointer;
color: $form-text-color; color: $list-item-color;
border-left: 3px solid #fff; background: $list-item-background;
border-right: 3px solid #fff; border-left: 3px solid $list-item-background;
border-right: 3px solid $list-item-background;
&:hover { &:hover {
text-decoration: none; text-decoration: none;
color: $form-text-color; color: $form-text-color;
background: #efefef; background: $list-item-background-hover;
border-left-color:#efefef; border-left-color:$list-item-background-hover;
border-right-color:#efefef; border-right-color:$list-item-background-hover;
} }
&:after { &:after {
content: ""; content: "";

18
packages/node_modules/@node-red/editor-client/src/sass/workspace.scss vendored
View File

@ -96,3 +96,21 @@
} }
} }
} }
#red-ui-navigator-canvas {
position: absolute;
bottom: 0;
right:0;
zIndex: 101;
border-left: 1px solid $primary-border-color;
border-top: 1px solid $primary-border-color;
background: $view-navigator-background;
box-shadow: -1px 0 3px rgba(0,0,0,0.1);
}
.red-ui-navigator-border {
stroke-dasharray: 5,5;
pointer-events: none;
stroke: #999;
strokeWidth: 1;
fill: white;
}

4
packages/node_modules/@node-red/nodes/core/core/58-debug.html vendored
View File

@ -206,14 +206,14 @@
}; };
RED.events.on("project:change", this.clearMessageList); RED.events.on("project:change", this.clearMessageList);
$("#debug-tab-open").on("click", function(e) { $("#red-ui-sidebar-debug-open").on("click", function(e) {
e.preventDefault(); e.preventDefault();
subWindow = window.open(document.location.toString().replace(/[?#].*$/,"")+"debug/view/view.html"+document.location.search,"nodeREDDebugView","menubar=no,location=no,toolbar=no,chrome,height=500,width=600"); subWindow = window.open(document.location.toString().replace(/[?#].*$/,"")+"debug/view/view.html"+document.location.search,"nodeREDDebugView","menubar=no,location=no,toolbar=no,chrome,height=500,width=600");
subWindow.onload = function() { subWindow.onload = function() {
subWindow.postMessage({event:"workspaceChange",activeWorkspace:RED.workspaces.active()},"*"); subWindow.postMessage({event:"workspaceChange",activeWorkspace:RED.workspaces.active()},"*");
}; };
}); });
RED.popover.tooltip($("#debug-tab-open"),RED._('node-red:debug.sidebar.openWindow')); RED.popover.tooltip($("#red-ui-sidebar-debug-open"),RED._('node-red:debug.sidebar.openWindow'));

60
packages/node_modules/@node-red/nodes/core/core/lib/debug/debug-utils.js vendored
View File

@ -41,15 +41,15 @@ RED.debug = (function() {
var content = $("<div>").css({"position":"relative","height":"100%"}); var content = $("<div>").css({"position":"relative","height":"100%"});
var toolbar = $('<div class="red-ui-sidebar-header">'+ var toolbar = $('<div class="red-ui-sidebar-header">'+
'<span class="button-group"><a id="debug-tab-filter" class="red-ui-sidebar-header-button" href="#"><i class="fa fa-filter"></i> <span></span></a></span>'+ '<span class="button-group"><a id="red-ui-sidebar-debug-filter" class="red-ui-sidebar-header-button" href="#"><i class="fa fa-filter"></i> <span></span></a></span>'+
'<span class="button-group"><a id="debug-tab-clear" class="red-ui-sidebar-header-button" href="#" data-i18n="[title]node-red:debug.sidebar.clearLog"><i class="fa fa-trash"></i></a></span></div>').appendTo(content); '<span class="button-group"><a id="red-ui-sidebar-debug-clear" class="red-ui-sidebar-header-button" href="#" data-i18n="[title]node-red:debug.sidebar.clearLog"><i class="fa fa-trash"></i></a></span></div>').appendTo(content);
var footerToolbar = $('<div>'+ var footerToolbar = $('<div>'+
// '<span class="button-group">'+ // '<span class="button-group">'+
// '<a class="red-ui-footer-button-toggle text-button selected" id="debug-tab-view-list" href="#"><span data-i18n="">list</span></a>'+ // '<a class="red-ui-footer-button-toggle text-button selected" id="red-ui-sidebar-debug-view-list" href="#"><span data-i18n="">list</span></a>'+
// '<a class="red-ui-footer-button-toggle text-button" id="debug-tab-view-table" href="#"><span data-i18n="">table</span></a> '+ // '<a class="red-ui-footer-button-toggle text-button" id="red-ui-sidebar-debug-view-table" href="#"><span data-i18n="">table</span></a> '+
// '</span>'+ // '</span>'+
'<span class="button-group"><a id="debug-tab-open" class="red-ui-footer-button" href="#" data-i18n="[title]node-red:debug.sidebar.openWindow"><i class="fa fa-desktop"></i></a></span> ' + '<span class="button-group"><a id="red-ui-sidebar-debug-open" class="red-ui-footer-button" href="#" data-i18n="[title]node-red:debug.sidebar.openWindow"><i class="fa fa-desktop"></i></a></span> ' +
'</div>'); '</div>');
messageList = $('<div class="red-ui-debug-content debug-content-list"/>').appendTo(content); messageList = $('<div class="red-ui-debug-content debug-content-list"/>').appendTo(content);
@ -59,9 +59,9 @@ RED.debug = (function() {
var filterDialog = $('<div class="red-ui-debug-filter-box hide">'+ var filterDialog = $('<div class="red-ui-debug-filter-box hide">'+
'<div class="red-ui-debug-filter-row">'+ '<div class="red-ui-debug-filter-row">'+
'<span class="button-group">'+ '<span class="button-group">'+
'<a class="red-ui-sidebar-header-button-toggle debug-tab-filter-option selected" id="debug-tab-filterAll" href="#"><span data-i18n="node-red:debug.sidebar.filterAll"></span></a>'+ '<a class="red-ui-sidebar-header-button-toggle red-ui-sidebar-debug-filter-option selected" id="red-ui-sidebar-debug-filterAll" href="#"><span data-i18n="node-red:debug.sidebar.filterAll"></span></a>'+
'<a class="red-ui-sidebar-header-button-toggle debug-tab-filter-option" id="debug-tab-filterSelected" href="#"><span data-i18n="node-red:debug.sidebar.filterSelected"></span></a>'+ '<a class="red-ui-sidebar-header-button-toggle red-ui-sidebar-debug-filter-option" id="red-ui-sidebar-debug-filterSelected" href="#"><span data-i18n="node-red:debug.sidebar.filterSelected"></span></a>'+
'<a class="red-ui-sidebar-header-button-toggle debug-tab-filter-option" id="debug-tab-filterCurrent" href="#"><span data-i18n="node-red:debug.sidebar.filterCurrent"></span></a> '+ '<a class="red-ui-sidebar-header-button-toggle red-ui-sidebar-debug-filter-option" id="red-ui-sidebar-debug-filterCurrent" href="#"><span data-i18n="node-red:debug.sidebar.filterCurrent"></span></a> '+
'</span>'+ '</span>'+
'</div>'+ '</div>'+
'</div>').appendTo(toolbar);//content); '</div>').appendTo(toolbar);//content);
@ -142,13 +142,13 @@ RED.debug = (function() {
console.log("TODO: i18n library support"); console.log("TODO: i18n library support");
} }
toolbar.find('#debug-tab-filter span').text(RED._('node-red:debug.sidebar.filterAll')); toolbar.find('#red-ui-sidebar-debug-filter span').text(RED._('node-red:debug.sidebar.filterAll'));
var filterButtonHandler = function(type) { var filterButtonHandler = function(type) {
return function(e) { return function(e) {
e.preventDefault(); e.preventDefault();
if (filterType !== type) { if (filterType !== type) {
$('.debug-tab-filter-option').removeClass('selected'); $('.red-ui-sidebar-debug-filter-option').removeClass('selected');
$(this).addClass('selected'); $(this).addClass('selected');
if (filterType === 'filterSelected') { if (filterType === 'filterSelected') {
debugNodeListRow.slideUp(); debugNodeListRow.slideUp();
@ -158,29 +158,29 @@ RED.debug = (function() {
debugNodeListRow.slideDown(); debugNodeListRow.slideDown();
} }
$('#debug-tab-filter span').text(RED._('node-red:debug.sidebar.'+filterType)); $('#red-ui-sidebar-debug-filter span').text(RED._('node-red:debug.sidebar.'+filterType));
refreshMessageList(); refreshMessageList();
} }
} }
} }
filterDialog.find('#debug-tab-filterAll').on("click",filterButtonHandler('filterAll')); filterDialog.find('#red-ui-sidebar-debug-filterAll').on("click",filterButtonHandler('filterAll'));
filterDialog.find('#debug-tab-filterSelected').on("click",filterButtonHandler('filterSelected')); filterDialog.find('#red-ui-sidebar-debug-filterSelected').on("click",filterButtonHandler('filterSelected'));
filterDialog.find('#debug-tab-filterCurrent').on("click",filterButtonHandler('filterCurrent')); filterDialog.find('#red-ui-sidebar-debug-filterCurrent').on("click",filterButtonHandler('filterCurrent'));
// $('#debug-tab-view-list').on("click",function(e) { // $('#red-ui-sidebar-debug-view-list').on("click",function(e) {
// e.preventDefault(); // e.preventDefault();
// if (!$(this).hasClass('selected')) { // if (!$(this).hasClass('selected')) {
// $(this).addClass('selected'); // $(this).addClass('selected');
// $('#debug-tab-view-table').removeClass('selected'); // $('#red-ui-sidebar-debug-view-table').removeClass('selected');
// showMessageList(); // showMessageList();
// } // }
// }); // });
// $('#debug-tab-view-table').on("click",function(e) { // $('#red-ui-sidebar-debug-view-table').on("click",function(e) {
// e.preventDefault(); // e.preventDefault();
// if (!$(this).hasClass('selected')) { // if (!$(this).hasClass('selected')) {
// $(this).addClass('selected'); // $(this).addClass('selected');
// $('#debug-tab-view-list').removeClass('selected'); // $('#red-ui-sidebar-debug-view-list').removeClass('selected');
// showMessageTable(); // showMessageTable();
// } // }
// }); // });
@ -188,21 +188,21 @@ RED.debug = (function() {
var hideFilterTimeout; var hideFilterTimeout;
toolbar.on('mouseleave',function() { toolbar.on('mouseleave',function() {
if ($('#debug-tab-filter').hasClass('selected')) { if ($('#red-ui-sidebar-debug-filter').hasClass('selected')) {
clearTimeout(hideFilterTimeout); clearTimeout(hideFilterTimeout);
hideFilterTimeout = setTimeout(function() { hideFilterTimeout = setTimeout(function() {
filterVisible = false; filterVisible = false;
$('#debug-tab-filter').removeClass('selected'); $('#red-ui-sidebar-debug-filter').removeClass('selected');
filterDialog.slideUp(200); filterDialog.slideUp(200);
},300); },300);
} }
}); });
toolbar.on('mouseenter',function() { toolbar.on('mouseenter',function() {
if ($('#debug-tab-filter').hasClass('selected')) { if ($('#red-ui-sidebar-debug-filter').hasClass('selected')) {
clearTimeout(hideFilterTimeout); clearTimeout(hideFilterTimeout);
} }
}) })
toolbar.find('#debug-tab-filter').on("click",function(e) { toolbar.find('#red-ui-sidebar-debug-filter').on("click",function(e) {
e.preventDefault(); e.preventDefault();
if ($(this).hasClass('selected')) { if ($(this).hasClass('selected')) {
filterVisible = false; filterVisible = false;
@ -216,13 +216,13 @@ RED.debug = (function() {
filterDialog.slideDown(200); filterDialog.slideDown(200);
} }
}); });
RED.popover.tooltip(toolbar.find('#debug-tab-filter'),RED._('node-red:debug.sidebar.filterLog')); RED.popover.tooltip(toolbar.find('#red-ui-sidebar-debug-filter'),RED._('node-red:debug.sidebar.filterLog'));
toolbar.find("#debug-tab-clear").on("click", function(e) { toolbar.find("#red-ui-sidebar-debug-clear").on("click", function(e) {
e.preventDefault(); e.preventDefault();
clearMessageList(false); clearMessageList(false);
}); });
RED.popover.tooltip(toolbar.find("#debug-tab-clear"),RED._('node-red:debug.sidebar.clearLog')); RED.popover.tooltip(toolbar.find("#red-ui-sidebar-debug-clear"),RED._('node-red:debug.sidebar.clearLog'));
@ -351,11 +351,11 @@ RED.debug = (function() {
filteredNodes[n.id] = true; filteredNodes[n.id] = true;
}); });
delete filteredNodes[sourceId]; delete filteredNodes[sourceId];
$("#debug-tab-filterSelected").trigger("click"); $("#red-ui-sidebar-debug-filterSelected").trigger("click");
refreshMessageList(); refreshMessageList();
}}, }},
{id:"red-ui-debug-msg-menu-item-clear-filter",label:RED._("node-red:debug.messageMenu.clearFilter"),onselect:function(){ {id:"red-ui-debug-msg-menu-item-clear-filter",label:RED._("node-red:debug.messageMenu.clearFilter"),onselect:function(){
$("#debug-tab-filterAll").trigger("click"); $("#red-ui-sidebar-debug-filterAll").trigger("click");
refreshMessageList(); refreshMessageList();
}} }}
] ]
@ -542,9 +542,9 @@ RED.debug = (function() {
function clearFilterSettings() { function clearFilterSettings() {
filteredNodes = {}; filteredNodes = {};
filterType = 'filterAll'; filterType = 'filterAll';
$('.debug-tab-filter-option').removeClass('selected'); $('.red-ui-sidebar-debug-filter-option').removeClass('selected');
$('#debug-tab-filterAll').addClass('selected'); $('#red-ui-sidebar-debug-filterAll').addClass('selected');
$('#debug-tab-filter span').text(RED._('node-red:debug.sidebar.filterAll')); $('#red-ui-sidebar-debug-filter span').text(RED._('node-red:debug.sidebar.filterAll'));
$('#debug-filter-node-list-row').slideUp(); $('#debug-filter-node-list-row').slideUp();
} }