Implement actions badge svgs

[nanguanlin6]

replace #27187
close #23688
The badge has two parts: label(workflow name) and message(action status). 5 colors are provided with 7 statuses.
Color mapping:

var statusColorMap = map[actions_model.Status]string{
	actions_model.StatusSuccess:   "#4c1",    // Green
	actions_model.StatusSkipped:   "#dfb317", // Yellow
	actions_model.StatusUnknown:   "#97ca00", // Light Green
	actions_model.StatusFailure:   "#e05d44", // Red
	actions_model.StatusCancelled: "#fe7d37", // Orange
	actions_model.StatusWaiting:   "#dfb317", // Yellow
	actions_model.StatusRunning:   "#dfb317", // Yellow
	actions_model.StatusBlocked:   "#dfb317", // Yellow
}

preview:

[silverwind]

Very nice, even without dependencies 👍

[silverwind]

The go-badge library you mentioned is not suitable for our case

I guess the only difference is that the library probably supports more styling options, but that can be added later.

Is this will cause a License problem

I assume this counts as "Derivative Works" which is allowed in their Apache 2.0 Licence. I would put a comment and link to original repo like this. Not sure if worth it to include a full copy of the license as well, but if we follow it strictly, we should.

[silverwind]

Some docs on this would be nice, like this.

[wxiaoguang]

Is it right to do so (guessing font size)?

The SVG uses font-family="Geneva,DejaVu Sans,sans-serif", do you really know its width on client side?

[silverwind]

I think there is no way knowing how wide it would render on a client, but as long as these approximations work on common clients, I can accept them.

[KN4CK3R]

@lng2020 Are you still working on this PR?

[nanguanlin6]

Sorry. I thought this one was replaced by #28585. But it turns out that one was closed last month.

@lng2020 Are you still working on this PR?

Would you like to take over or would you like me to finish? I can solve most reviews above except the client-side font problem.

Is it right to do so (guessing font size)?
The SVG uses font-family="Geneva,DejaVu Sans,sans-serif", do you really know its width on client side?

Or this PR can be replaced by a more well-designed badge system, which includes more badges like issue status.

[yp05327]

So the problem now is that do we need an internal badge system?
If we do, I think the benefit is that users can easily use it without considering the authorization problems for private repos and no internet access instances.

ps: tried the service mentioned above, it works, but not all things supported.
https://img.shields.io/gitea/issues/closed/gitea/gitea-docusaurus?gitea_url=https://gitea.com

[silverwind]

I think as a start, we can serve just the action badges, more can come later if there is demand and I think this PR lays a good base, so let's get it finished.

[yp05327]

Longer label name more empty space:

[wxiaoguang]

Longer label name more empty space:

I think it is good enough for daily usage. Why end users need so long a label.

[nanguanlin6]

Longer label name more empty space

As expected. The function calculates the text length is

func (m Message) TextLength() int {
	return int(float64(m.width-defaultOffset) * 9.5)
}

So the text width is only about 95% of the whole width. If the text is long, the remaining 5% will become noticeable.

[GiteaBot]

@lng2020 please fix the merge conflicts. 🍵