Inconsistent font size in code samples

[avuserow]

Describe the bug

Note how the text given is larger than the surrounding text.

I see in the dev tools that there are pretty different font-size rules applied to the control CSS class (1rem) vs the pre element (0.875rem). Disabling that part of the rule makes it look better so I don't think it's an issue with my setup.

To Reproduce Steps to reproduce the behavior: View any page with code, notice that some keywords are larger than others.

Expected behavior

Code is all the same size.

Screenshots

See above.

Desktop (please complete the following information):

Running Mozilla/5.0 (X11; Linux x86_64; rv:130.0) Gecko/20100101 Firefox/130.0 on Fedora Linux 40 at a resolution of 1920x1200.

Smartphone (please complete the following information):

Additional context

[finanalyst]

@avuserow thank you for posting this issue. It is an irritating flaw once its been pointed out. The problem is (almost certainly) in the syntax highlighting of code blocks, or rather the CSS associated with span classes within which the words are embedded. Some bad news and good news.

• bad news: syntax highlighting with the tool chain used to render the Raku documentation suite is done with software that has not been maintained for several years. Further the highlighter was based on a NET framework that is itself out of date, and the only part of toolchain that uses NET. It has long been an aim to replace this software.
• goodish news: two new syntax highlighters written in Rakudo have been developed in the last two/three months by @lizmat and @patrickbkr . These are used in the new RakuAST::RakuDoc renderer, so they will be used as soon as the new renderer can render the entire Raku documentation suite.

To fix the current problem, without waiting for the new rendering, it will be necessary:

• identify which of the categories are given 0.75em and which are not
• why there is a difference Highlighting SCSS can be located in this distribution under Website/plugins/hiliter/scss, and the colors are labelled cm-ayaya. The colors are defined separately for the light and dark themes.

I did look quickly at the SCSS, but it will take rather more time to sort out than I have at this moment.

If you think this needs solving now, your help in finding a consistent fix would be appreciated.

Since there will be new span classes, all of the CSS will need to be changed. The new highlighters classify keywords differently, and there are different categories keywords are put into.