Improve code highlighting in web UI

[pat-s]

@woodpecker-ci/maintainers as this might be another controversial design decision, please vote on the initial post of this PR with 👍 and 👎

---

This introduces a custom color. However, I found no color of the current palette to be matching here and/or creating a good contrast.
In addition, I slightly tweaked the padding and rounding values.

Before

After

[xoxys]

Im not against changing the code block color but not this way. If we want a new one we should create a new color theme with --wp-code-{100,200,300}.

[xoxys]

Keep in mind its used in various other places as well.

[pat-s]

I don't think we need a full palette for a single light/dark code highlighting color.

I agree the naming is not optimal and doesn't fit into the current schema. Open for suggestions.

[xoxys]

We dont need a full pallete right now we only have 100 and 200 just change the color of these.

[pat-s]

100 and 200 are usually shades of bigger palette with 100 being the lightest value. We don't have a "real" palette for wp-code. Yes, two values exist

  --wp-code-100: theme('colors.int-wp-secondary.300');
  --wp-code-200: theme('colors.int-wp-secondary.600');

and yes, these again refer to another palette, but these values are also somewhat arbitrary and IMO not matching well in the UI. Hence I don't think that mimicking a palette is the best way forward here.

There should only be one color for wp-code ever IMO, for both light and dark. How about consolidating the two existing ones to one definition named wp-code? The two existing ones are only used in one instance in the code, respectively.

[xoxys]

We are getting lost in discussions again. At the end, I don't really care, and wp-code works for me as well.

[pat-s]

Hm, I think this was just a normal discussion? You brought up some reasons, I replied and shared my thoughts. It is not even about subjective UI but code syntax, so I'd say such discussions are normal (and needed and good).

[xoxys]

Sorry this was not meant to be offensive or rude :) The color is only used in one location. While I have some personal preferences, I don't care much enough to discuss further how it is done in detail. wp-code works for me we can still change it later on if there is any need for a color palette. Sorry if my last message was misleading.