Enhance the visual style for <code> tag in KB articles

[dannycolin]

Step to reproduce

0. Create or edit a KB article
1. Add a <code> tag
2. Preview the content

Actual behavior

The content in between <code> use a monospace font.

Expected behavior

The content should still use a monospace font but it should also have a border and a different background-color around it to clearly delimit it.

[Rexogamer]

I've made a basic mockup using DevTools, but I have one question - does the text look better unbolded

or should it remain as-is?

For reference, here's the CSS:

code {
  font-size: .875em;
  background: var(--color-light-gray-03);
  border: 2px solid var(--color-light-gray-05);
  border-radius: 3px;
  padding: 1px;
}

[dannycolin]

does the text look better unbolded

It does look better without the bold styling.

[Rexogamer]

It looks like the (S)CSS for this is here - I'm not sure if other Mozilla projects using Protocol would have any objections to this change, so it might be worth opening an issue there

[Rexogamer]

Update: it is, in fact, within Kitsune