Цвет пули в презентации Xaringan - PullRequest
Новая
       64

Цвет пули в презентации Xaringan

0 голосов
/ 28 мая 2019

Можно ли изменить цвета пули в презентации Xaringan?Текст должен иметь другой цвет.

Я не нашел ни опции в пакете xaringanthemer, ни проходящего через файл css.Я не смог найти никакой информации на документацию примечания .js.

Ответы [ 2 ]

3 голосов
/ 28 мая 2019

Вы можете изменить цвет маркера, добавив пользовательский CSS в заголовок YAML вашей презентации Xaringan.

Ниже приведен полностью воспроизводимый минимальный пример.

Файл уценки 

title: "Example"
author: "Author"
date: "`r Sys.Date()`"
output:
  xaringan::moon_reader:
    css: 
        - default
        - default-fonts
        - custom.css
    lib_dir: libs
    nature:
      highlightStyle: github
      highlightLines: true
      countIncrementalSlides: false
---

```{r setup, include=FALSE}
options(htmltools.dir.version = FALSE)
```

## Change bullet point colour

* An item
* Another item

Пользовательский custom.css

Мы взяли соответствующий CSS-код для темы пунктов с здесь . 

ul {
  list-style: none; /* Remove default bullets */
}

ul li::before {
  content: "\2022";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
  color: red; /* Change the color */
  font-weight: bold; /* If you want it to be bold */
  display: inline-block; /* Needed to add space between the bullet and the text */
  width: 1em; /* Also needed for space (tweak if needed) */
  margin-left: -1em; /* Also needed for space (tweak if needed) */
}

выход

enter image description here

2 голосов
/ 28 мая 2019

xaringan вывод в формате html, поэтому вы можете изменить любые детали с помощью css (например, используя это руководство , чтобы изменить цвет маркера на красную точку. Принимая это как шаблон, вы можете добавить этот чанк вскоре послеYAML Rmd, чтобы изменить его на красный маркер: 

```{css, echo=F}
ul {
  list-style: none; /* Remove default bullets */
}

ul li::before {
  content: "\2022";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
  color: red; /* Change the color */
  font-weight: bold; /* If you want it to be bold */
  display: inline-block; /* Needed to add space between the bullet and the text */ 
  width: 1em; /* Also needed for space (tweak if needed) */
  margin-left: -1em; /* Also needed for space (tweak if needed) */
}
```

Отдельный стиль от контента

Или более предпочтительно (так как он отделяет компонент стиля от контента слайда), создайтеФайл CSS, скажем style.css, который содержит: 

ul {
  list-style: none; /* Remove default bullets */
}

ul li::before {
  content: "\2022";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
  color: red; /* Change the color */
  font-weight: bold; /* If you want it to be bold */
  display: inline-block; /* Needed to add space between the bullet and the text */ 
  width: 1em; /* Also needed for space (tweak if needed) */
  margin-left: -1em; /* Also needed for space (tweak if needed) */
}

, затем добавьте в YAML, убедившись, что style.css находится в том же пути, что и ваш Rmd, 

css: [xaringan-themer.css, style.css]

Tweakingформа пули

Вы можете изменить форму пули с помощью другого юникода, поставляемого в content (например, используйте \2023 для пули треугольника - см. другие распространенные типы здесь ).

Изменение цвета маркера

Вам просто нужно заменить red на выбранный вами цвет. Вместо этого вы также можете заменить его шестнадцатеричным цветовым кодом.

...