garrick
/
xaringanthemer
miroir de https://github.com/gadenbuie/xaringanthemer.git
Suivre 1
Ajouter aux favoris 0
Bifurcation 0
Code Tickets 0 Versions 10 Wiki Activité
😎 Give your xaringan slides some style
Vous ne pouvez pas sélectionner plus de 25 sujets Les noms de sujets doivent commencer par une lettre ou un nombre, peuvent contenir des tirets ('-') et peuvent comporter jusqu'à 35 caractères.
8 Révisions
5 Branches
Aborescence: b4d0f582a0
Branches Tags
${ item.name }
Créer la branche ${ searchTerm }
de 'b4d0f582a0'
${ noResults }
xaringanthemer/articles/template-variables.html

450 lines
18KB
Brut Annotations Historique 

  1. <!DOCTYPE html>

  2. <!-- Generated by pkgdown: do not edit by hand --><html>

  3. <head>

  4. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

  5. <meta charset="utf-8">

  6. <meta http-equiv="X-UA-Compatible" content="IE=edge">

  7. <meta name="viewport" content="width=device-width, initial-scale=1.0">

  8. <title>Template Variables • xaringanthemer</title>

  9. <!-- jquery --><script src="https://code.jquery.com/jquery-3.1.0.min.js" integrity="sha384-nrOSfDHtoPMzJHjVTdCopGqIqeYETSXhZDFyniQ8ZHcVy08QesyHcnOUpMpqnmWq" crossorigin="anonymous"></script><!-- Bootstrap --><link href="https://maxcdn.bootstrapcdn.com/bootswatch/3.3.7/yeti/bootstrap.min.css" rel="stylesheet" crossorigin="anonymous">

  10. <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script><!-- Font Awesome icons --><link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-T8Gy5hrqNKT+hzMclPo118YTQO6cYprQmhrYwIiQ/3axmI1hQomh7Ud2hPOy8SP1" crossorigin="anonymous">

  11. <!-- clipboard.js --><script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/1.7.1/clipboard.min.js" integrity="sha384-cV+rhyOuRHc9Ub/91rihWcGmMmCXDeksTtCihMupQHSsi8GIIRDG0ThDc3HGQFJ3" crossorigin="anonymous"></script><!-- sticky kit --><script src="https://cdnjs.cloudflare.com/ajax/libs/sticky-kit/1.1.3/sticky-kit.min.js" integrity="sha256-c4Rlo1ZozqTPE2RLuvbusY3+SU1pQaJC0TjuhygMipw=" crossorigin="anonymous"></script><!-- pkgdown --><link href="../pkgdown.css" rel="stylesheet">

  12. <script src="../pkgdown.js"></script><meta property="og:title" content="Template Variables">

  13. <meta property="og:description" content="">

  14. <meta name="twitter:card" content="summary">

  15. <!-- mathjax --><script src="https://mathjax.rstudio.com/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script><!--[if lt IE 9]>

  16. <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>

  17. <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>

  18. <![endif]-->

  19. </head>

  20. <body>

  21.     <div class="container template-article">

  22.       <header><div class="navbar navbar-default navbar-fixed-top" role="navigation">

  23.   <div class="container">

  24.     <div class="navbar-header">

  25.       <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar">

  26.         <span class="icon-bar"></span>

  27.         <span class="icon-bar"></span>

  28.         <span class="icon-bar"></span>

  29.       </button>

  30.       <span class="navbar-brand">

  31.         <a class="navbar-link" href="../index.html">xaringanthemer</a>

  32.         <span class="label label-default" data-toggle="tooltip" data-placement="bottom" title="Released package">0.2.0</span>

  33.       </span>

  34.     </div>

  35. 

  36.     <div id="navbar" class="navbar-collapse collapse">

  37.       <ul class="nav navbar-nav">

  38. <li>

  39.   <a href="../index.html">

  40.     <span class="fa fa-home fa-lg"></span>

  41.      

  42.   </a>

  43. </li>

  44. <li>

  45.   <a href="../articles/xaringanthemer.html">Get started</a>

  46. </li>

  47. <li>

  48.   <a href="../articles/singles/themes.html">Themes</a>

  49. </li>

  50. <li>

  51.   <a href="../articles/singles/fonts.html">Fonts</a>

  52. </li>

  53. <li>

  54.   <a href="../articles/template-variables.html">Template Variables</a>

  55. </li>

  56. <li>

  57.   <a href="../articles/css-help.html">CSS Help</a>

  58. </li>

  59. <li>

  60.   <a href="../reference/index.html">Reference</a>

  61. </li>

  62.       </ul>

  63. <ul class="nav navbar-nav navbar-right">

  64. <li>

  65.   <a href="https://github.com/gadenbuie/xaringanthemer">

  66.     <span class="fa fa-github fa-lg"></span>

  67.      

  68.   </a>

  69. </li>

  70. <li>

  71.   <a href="https://twitter.com/grrrck">

  72.     <span class="fa fa-twitter fa-lg"></span>

  73.      

  74.   </a>

  75. </li>

  76.       </ul>

  77. </div>

  78. <!--/.nav-collapse -->

  79.   </div>

  80. <!--/.container -->

  81. </div>

  82. <!--/.navbar -->

  83. 

  84.       

  85.       </header><div class="row">

  86.   <div class="col-md-9 contents">

  87.     <div class="page-header toc-ignore">

  88.       <h1>Template Variables</h1>

  89.             

  90.       

  91.       <small class="dont-index">Source: <a href="https://github.com/gadenbuie/xaringanthemer/blob/master/vignettes/template-variables.Rmd"><code>vignettes/template-variables.Rmd</code></a></small>

  92.       <div class="hidden name"><code>template-variables.Rmd</code></div>

  93. 

  94.     </div>

  95. 

  96.     

  97.     

  98. <p>The following table shows the template variables, their default values in the standard <code>xaringan</code> theme, the primary element to which the property is applied, and a brief description of the template variable.</p>

  99. <p>For example, <code>background_color</code> by default sets the <code>background-color</code> CSS property of the <code>.remark-slide-content</code> class to <code>#FFF</code>.</p>

  100. <p>Use this table to find the template variable you would like to modify. You can also use this table to find the CSS class or element associated with a particular template item.</p>

  101. <p>Note that themes, like <code><a href="../reference/mono_accent.html">mono_accent()</a></code>, have additional parameters, but with any theme function you can override the theme by directly setting the arguments below when calling the theme function. For example, to use <code><a href="../reference/mono_accent.html">mono_accent()</a></code> with a different slide background color, you can call <code><a href="../reference/mono_accent.html">mono_accent(background_color = "#abc123")</a></code>.</p>

  102. <table class="table">

  103. <thead><tr class="header">

  104. <th align="left">variable</th>

  105. <th align="left">default</th>

  106. <th align="left">element</th>

  107. <th align="left">description</th>

  108. </tr></thead>

  109. <tbody>

  110. <tr class="odd">

  111. <td align="left"><code>text_color</code></td>

  112. <td align="left"><code>#000</code></td>

  113. <td align="left">body</td>

  114. <td align="left">Text Color</td>

  115. </tr>

  116. <tr class="even">

  117. <td align="left"><code>header_color</code></td>

  118. <td align="left"><code>#000</code></td>

  119. <td align="left">h1, h2, h3</td>

  120. <td align="left">Header Color</td>

  121. </tr>

  122. <tr class="odd">

  123. <td align="left"><code>background_color</code></td>

  124. <td align="left"><code>#FFF</code></td>

  125. <td align="left">.remark-slide-content</td>

  126. <td align="left">Slide Background Color</td>

  127. </tr>

  128. <tr class="even">

  129. <td align="left"><code>link_color</code></td>

  130. <td align="left"><code>rgb(249, 38, 114)</code></td>

  131. <td align="left">a, a &gt; code</td>

  132. <td align="left">Link Color</td>

  133. </tr>

  134. <tr class="odd">

  135. <td align="left"><code>text_bold_color</code></td>

  136. <td align="left"><code>NA</code></td>

  137. <td align="left">strong</td>

  138. <td align="left">Bold Text Color</td>

  139. </tr>

  140. <tr class="even">

  141. <td align="left"><code>text_slide_number_color</code></td>

  142. <td align="left"><code>inverse_background_color</code></td>

  143. <td align="left">.remark-slide-number</td>

  144. <td align="left">Slide Number Color</td>

  145. </tr>

  146. <tr class="odd">

  147. <td align="left"><code>padding</code></td>

  148. <td align="left"><code>1em 4em 1em 4em</code></td>

  149. <td align="left">.remark-slide-content</td>

  150. <td align="left">Slide Padding in <code>top right [bottom left]</code> format</td>

  151. </tr>

  152. <tr class="even">

  153. <td align="left"><code>background_image</code></td>

  154. <td align="left"><code>NA</code></td>

  155. <td align="left">.remark-slide-content</td>

  156. <td align="left">Background image applied to each <em>and every</em> slide. Set <code>title_slide_background_image = "none"</code> to remove the background image from the title slide.</td>

  157. </tr>

  158. <tr class="odd">

  159. <td align="left"><code>background_size</code></td>

  160. <td align="left"><code>NA</code></td>

  161. <td align="left">.remark-slide-content</td>

  162. <td align="left">Background image size, requires <code>background_image</code> to be set. If <code>background_image</code> is set, <code>background_size</code> will default to <code>cover</code> so the backround fills the screen. If both <code>background_image</code> and <code>background_position</code> are set, will default to 100 percent.</td>

  163. </tr>

  164. <tr class="even">

  165. <td align="left"><code>background_position</code></td>

  166. <td align="left"><code>NA</code></td>

  167. <td align="left">.remark-slide-content</td>

  168. <td align="left">Background image position, requires <code>background_image</code> to be set, and it is recommended to adjust <code>background_size</code>.</td>

  169. </tr>

  170. <tr class="odd">

  171. <td align="left"><code>code_highlight_color</code></td>

  172. <td align="left"><code>rgba(255,255,0,0.5)</code></td>

  173. <td align="left">.remark-code-line-highlighted</td>

  174. <td align="left">Code Line Highlight</td>

  175. </tr>

  176. <tr class="even">

  177. <td align="left"><code>code_inline_color</code></td>

  178. <td align="left"><code>#000</code></td>

  179. <td align="left">.remark-inline-code</td>

  180. <td align="left">Inline Code Color</td>

  181. </tr>

  182. <tr class="odd">

  183. <td align="left"><code>code_inline_background_color</code></td>

  184. <td align="left"><code>NA</code></td>

  185. <td align="left">.remark-inline-code</td>

  186. <td align="left">Inline Code Background Color</td>

  187. </tr>

  188. <tr class="even">

  189. <td align="left"><code>code_inline_font_size</code></td>

  190. <td align="left"><code>1em</code></td>

  191. <td align="left">.remark-inline-code</td>

  192. <td align="left">Inline Code Text Font Size</td>

  193. </tr>

  194. <tr class="odd">

  195. <td align="left"><code>inverse_background_color</code></td>

  196. <td align="left"><code>#272822</code></td>

  197. <td align="left">.inverse</td>

  198. <td align="left">Inverse Background Color</td>

  199. </tr>

  200. <tr class="even">

  201. <td align="left"><code>inverse_text_color</code></td>

  202. <td align="left"><code>#d6d6d6</code></td>

  203. <td align="left">.inverse</td>

  204. <td align="left">Inverse Text Color</td>

  205. </tr>

  206. <tr class="odd">

  207. <td align="left"><code>inverse_text_shadow</code></td>

  208. <td align="left"><code>FALSE</code></td>

  209. <td align="left">.inverse</td>

  210. <td align="left">Enables Shadow on text of inverse slides</td>

  211. </tr>

  212. <tr class="even">

  213. <td align="left"><code>inverse_header_color</code></td>

  214. <td align="left"><code>#f3f3f3</code></td>

  215. <td align="left">.inverse h1, .inverse h2, .inverse h3</td>

  216. <td align="left">Inverse Header Color</td>

  217. </tr>

  218. <tr class="odd">

  219. <td align="left"><code>title_slide_text_color</code></td>

  220. <td align="left"><code>inverse_text_color</code></td>

  221. <td align="left">.title-slide</td>

  222. <td align="left">Title Slide Text Color</td>

  223. </tr>

  224. <tr class="even">

  225. <td align="left"><code>title_slide_background_color</code></td>

  226. <td align="left"><code>inverse_background_color</code></td>

  227. <td align="left">.title-slide</td>

  228. <td align="left">Title Slide Background Color</td>

  229. </tr>

  230. <tr class="odd">

  231. <td align="left"><code>title_slide_background_image</code></td>

  232. <td align="left"><code>NA</code></td>

  233. <td align="left">.title-slide</td>

  234. <td align="left">Title Slide Background Image URL</td>

  235. </tr>

  236. <tr class="even">

  237. <td align="left"><code>title_slide_background_size</code></td>

  238. <td align="left"><code>NA</code></td>

  239. <td align="left">.title-slide</td>

  240. <td align="left">Title Slide Background Image Size, defaults to “cover” if background image is set</td>

  241. </tr>

  242. <tr class="odd">

  243. <td align="left"><code>title_slide_background_position</code></td>

  244. <td align="left"><code>NA</code></td>

  245. <td align="left">.title-slide</td>

  246. <td align="left">Title Slide Background Image Position</td>

  247. </tr>

  248. <tr class="even">

  249. <td align="left"><code>footnote_color</code></td>

  250. <td align="left"><code>NA</code></td>

  251. <td align="left">.footnote</td>

  252. <td align="left">Footnote text color (if <code>NA</code>, then it will be the same color as <code>text_color</code>)</td>

  253. </tr>

  254. <tr class="odd">

  255. <td align="left"><code>footnote_font_size</code></td>

  256. <td align="left"><code>0.9em</code></td>

  257. <td align="left">.footnote</td>

  258. <td align="left">Footnote font size</td>

  259. </tr>

  260. <tr class="even">

  261. <td align="left"><code>footnote_position_bottom</code></td>

  262. <td align="left"><code>3em</code></td>

  263. <td align="left">.footnote</td>

  264. <td align="left">Footnote location from bottom of screen</td>

  265. </tr>

  266. <tr class="odd">

  267. <td align="left"><code>left_column_subtle_color</code></td>

  268. <td align="left"><code>#777</code></td>

  269. <td align="left">.left-column h2, .left-column h3</td>

  270. <td align="left">Left Column Text (not last)</td>

  271. </tr>

  272. <tr class="even">

  273. <td align="left"><code>left_column_selected_color</code></td>

  274. <td align="left"><code>#000</code></td>

  275. <td align="left">.left-column h2:last-of-type, .left-column h3:last-child</td>

  276. <td align="left">Left Column Current Selection</td>

  277. </tr>

  278. <tr class="odd">

  279. <td align="left"><code>blockquote_left_border_color</code></td>

  280. <td align="left"><code>lightgray</code></td>

  281. <td align="left">blockquote</td>

  282. <td align="left">Blockquote Left Border Color</td>

  283. </tr>

  284. <tr class="even">

  285. <td align="left"><code>table_border_color</code></td>

  286. <td align="left"><code>#666</code></td>

  287. <td align="left">table: border-top, border-bottom</td>

  288. <td align="left">Table top/bottom border</td>

  289. </tr>

  290. <tr class="odd">

  291. <td align="left"><code>table_row_border_color</code></td>

  292. <td align="left"><code>#ddd</code></td>

  293. <td align="left">table thead th: border-bottom</td>

  294. <td align="left">Table row inner bottom border</td>

  295. </tr>

  296. <tr class="even">

  297. <td align="left"><code>table_row_even_background_color</code></td>

  298. <td align="left"><code>#eee</code></td>

  299. <td align="left">thead, tfoot, tr:nth-child(even)</td>

  300. <td align="left">Table Even Row Background Color</td>

  301. </tr>

  302. <tr class="odd">

  303. <td align="left"><code>text_font_size</code></td>

  304. <td align="left"><code>20px</code></td>

  305. <td align="left">.remark-slide-content</td>

  306. <td align="left">Slide Body Text Font Size</td>

  307. </tr>

  308. <tr class="even">

  309. <td align="left"><code>header_h1_font_size</code></td>

  310. <td align="left"><code>55px</code></td>

  311. <td align="left">.remark-slide-content h1</td>

  312. <td align="left">h1 Header Text Font Size</td>

  313. </tr>

  314. <tr class="odd">

  315. <td align="left"><code>header_h2_font_size</code></td>

  316. <td align="left"><code>45px</code></td>

  317. <td align="left">.remark-slide-content h2</td>

  318. <td align="left">h2 Header Text Font Size</td>

  319. </tr>

  320. <tr class="even">

  321. <td align="left"><code>header_h3_font_size</code></td>

  322. <td align="left"><code>35px</code></td>

  323. <td align="left">.remark-slide-content h3</td>

  324. <td align="left">h3 Header Text Font Size</td>

  325. </tr>

  326. <tr class="odd">

  327. <td align="left"><code>text_slide_number_font_size</code></td>

  328. <td align="left"><code>0.9em</code></td>

  329. <td align="left">.remark-slide-number</td>

  330. <td align="left">Slide Number Text Font Size</td>

  331. </tr>

  332. <tr class="even">

  333. <td align="left"><code>text_font_google</code></td>

  334. <td align="left"><code>NULL</code></td>

  335. <td align="left">body</td>

  336. <td align="left">Use <code><a href="../reference/google_font.html">google_font()</a></code> to specify body font</td>

  337. </tr>

  338. <tr class="odd">

  339. <td align="left"><code>text_font_family</code></td>

  340. <td align="left"><code>'Droid Serif'</code></td>

  341. <td align="left">body</td>

  342. <td align="left">Body Text Font Family</td>

  343. </tr>

  344. <tr class="even">

  345. <td align="left"><code>text_font_weight</code></td>

  346. <td align="left"><code>normal</code></td>

  347. <td align="left">body</td>

  348. <td align="left">Body Text Font Weight</td>

  349. </tr>

  350. <tr class="odd">

  351. <td align="left"><code>text_font_url</code></td>

  352. <td align="left"><code>https://fonts.googleapis.com/css?family=Droid+Serif:400,700,400italic</code></td>

  353. <td align="left">

  354. <span class="citation">@import</span> url()</td>

  355. <td align="left">Body Text Font URL(s)</td>

  356. </tr>

  357. <tr class="even">

  358. <td align="left"><code>text_font_family_fallback</code></td>

  359. <td align="left"><code>'Palatino Linotype', 'Book Antiqua', Palatino, 'Microsoft YaHei', 'Songti SC'</code></td>

  360. <td align="left">body</td>

  361. <td align="left">Body Text Font Fallbacks</td>

  362. </tr>

  363. <tr class="odd">

  364. <td align="left"><code>text_font_base</code></td>

  365. <td align="left"><code>serif</code></td>

  366. <td align="left">body</td>

  367. <td align="left">Body Text Base Font (Total Failure Fallback)</td>

  368. </tr>

  369. <tr class="even">

  370. <td align="left"><code>header_font_google</code></td>

  371. <td align="left"><code>NULL</code></td>

  372. <td align="left">body</td>

  373. <td align="left">Use <code><a href="../reference/google_font.html">google_font()</a></code> to specify header font</td>

  374. </tr>

  375. <tr class="odd">

  376. <td align="left"><code>header_font_family</code></td>

  377. <td align="left"><code>'Yanone Kaffeesatz'</code></td>

  378. <td align="left">h1, h2, h3</td>

  379. <td align="left">Header Font Family</td>

  380. </tr>

  381. <tr class="even">

  382. <td align="left"><code>header_font_weight</code></td>

  383. <td align="left"><code>normal</code></td>

  384. <td align="left">h1, h2, h3</td>

  385. <td align="left">Header Font Weight</td>

  386. </tr>

  387. <tr class="odd">

  388. <td align="left"><code>header_font_url</code></td>

  389. <td align="left"><code>https://fonts.googleapis.com/css?family=Yanone+Kaffeesatz</code></td>

  390. <td align="left">

  391. <span class="citation">@import</span> url</td>

  392. <td align="left">Header Font URL</td>

  393. </tr>

  394. <tr class="even">

  395. <td align="left"><code>code_font_google</code></td>

  396. <td align="left"><code>NULL</code></td>

  397. <td align="left">body</td>

  398. <td align="left">Use <code><a href="../reference/google_font.html">google_font()</a></code> to specify code font</td>

  399. </tr>

  400. <tr class="odd">

  401. <td align="left"><code>code_font_family</code></td>

  402. <td align="left"><code>'Source Code Pro'</code></td>

  403. <td align="left">.remark-code, .remark-inline-code</td>

  404. <td align="left">Code Font Family</td>

  405. </tr>

  406. <tr class="even">

  407. <td align="left"><code>code_font_size</code></td>

  408. <td align="left"><code>0.9em</code></td>

  409. <td align="left">.remark-inline</td>

  410. <td align="left">Code Text Font Size</td>

  411. </tr>

  412. <tr class="odd">

  413. <td align="left"><code>code_font_url</code></td>

  414. <td align="left"><code>https://fonts.googleapis.com/css?family=Source+Code+Pro:400,700</code></td>

  415. <td align="left">

  416. <span class="citation">@import</span> url</td>

  417. <td align="left">Code Font URL</td>

  418. </tr>

  419. <tr class="even">

  420. <td align="left"><code>code_font_family_fallback</code></td>

  421. <td align="left"><code>'Lucida Console', Monaco</code></td>

  422. <td align="left">.remark-code, .remark-inline-code</td>

  423. <td align="left">Code Font Fallback</td>

  424. </tr>

  425. </tbody>

  426. </table>

  427. </div>

  428. 

  429.   <div class="col-md-3 hidden-xs hidden-sm" id="sidebar">

  430.       </div>

  431. 

  432. </div>

  433. 

  434. 

  435.       <footer><div class="copyright">

  436.   <p>Developed by <a href="https://www.garrickadenbuie.com">Garrick Aden-Buie</a>.</p>

  437. </div>

  438. 

  439. <div class="pkgdown">

  440.   <p>Site built with <a href="http://pkgdown.r-lib.org/">pkgdown</a>.</p>

  441. </div>

  442. 

  443.       </footer>

  444. </div>

  445. 

  446.   

  447. 

  448.   </body>

  449. </html>