anthonynorth / rscodeio

An RStudio theme inspired by Visual Studio Code.
Other
409 stars 66 forks source link

Add theme variant "Tomorrow Night Bright (rscodeio)" #44

Closed salim-b closed 4 years ago

salim-b commented 4 years ago

This variant applies all of the beautiful dark theming provided by the rscodeio theme but relies on the syntax highlighting (and terminal styling) of the Tomorrow Night Bright theme. For this, the latest version of tomorrow_night_bright.rstheme from RStudio's master branch was complemented by the custom CSS from rscodeio.rstheme.

There's one small deviation from the original Tomorrow Night Bright looks, though: The background color for the editor windows is not black (#000000) but a very dark grey (#0d0d0d; 5% lightness) which I prefer.

(Un)installation functions were changed to just (un)install this variant besides the original rscodeio theme.

Screenshot of the resulting theme in action:


UPDATE:

Additionally, I've styled the help pane! 🎨 That (i.e. pretty-formatted documentation) was something I've been missing for a long time in RStudio and I think the result looks pretty decent. I'm not very skilled in CSS, so the code might not be too elegant, though. But if anyone wants to at least use it as inspiration/hint or something, here's the relevant part:

/* help pane */
.rstudio-themes-flat.rstudio-themes-dark.editor_dark.ace_editor_theme p,
.rstudio-themes-flat.rstudio-themes-dark.editor_dark.ace_editor_theme h1,
.rstudio-themes-flat.rstudio-themes-dark.editor_dark.ace_editor_theme h2,
.rstudio-themes-flat.rstudio-themes-dark.editor_dark.ace_editor_theme h3,
.rstudio-themes-flat.rstudio-themes-dark.editor_dark.ace_editor_theme h4,
.rstudio-themes-flat.rstudio-themes-dark.editor_dark.ace_editor_theme h5,
.rstudio-themes-flat.rstudio-themes-dark.editor_dark.ace_editor_theme h6 {
  line-height: 1.75 !important;
  color: #DEDEDE !important;
}

.rstudio-themes-flat.rstudio-themes-dark.editor_dark.ace_editor_theme pre,
.rstudio-themes-flat.rstudio-themes-dark.editor_dark.ace_editor_theme code {
  font-family: "Fira Code", Ubuntu, "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;
  font-size: 85%;
  color: white !important;
  background-color: #1A1A1A !important;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 3px;
}

.rstudio-themes-flat.rstudio-themes-dark.editor_dark.ace_editor_theme code {
  padding: .2em .4em;
}

.rstudio-themes-flat.rstudio-themes-dark.editor_dark.ace_editor_theme pre {
  padding: 1.5em;
  line-height: 1.45;
  overflow: auto;
}

.rstudio-themes-flat.rstudio-themes-dark.editor_dark.ace_editor_theme a {
  color: #80D7FF !important;
  text-decoration: none;
}

The prettified help pane looks like this (for ?pal::as_string):

Bildschirmfoto von 2020-10-09 19-51-20

anthonynorth commented 4 years ago

Thanks @salim-b