rstudio / revealjs

R Markdown Format for reveal.js Presentations
Other
327 stars 85 forks source link

Borders Graphics Output R - css customization #25

Closed mh74 closed 3 years ago

mh74 commented 8 years ago

Great Framework to have with(in) R/RStudio, Any hint as to how I can change the border color of the graphics output. The color changes according to the theme and seems to be the same color as the standard text. Example: When a ggplot graphic is rendered and put into the presentation, there is a css border in the slides around the plot

jjallaire commented 8 years ago

Here are the docs on adding custom CSS: http://rmarkdown.rstudio.com/revealjs_presentation_format.html#custom_css

So you'll probably need CSS something like this to modify how images are displayed:

.reveal section img {

}

I haven't done this myself so some experimentation may be required!

On Fri, Feb 19, 2016 at 1:24 AM, mh74 notifications@github.com wrote:

Great Framework to have with(in) R/RStudio, Any hint as to how I can change the border color of the graphics output. The color changes according to the theme and seems to be the same color as the standard text. Example: When a ggplot graphic is rendered and put into the presentation, there is a css border in the slides around the plot

— Reply to this email directly or view it on GitHub https://github.com/rstudio/revealjs/issues/25.

mh74 commented 8 years ago

Thanks for your suggestion JJAllaire, it worked. This is what I used:

.reveal section img{ border-color:#000; }

jjallaire commented 8 years ago

Great, glad it worked! On Fri, Feb 19, 2016 at 7:46 AM mh74 notifications@github.com wrote:

Thanks for your suggestion JJAllaire, it worked. This is what I used:

.reveal section img{ border-color:#000; }

— Reply to this email directly or view it on GitHub https://github.com/rstudio/revealjs/issues/25#issuecomment-186242072.

jdstorey commented 8 years ago

On a related note, if you want to remove all borders you can do:

.reveal section img { 
  background:none; 
  border:none; 
  box-shadow:none; 
  }