Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Codeblocks syntax highlighting and background #5550

Open
ErikMichelson opened this issue Apr 8, 2024 · 0 comments
Open

Codeblocks syntax highlighting and background #5550

ErikMichelson opened this issue Apr 8, 2024 · 0 comments
Labels
feature: editor Everything related to the editor page or the CodeMirror editor itself scope: frontend Only relevant for the frontend type: bug Something isn't working
Milestone

Comments

@ErikMichelson
Copy link
Member

ErikMichelson commented Apr 8, 2024

Description

Codeblocks (with fences) do not have a background-color. Thus it's harder to distinguish them from other text content.
Another effect hardening that problem is the fact that for certain languages the syntax-highlighting keywords do not match the autocomplete suggestion.

Steps to reproduce

Create a new note with the following content (ignore the backslashes) and view it both in light and dark mode in HD2. Compare it also with the results in HD1:

\```
test codeblock without background
\```

Invalid autocomplete suggestions:
\```ts
// ts vs typescript as language
const a = {
  "a": -5
}: Record<string, number>;
const b = window.atob(JSON.stringify(a));
window.open(`https://hedgedoc.org/#x=${b}`)
\```

\```js=
// neither js nor javascript is suggested
const a = {
  "a": -5
};
const b = window.atob(JSON.stringify(a));
window.open(`https://hedgedoc.org/#x=${b}`)
\```

Expected behaviour

Autocomplete suggestions should (only) include the languages that are supported by our rendering syntax highlighting.
Codeblocks should have a decent background color to distinguish them from the other content.

Logs

No response

Config

No response

Your Setup

  • hedgedoc.dev
  • Chrome 123, Ubuntu 23.10

Additional context

image

vs

image

@ErikMichelson ErikMichelson added type: bug Something isn't working scope: frontend Only relevant for the frontend feature: editor Everything related to the editor page or the CodeMirror editor itself labels Apr 8, 2024
@ErikMichelson ErikMichelson added this to the Version 2.0 milestone Apr 8, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
feature: editor Everything related to the editor page or the CodeMirror editor itself scope: frontend Only relevant for the frontend type: bug Something isn't working
Projects
None yet
Development

No branches or pull requests

1 participant