Xaringan: Font size of code

[muschellij2]

Is there a way to change the font size of the code output? I have tried pre/code/.remark-code in css but none seem to do it. I tried div and got some weird output when wrapping the code in a div and trying to set the font.

Here's an MWE (you have to un-space the R code chunk when running:

output:
  xaringan::moon_reader:
    nature:
      highlightStyle: github
      highlightLines: true
---
class: inverse, middle, center

# Creating RMarkdown Documents in RStudio 

<div style="font-size:30pt">
    ```{r, eval = FALSE}
  install.packages("rmarkdown")
    ```
</div>

[ekstroem]

I think changing the font size in remark-code should do it (off the top of my head - can't check if that is the actual css change necessary)

.remark-code, .remark-inline-code { font-family: 'Source Code Pro', 'Lucida Console', Monaco, monospace;
                                    font-size: 90%;
                                  }

[dicook]

This took me ages to work out, so I am posting in here, hoping that it is a common place for others to find the info. I just wanted to change the default body text size on a slide. This MUST go in

.remark-slide-content {
font-size: 32px;
}

in your "mystyle.css" or whatever css file you are making changes in for your personalisation of slides. Changing the text size for h1, h2, h3, ... works anywhere else in the css, but using a body {...} doesn't, which flummoxed me for about 5 hours.

[pat-s]

Did have a look in the wiki?

[dicook]

Yes, and its not explained there

maybe it needs a section title “body text"

On 27 Feb 2019, at 8:51 am, Patrick Schratz [e-mail] wrote:

Did have a look in the wiki https://github.com/yihui/xaringan/wiki/Font-Size?

—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub https://github.com/yihui/xaringan/issues/69#issuecomment-467628800, or mute the thread https://github.com/notifications/unsubscribe-auth/AAPdB8OG99XatKUFIxvXqzQ1l8JTf2p7ks5vRaxzgaJpZM4PNtGj.

---

Dianne Cook
[email protected]

[ekstroem]

This issue was about the code size and that can indeed be modified independently of the body font size by the .remark-code and .remark-code-inline css class selectors.

[dicook]

I though that I backed out of entering my info there.

I created a new issue focused on body text not code text

On 27 Feb 2019, at 9:01 am, Claus Ekstrøm [e-mail] wrote:

This issue was about the code size and that can indeed be modified independently of the body font size by the .remark-code and .remark-code-inline css class selectors.

—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub https://github.com/yihui/xaringan/issues/69#issuecomment-467631878, or mute the thread https://github.com/notifications/unsubscribe-auth/AAPdBx7ufMQjGdFuKhrkTr1b3hbWf3FMks5vRa6jgaJpZM4PNtGj.

---

Dianne Cook
[email protected]

[pat-s]

Ah, that's why https://github.com/yihui/xaringan/issues/196 was opened.

I thought that any text is affected by the css classes referenced in the wiki. If not, we should add the info to the page.

[ekstroem]

Ah :o)

[dicook]

yes, it would be good to add it. would you be able to do this?

On 27 Feb 2019, at 9:04 am, Patrick Schratz [e-mail] wrote:

Ah, that's why #196 https://github.com/yihui/xaringan/issues/196 was opened.

I thought that any text is affected by the css classes referenced in the wiki. If not, we should add the info to the page.

—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub https://github.com/yihui/xaringan/issues/69#issuecomment-467632962, or mute the thread https://github.com/notifications/unsubscribe-auth/AAPdBzkCKG0SrRhFA3NwF0fmuJJq3yEoks5vRa9lgaJpZM4PNtGj.

---

Dianne Cook
[email protected]

[ekstroem]

If you add stuff about font sizes @pat-s then you could also add that math fonts can be tweaked with the following (at least with the old mathjax version)

/* Block math */ 
.mjx-math {
    font-size: 100%;
}

/* Block math 
   Only this is unique to block (display) math
*/
.MJXc-display {
    font-size: 100% !important;
}


/* Inline math */ 
.mjx-chtml {
    font-size: 100%; 
}

[apreshill]

Regarding body text sizing (https://github.com/yihui/xaringan/issues/196), I think using just .remark-slide-content is too broad- I did this and it changed all my image sizing. I would recommend:

.remark-slide-content p, ul, ol, li {
  font-size: 32px;
}

I'd be curious if there is another solution for changing the body text only.

[tcgriffith]

Why would font-size change the image sizing?

[apreshill]

Good question! I was iterating and don't have anything shareable, but many of my background images changed (if there was also text on the slide). Anyway, if there is anything added to the docs, may just be worth noting that .remark-slide-content by itself can cast too sweeping of a CSS change.