PrismJS / prism

Lightweight, robust, elegant syntax highlighting.
https://prismjs.com
MIT License
12.33k stars 1.29k forks source link

JavaScript syntax number strings rendered with an offset #3791

Closed andie2019 closed 7 months ago

andie2019 commented 7 months ago

Information:

Description When using the JavaScript language syntax, number strings not specified inside quotation marks would be rendered off the codeblock, overlapping the left margin.

Snag_fdf629

In this example, the first two parameters should be rendered as: "accountId": 12345, "workspaceId": [ 12345 ],

Number strings render correctly when placed inside quotation marks, or when using a different syntax.

Under the section Search Response Attributes > Response: The first response codeblock is rendered in JavaScript (number strings are offset to the left margin) The second codeblock is rendered in another language (number strings placed correctly)

FIameCaster commented 7 months ago

There's a CSS selector in perforce.css that matches number tokens generated by Prism.

span.number
{
    float: left;
    margin-left: -24px;
    position: relative;
    font-family: 'Open Sans';
}

Change the selector to something like span.number:not(.token) and the problem is fixed.

andie2019 commented 7 months ago

Thanks you FlameCaster, will try this! Edit: All good now! Will close this ticket! Thanks again~~