echomike/badgedex
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

rect padding implemet
Node.js CI / build (push) Successful in 3m10s
Details

Browse Source
This commit is contained in:
echomike
2026-07-17 14:48:22 +02:00
parent ff20d1cb11
commit e7f0aa1c12
3 changed files with 21 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/api/badge.js
+8 -6
View File
@@ -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 = `<rect x="0" y="0" width="${textWidth}" height="${iconBoxHeight}" rx="${radius}" fill="${safeBgLabel}"/>
<text x="${textWidth / 2}" y="${iconBoxHeight / 2}" font-size="${fontSize}" font-family="${fontFamily}" font-weight="${fontWeight}" fill="${effectiveColor}" text-anchor="middle" dominant-baseline="middle">${safeLabel}</text>`;
iconGroup = `
<rect x="${textWidth}" y="0" width="${iconBoxWidth + 5}" height="${iconBoxHeight}" rx="${radius}" fill="${safeBgIcon}"/>
<g transform="translate(${textWidth + (5 / 2)}, ${(iconBoxHeight - iconSize) / 2})">${iconSVG}</g>
<rect x="${textWidth}" y="0" width="${iconBoxWidth}" height="${iconBoxHeight}" rx="${radius}" fill="${safeBgIcon}"/>
<g transform="translate(${textWidth + (iconPad / 2)}, ${(iconBoxHeight - iconSize) / 2})">${iconSVG}</g>
`;
} 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