diff --git a/src/api/badge.js b/src/api/badge.js
index 14fa3fc..14eea55 100644
--- a/src/api/badge.js
+++ b/src/api/badge.js
@@ -42,8 +42,9 @@ router.get('/badge', async (req, res) => {
const iconSize = size;
const fontSize = calcFontSize(iconSize);
const textPadding = Math.round(iconSize * 0.4);
+ const textHpad = Math.round(fontSize * 0.6); // horizontal padding inside text rect
const radius = style === 'flat' ? 3 : 0;
- const textWidth = estimateTextWidth(effectiveLabel, fontSize);
+ const textWidth = estimateTextWidth(effectiveLabel, fontSize) + textHpad * 2;
// Kinyerjük az ikon SVG-ből a width és height attribútumokat (ha vannak)
let iconViewBoxWidth = iconSize;
@@ -54,8 +55,9 @@ router.get('/badge', async (req, res) => {
if (heightMatch) iconViewBoxHeight = parseFloat(heightMatch[1]);
// Ikon doboz mérete
- const iconBoxWidth = iconViewBoxWidth + 5;
- const iconBoxHeight = iconViewBoxHeight + 5;
+ const iconPad = 5;
+ const iconBoxWidth = iconViewBoxWidth + iconPad;
+ const iconBoxHeight = iconViewBoxHeight + iconPad;
// Ha a color paraméter nincs megadva, próbáljuk kinyerni az ikon színét
let effectiveColor = color;
@@ -79,12 +81,12 @@ router.get('/badge', async (req, res) => {
const fontWeight = safeFontWeight; // paraméterből
if (labelpos === 'left') {
- // Külön dobozok: padding csak a széleken kell, a dobozokon belül nem!
+ // Külön dobozok: padding a szöveg körül!
textElem = `
${safeLabel}`;
iconGroup = `
-
- ${iconSVG}
+
+ ${iconSVG}
`;
} else if (labelpos === 'above' || labelpos === 'below') {
// Felső vagy alsó label: ikon doboz magassága = iconSize + 5, szélessége = szöveg doboz szélessége
diff --git a/src/lib/svg-utils.js b/src/lib/svg-utils.js
index 07ac730..e2c1922 100644
--- a/src/lib/svg-utils.js
+++ b/src/lib/svg-utils.js
@@ -7,10 +7,11 @@ const FONT_FAMILY = 'Verdana,Geneva,DejaVu Sans,sans-serif';
const calcFontSize = (size) => Math.round(size * 0.6);
/**
- * Rough text-width estimate based on font-size and character count.
- * Uses a 0.6 coefficient which works well for Verdana / sans-serif.
+ * Text-width estimate based on font-size and character count.
+ * Uses a 0.65 coefficient with Verdana which has wider letterforms.
+ * Adds extra padding so the text never touches the rect edges.
*/
const estimateTextWidth = (text, fontSize) =>
- text.length * fontSize * 0.6;
+ text.length * fontSize * 0.65 + fontSize * 0.8;
module.exports = { FONT_FAMILY, calcFontSize, estimateTextWidth };
diff --git a/test/svg-utils.test.js b/test/svg-utils.test.js
index 61f4f1f..41d431a 100644
--- a/test/svg-utils.test.js
+++ b/test/svg-utils.test.js
@@ -29,17 +29,21 @@ describe('svg-utils', () => {
describe('estimateTextWidth', () => {
it('should estimate width based on text length and font size', () => {
const width = estimateTextWidth('Hello', 14);
- expect(width).toBe(5 * 14 * 0.6); // 42
+ // formula: text.length * fontSize * 0.65 + fontSize * 0.8
+ expect(width).toBe(5 * 14 * 0.65 + 14 * 0.8); // 56.7
});
- it('should return 0 for empty string', () => {
- expect(estimateTextWidth('', 14)).toBe(0);
+ it('should include padding for empty string', () => {
+ // Even empty strings get the base padding
+ expect(estimateTextWidth('', 14)).toBe(14 * 0.8); // 11.2
});
- it('should scale linearly with font size', () => {
+ it('should scale with font size', () => {
const w1 = estimateTextWidth('test', 10);
const w2 = estimateTextWidth('test', 20);
- expect(w2).toBe(w1 * 2);
+ // w1 = 4*10*0.65 + 10*0.8 = 34
+ // w2 = 4*20*0.65 + 20*0.8 = 68
+ expect(w2).toBe(68);
});
});
});