Vendor GitHub css #469
Vendor GitHub css #469
Conversation
|
Some before and afters in RStudio CRAN reprex (so before this PR), RStudio, dark mode 
With this PR, RStudio, dark mode 
|
|
Some before and afters in RStudio CRAN reprex (so before this PR), RStudio, light mode 
With this PR, RStudio, light mode 
|
|
Some before and afters in Positron, light mode (dark mode is shown elsewhere) CRAN reprex (so before this PR), Positron, light mode 
With this PR, Positron, light mode 
|
| @@ -63,3 +63,12 @@ newline <- function(x) paste0(x, "\n") | |||
| is_testing <- function() { | |||
| identical(Sys.getenv("TESTTHAT"), "true") | |||
| } | |||
|
|
|||
| is_dark_mode <- function() { | |||
| if (rstudioapi::isAvailable() && rstudioapi::hasFun("getThemeInfo")) { | |||
There was a problem hiding this comment.
Once posit-dev/positron#2986 is handled, the full glory of this PR will apply in Positron.
| theme_info <- rstudioapi::getThemeInfo() | ||
| theme_info$dark | ||
| } else { | ||
| FALSE |
There was a problem hiding this comment.
Until posit-dev/positron#2986 happens, Positron will always get reprex previews in light mode, but this is still an improvement over what's happening now.
Before this PR:
After this PR:
| :root { | ||
| --bg-color: #0d1117; | ||
| } |
There was a problem hiding this comment.
I added this. (Ditto in github-light.css.)
| -webkit-text-size-adjust: 100%; | ||
| margin: 0; | ||
| color: #e6edf3; | ||
| background-color: var(--bg-color); |
There was a problem hiding this comment.
Changed this to a variable. (Ditto in github-dark.css.)
| max-width: 980px; | ||
| margin: 0 auto; | ||
| padding: 45px; | ||
| padding-top: 15px; |
There was a problem hiding this comment.
Some new padding at the top.
|
|
||
| <body> | ||
|
|
||
| <div class="markdown-body"> |
There was a problem hiding this comment.
New div because markdown-body that is the main class that GitHub's CSS deals with.
|
In your examples e.g. "With this PR, Positron, light mode", it looks like syntax highlighting is missing? |
Yeah, I had noticed that as well. Working on it. So far without much success, but presumably solvable. |
|
I have (more than) solved the syntax highlighting problem, but lordy was it a journey. I'm closing this PR and will make a new one with a clean history that actually helps tell the story. |
Fixes #468
The basic approach is to get GitHub's CSS from a more definitive source than the rmarkdown package. Then I have to fix it up a bit to play well with an html template, which we also bring into reprex now.
If you really wanted a faithful preview, there's a GitHub API endpoint that will take markdown and render HTML as GitHub would. But that seems like overkill.
Skimming through the individual commits is probably the easiest way to see what I've tweaked in the files I'm getting from elsewhere.