Apply extended space also on text icons.

This commit is contained in:
Bruno Feurer 2022-08-28 22:49:36 +02:00
parent c20ff8efd5
commit 3964422855

View File

@ -4149,20 +4149,22 @@ RED.view = (function() {
iconUrl = RED.settings.apiRootUrl+"icons/"+iconPath.module+"/"+iconPath.file; 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) { if (fontAwesomeUnicode) {
// Since Node-RED workspace uses SVG, i tag cannot be used for font-awesome icon. // Since Node-RED workspace uses SVG, i tag cannot be used for font-awesome icon.
// On SVG, use text tag as an alternative. // On SVG, use text tag as an alternative.
icon_group.append("text") icon_group.append("text")
.attr("xlink:href",iconUrl) .attr("xlink:href",iconUrl)
.attr("class","fa-lg") .attr("class","fa-lg")
.attr("x",15) .attr("x",15+offsetX)
.text(fontAwesomeUnicode); .text(fontAwesomeUnicode);
} else { } else {
var icon = icon_group.append("image") var icon = icon_group.append("image")
.style("display","none") .style("display","none")
.attr("xlink:href",iconUrl) .attr("xlink:href",iconUrl)
.attr("class","red-ui-flow-node-icon") .attr("class","red-ui-flow-node-icon")
.attr("x",0) .attr("x",0+offsetX)
.attr("width","30") .attr("width","30")
.attr("height","30"); .attr("height","30");
@ -4179,7 +4181,7 @@ RED.view = (function() {
var height = img.height * scaleFactor; var height = img.height * scaleFactor;
icon.attr("width",width); icon.attr("width",width);
icon.attr("height",height); icon.attr("height",height);
icon.attr("x",15-width/2); icon.attr("x",15-width/2+offsetX);
} }
icon.attr("xlink:href",iconUrl); icon.attr("xlink:href",iconUrl);
icon.style("display",null); icon.style("display",null);
@ -4892,12 +4894,8 @@ RED.view = (function() {
icon.attr("y",function(){return (d.h-d3.select(this).attr("height"))/2;}); 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 iconShadeHeight = d.h
const iconShadeWidth = d.inputs && d.outputs ? 33 : 30 const iconShadeWidth = d.inputs && d.outputs ? 32 : 30
this.__iconShade__.setAttribute("d", hideLabel ? 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` : ( `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 ? "right" === d._def.align ?