diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/view.js b/packages/node_modules/@node-red/editor-client/src/js/ui/view.js index 801008df7..719b60fa3 100755 --- a/packages/node_modules/@node-red/editor-client/src/js/ui/view.js +++ b/packages/node_modules/@node-red/editor-client/src/js/ui/view.js @@ -4149,20 +4149,22 @@ RED.view = (function() { iconUrl = RED.settings.apiRootUrl+"icons/"+iconPath.module+"/"+iconPath.file; } } + const rightAlign = "right" === d._def.align + const offsetX = d.inputs && !rightAlign ? 2 : d.outputs && rightAlign ? -2 : 0 if (fontAwesomeUnicode) { // Since Node-RED workspace uses SVG, i tag cannot be used for font-awesome icon. // On SVG, use text tag as an alternative. icon_group.append("text") .attr("xlink:href",iconUrl) .attr("class","fa-lg") - .attr("x",15) + .attr("x",15+offsetX) .text(fontAwesomeUnicode); } else { var icon = icon_group.append("image") .style("display","none") .attr("xlink:href",iconUrl) .attr("class","red-ui-flow-node-icon") - .attr("x",0) + .attr("x",0+offsetX) .attr("width","30") .attr("height","30"); @@ -4179,7 +4181,7 @@ RED.view = (function() { var height = img.height * scaleFactor; icon.attr("width",width); icon.attr("height",height); - icon.attr("x",15-width/2); + icon.attr("x",15-width/2+offsetX); } icon.attr("xlink:href",iconUrl); icon.style("display",null); @@ -4892,12 +4894,8 @@ RED.view = (function() { icon.attr("y",function(){return (d.h-d3.select(this).attr("height"))/2;}); - const rightAlign = "right" === d._def.align - if (d.inputs && !rightAlign) icon.attr("x",3); - if (d.outputs && rightAlign) icon.attr("x",-3); - const iconShadeHeight = d.h - const iconShadeWidth = d.inputs && d.outputs ? 33 : 30 + const iconShadeWidth = d.inputs && d.outputs ? 32 : 30 this.__iconShade__.setAttribute("d", hideLabel ? `M5 0 h${iconShadeWidth-10} a 5 5 0 0 1 5 5 v${iconShadeHeight-10} a 5 5 0 0 1 -5 5 h-${iconShadeWidth-10} a 5 5 0 0 1 -5 -5 v-${iconShadeHeight-10} a 5 5 0 0 1 5 -5` : ( "right" === d._def.align ?