Generate multiple badges arranged horizontally with the same height.
Usage
create_badge_row(
badges_data,
default_color = "white",
spacing = 4,
font = "Jost",
fontsize = 10,
uniform_height = TRUE
)Examples
badges <- list(
list(label = "UH", value = "192"),
list(label = "Recurso Federal", value = "36,4 milhões"),
list(label = "Contrapartida", value = "0,0")
)
create_badge_row(badges, default_color = "white")
#> [1] "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"345\" height=\"19\"><g transform=\"translate(0.0, 0)\">\n <title>UH: 192</title>\n \n <linearGradient id=\"s6e38805f\" x2=\"0\" y2=\"100%\">\n <stop offset=\"0\" stop-color=\"#bbb\" stop-opacity=\".1\"/>\n <stop offset=\"1\" stop-opacity=\".1\"/>\n </linearGradient>\n <clipPath id=\"r6e38805f\">\n <rect width=\"58\" height=\"19\" rx=\"3\" ry=\"3\" fill=\"#fff\"/>\n </clipPath>\n <g clip-path=\"url(#r6e38805f)\">\n <rect width=\"58\" height=\"19\" fill=\"#555\"/>\n <rect x=\"25\" width=\"33\" height=\"19\" fill=\"white\"/>\n <rect width=\"58\" height=\"19\" fill=\"url(#s6e38805f)\"/>\n </g>\n <g fill=\"#fff\" text-anchor=\"middle\" font-family=\"Jost\" font-size=\"10\" dominant-baseline=\"middle\">\n <text x=\"14.4\" y=\"12.6\" fill=\"#010101\" text-rendering=\"geometricPrecision\" alignment-baseline=\"middle\" fill-opacity=\".3\">UH</text>\n <text x=\"12.4\" y=\"10.6\" text-rendering=\"geometricPrecision\" alignment-baseline=\"middle\" fill=\"#fff\">UH</text>\n <text x=\"43.4\" y=\"12.6\" text-rendering=\"geometricPrecision\" alignment-baseline=\"middle\" fill=\"#ccc\" fill-opacity=\".3\">192</text>\n <text x=\"41.4\" y=\"10.6\" text-rendering=\"geometricPrecision\" alignment-baseline=\"middle\" fill=\"#333\">192</text>\n </g>\n </g><g transform=\"translate(62.0, 0)\">\n <title>Recurso Federal: 36,4 milhões</title>\n \n <linearGradient id=\"s6fe5d506\" x2=\"0\" y2=\"100%\">\n <stop offset=\"0\" stop-color=\"#bbb\" stop-opacity=\".1\"/>\n <stop offset=\"1\" stop-opacity=\".1\"/>\n </linearGradient>\n <clipPath id=\"r6fe5d506\">\n <rect width=\"170\" height=\"19\" rx=\"3\" ry=\"3\" fill=\"#fff\"/>\n </clipPath>\n <g clip-path=\"url(#r6fe5d506)\">\n <rect width=\"170\" height=\"19\" fill=\"#555\"/>\n <rect x=\"91\" width=\"79\" height=\"19\" fill=\"white\"/>\n <rect width=\"170\" height=\"19\" fill=\"url(#s6fe5d506)\"/>\n </g>\n <g fill=\"#fff\" text-anchor=\"middle\" font-family=\"Jost\" font-size=\"10\" dominant-baseline=\"middle\">\n <text x=\"47.5\" y=\"12.6\" fill=\"#010101\" text-rendering=\"geometricPrecision\" alignment-baseline=\"middle\" fill-opacity=\".3\">Recurso Federal</text>\n <text x=\"45.5\" y=\"10.6\" text-rendering=\"geometricPrecision\" alignment-baseline=\"middle\" fill=\"#fff\">Recurso Federal</text>\n <text x=\"132.3\" y=\"12.6\" text-rendering=\"geometricPrecision\" alignment-baseline=\"middle\" fill=\"#ccc\" fill-opacity=\".3\">36,4 milhões</text>\n <text x=\"130.3\" y=\"10.6\" text-rendering=\"geometricPrecision\" alignment-baseline=\"middle\" fill=\"#333\">36,4 milhões</text>\n </g>\n </g><g transform=\"translate(236.0, 0)\">\n <title>Contrapartida: 0,0</title>\n \n <linearGradient id=\"s4cb16526\" x2=\"0\" y2=\"100%\">\n <stop offset=\"0\" stop-color=\"#bbb\" stop-opacity=\".1\"/>\n <stop offset=\"1\" stop-opacity=\".1\"/>\n </linearGradient>\n <clipPath id=\"r4cb16526\">\n <rect width=\"109\" height=\"19\" rx=\"3\" ry=\"3\" fill=\"#fff\"/>\n </clipPath>\n <g clip-path=\"url(#r4cb16526)\">\n <rect width=\"109\" height=\"19\" fill=\"#555\"/>\n <rect x=\"79\" width=\"30\" height=\"19\" fill=\"white\"/>\n <rect width=\"109\" height=\"19\" fill=\"url(#s4cb16526)\"/>\n </g>\n <g fill=\"#fff\" text-anchor=\"middle\" font-family=\"Jost\" font-size=\"10\" dominant-baseline=\"middle\">\n <text x=\"41.7\" y=\"12.6\" fill=\"#010101\" text-rendering=\"geometricPrecision\" alignment-baseline=\"middle\" fill-opacity=\".3\">Contrapartida</text>\n <text x=\"39.7\" y=\"10.6\" text-rendering=\"geometricPrecision\" alignment-baseline=\"middle\" fill=\"#fff\">Contrapartida</text>\n <text x=\"96.3\" y=\"12.6\" text-rendering=\"geometricPrecision\" alignment-baseline=\"middle\" fill=\"#ccc\" fill-opacity=\".3\">0,0</text>\n <text x=\"94.3\" y=\"10.6\" text-rendering=\"geometricPrecision\" alignment-baseline=\"middle\" fill=\"#333\">0,0</text>\n </g>\n </g></svg>"