diff --git a/lib/index.js b/lib/index.js index 77c0a13..8d5357d 100644 --- a/lib/index.js +++ b/lib/index.js @@ -7,8 +7,9 @@ module.exports = function ({subject, status, color, style, emoji, icon, iconWidt color = colorPresets[color] || color || colorPresets['blue'] const iconSpanWidth = icon ? (subject.length ? iconWidth + 4 : iconWidth - 2) : 0 + const sbTextWidth = calcWidth(subject, emoji) const stTextWidth = calcWidth(status, emoji) - const sbRectWidth = calcWidth(subject, emoji) + 10 + iconSpanWidth + const sbRectWidth = sbTextWidth + 10 + iconSpanWidth const stRectWidth = stTextWidth + 10 const width = sbRectWidth + stRectWidth @@ -20,8 +21,8 @@ module.exports = function ({subject, status, color, style, emoji, icon, iconWidt <rect x="${sbRectWidth}" width="${stRectWidth}" height="20" fill="#${color}"/> </g> <g fill="#fff" text-anchor="start" font-family="Verdana,DejaVu Sans,sans-serif" font-size="11"> - <text x="${icon ? '22.5' : '6'}" y="14.8" fill="#000" opacity="0.1">${subject}</text> - <text x="${icon ? '21.5' : '5'}" y="13.8">${subject}</text> + <text x="${icon ? '22.5' : '6'}" y="14.8" textLength="${sbTextWidth}" fill="#000" opacity="0.1">${subject}</text> + <text x="${icon ? '21.5' : '5'}" y="13.8" textLength="${sbTextWidth}">${subject}</text> <text x="${sbRectWidth + 5.5}" y="14.8" fill="#000" opacity="0.1" textLength="${stTextWidth}">${status}</text> <text x="${sbRectWidth + 4.5}" y="13.8" textLength="${stTextWidth}">${status}</text> </g> @@ -43,8 +44,8 @@ module.exports = function ({subject, status, color, style, emoji, icon, iconWidt <rect width="${width}" height="20" fill="url(#a)"/> </g> <g fill="#fff" text-anchor="start" font-family="Verdana,DejaVu Sans,sans-serif" font-size="11"> - <text x="${icon ? '22.5' : '6'}" y="14.8" fill="#000" opacity="0.25">${subject}</text> - <text x="${icon ? '21.5' : '5'}" y="13.8">${subject}</text> + <text x="${icon ? '22.5' : '6'}" y="14.8" textLength="${sbTextWidth}" fill="#000" opacity="0.25">${subject}</text> + <text x="${icon ? '21.5' : '5'}" y="13.8" textLength="${sbTextWidth}">${subject}</text> <text x="${sbRectWidth + 5.5}" y="14.8" fill="#000" opacity="0.25" textLength="${stTextWidth}">${status}</text> <text x="${sbRectWidth + 4.5}" y="13.8" textLength="${stTextWidth}">${status}</text> </g>