Skip to content

Fix rmd preview chunk colouring#867

Merged
renkun-ken merged 3 commits intoREditorSupport:masterfrom
ElianHugh:rmd-preview-colour-fix
Nov 17, 2021
Merged

Fix rmd preview chunk colouring#867
renkun-ken merged 3 commits intoREditorSupport:masterfrom
ElianHugh:rmd-preview-colour-fix

Conversation

@ElianHugh
Copy link
Copy Markdown
Collaborator

What problem did you solve?

Resolves #866. If a chunk background colour is not defined, fall back to a vscode theme colour

How can I check this pull request?

```
A non-code chunk
```

```{r}
1:100
```

If a chunk background colour is not defined, fall back to a vscode theme colour
Comment thread src/rmarkdown/preview.ts Outdated
outCol = `rgba(${regOut[0] ?? 100}, ${regOut[1] ?? 100}, ${regOut[2] ?? 100}, ${Number(regOut[3]) + 0.05 ?? .5})`;
} else {
chunkCol = 'var(--vscode-selection-background)';
outCol = 'var(--vscode-selection-background)';
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Should we make the chunk and output appear slightly different?

image

image

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks like we should use something like rgba(128, 128, 128, 0.1) and rgba(128, 128, 128, 0.05) to get a more consistent coloring under different themes.

Comment thread src/rmarkdown/preview.ts
const chunkCol = String(config().get('rmarkdown.chunkBackgroundColor'));
const colReg = /[0-9.]+/g;
const regOut = chunkCol.match(colReg);
const outCol = `rgba(${regOut[0] ?? 100}, ${regOut[1] ?? 100}, ${regOut[2] ?? 100}, ${Number(regOut[3]) + 0.05 ?? .5})`;
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I suspect that the alpha channel should be something like ${Number(regOut[3]) - 0.05 ?? .05} to make the output more like the background. In light themes, the default rendering looks like the code chunk is more highlighted than the output from the background.

Copy link
Copy Markdown
Member

@renkun-ken renkun-ken left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@renkun-ken renkun-ken merged commit 97e304c into REditorSupport:master Nov 17, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Rmd preview fails if chunk-background setting is empty

2 participants