CODEWITHSUNDEEP
htmlrr-markdown
sa90210
sa90210

Reputation: 585

Is there a way to override default color in posterdown package using CSS?

I'm using the posterdown_html template in the posterdown package in R Markdown. Is there any way which I can override the default green color that's used in the header, in the title of each section and all the hyperlinks using CSS? I would like to change it to the following html color code (6d1d26), however I'm unsure how to use CSS to do this

Here is a snippet of the default YAML for this template

---
title: Generate Reproducible & Live HTML and PDF Conference Posters Using RMarkdown
author:
  - name: Brent Thorne
    affil: 1
    orcid: '0000-0002-1099-3857'
  - name: Another G. Author
    affil: 2
affiliation:
  - num: 1
    address: Department of Earth Science, Brock University
  - num: 2
    address: Department of Graphics and Layouts, University of Posters; Canada
column_numbers: 3
logoright_name: https://raw.githubusercontent.com/brentthorne/posterdown/master/images/betterhexlogo.png
logoleft_name: https://raw.githubusercontent.com/brentthorne/posterdown/master/images/betterhexlogo.png
output: 
  posterdown::posterdown_html:
    self_contained: false
bibliography: packages.bib
knit: pagedown::chrome_print
---

enter image description here

Upvotes: 1

Views: 948

Answers (2)

Daniel_j_iii
Daniel_j_iii

Reputation: 3242

You can also use inline CSS, if you know CSS very well you will have more control of your posterdown doc. But here is a simplified very of the inline CSS you could use. As the other answer suggests, you can control that in the YAML which is nice as well.

---
title: Generate Reproducible & Live HTML and PDF Conference Posters Using RMarkdown
author:
  - name: Brent Thorne
    affil: 1
    orcid: '0000-0002-1099-3857'
  - name: Another G. Author
    affil: 2
affiliation:
  - num: 1
    address: Department of Earth Science, Brock University
  - num: 2
    address: Department of Graphics and Layouts, University of Posters; Canada
column_numbers: 3
output: 
  posterdown::posterdown_html:
    self_contained: false
knit: pagedown::chrome_print
---

```{css, echo=FALSE}
div.title_container{
   background-color: #6d1d26;
}

div.logo_left{
  background-color: #6d1d26;
}
div.logo_right{
  background-color: #6d1d26;
}
```

enter image description here

Upvotes: 1

phiggins
phiggins

Reputation: 248

Looks like this can all be done in the YAML header https://github.com/brentthorne/posterdown/wiki/posterdown_html

Upvotes: 4

Related Questions