Можно ли изменить переменную Jekyll css в зависимости от слова - PullRequest
Новая
       5

Можно ли изменить переменную Jekyll css в зависимости от слова

1 голос
/ 26 мая 2020

Я использую Jekyll на своем веб-сайте в стиле блога. Вот что я сейчас показываю:

screenshot

Каждый избранный пост с выдержкой отображается в виде for-l oop.

Я пытаюсь найти способ представить подчеркнутые слова выше в зависимости от категории. Это код для отображения категории (подчеркнутый текст на снимке экрана): 

<span class="cat">{{ post.category }}</span>

У каждой должен быть свой цвет фона в зависимости от категории. Можно ли реализовать оператор if в HTML или CSS?

Я отредактировал исходный код страницы, чтобы проиллюстрировать, как я хотел бы отображать элементы диапазона, чтобы понять, что я собираюсь делать .

idea

Logi c: 

If (page.category == "ethical"): css background: red
If (page.category == "writeup"): css background: grey

Любой совет или руководство были бы чрезвычайно полезны.

1 Ответ

3 голосов
/ 26 мая 2020

попробуйте это Вам нужно создать CSS классы для всех ваших категорий

в css: 

/*
.background-<your category> {
  background: <color you want>
}
*/
.background-ethical {
  background: red
}
.background-writeup {
  background: grey
}

внутри l oop: 

<span class="cat background-{{ post.category }}">{{ post.category }}</span>
...