Цвет фона выбранной цитаты

Разработка
1

Привет!
Пожалуйста, покажите пример CSS-кода для установки цвета фона в выделенной части текста в цитате.
Вот иллюстрация:

На моём сайте выделенная часть цитаты не имеет фона, я пытался сам настроить CSS, но безуспешно :pensive:

2

Здравствуйте,

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

Оно поможет вам в будущем.

Что касается вашего вопроса, код для изменения этой конкретной части выглядит следующим образом. Замените значение по умолчанию на любой цвет, который вам нравится. :slight_smile:

.cooked span.highlighted {
    background-color: var(--tertiary-low);
}

Я добавил селектор .cooked, так как считаю, что span.highlighted используется в других частях форума.

3

Привет @Canapin :wave:, да, я прочитал этот пост, но он написан довольно поверхностно. Я уже пробовал вставлять код, похожий на ваш, но он влияет только на первую цитату, а последующие цитаты не меняют цвет фона(

4

@Aizada_M Не уверен, поможет ли это, но вы можете использовать это…

https://github.com/merefield/discourse-tc-coloured-text

Это добавляет кнопку в редактор для оформления выделенного текста различными цветами и цветами фона… Код, который он генерирует в редакторе, выглядит так…

[wrap=yellow color=green bgcolor=red]
[quote="system, post:1, topic:3, full:true"]Создавайте темы здесь, которые не подходят ни к одной из существующих категорий.[/quote]
[/wrap]

[wrap=yellow color=green bgcolor=red]Создавайте темы здесь, которые не подходят ни к одной из существующих категорий.[/wrap]

Screenshot 2023-09-01 095613
Screenshot 2023-09-01 0956132772×1195 159 KB

(Хотя не уверен, что делает “wrap=color”)

Если вы хотите установить цвет фона для всех блоков цитат на вашем сайте, вы можете использовать этот CSS…

aside.quote .title,
blockquote {
background-color: yellow;
}
5

Возможно, я неправильно понял, что вы именно спрашиваете?

Потому что мой CSS работает для нескольких цитат:

![chrome_WcQslkfBcI|video](upload://rypIuof3z OmKl7qIRxMsK0NIScp.mp4)

6

Вы меня правильно поняли, но по какой-то причине цвет есть только в первой цитате, а в последующих его нет :man_shrugging:

7

Вы уверены, что в вашей другой цитате по умолчанию выделены части?
Можете записать видео, как в вашем первом сообщении? :slight_smile:

8

Спасибо за ответ :raised_hands:, вы поделились очень полезной информацией. Я сохранил ваш код для другой задачи, но мне нужно, чтобы фон выделенной части цитируемого текста отличался от общего фона при цитировании.

В обычном свернутом состоянии фон цитаты не выделен. После нажатия на кнопку :arrow_down_small: весь текст раскрывается, при этом фон только цитируемой части выделяется другим цветом.
Например, вот так:

image
image1224×301 37.9 KB

Тип развернутой цитаты:

image
image1124×526 80.8 KB

9

Да, я выделил каждый цитатный блок, но по какой-то причине у первого цитатного блока меняется только фон выделенного текста. Завтра я запишу видео и опубликую его здесь.

10

Привет!
Вот код, который я вставил в CSS своей темы:

.cooked span.highlighted {
    background-color: var(--tertiary-low);
}

Вот как это работает:

11

Думаю, я понял.

Цитаты со списком с маркерами немного ломаются:

В вашей первой цитате вы цитируете только текст пункта списка.

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

Это никак не связано с моим CSS. Подсветка не появится ни в каком случае. :slight_smile:

12

Спасибо :raised_hands! Насколько я понимаю, решения этой проблемы не существует. :pensive:

13

Да, такого нет, и я даже не уверен, что исправление bug, на который я дал ссылку, решит эту конкретную проблему.