# Выпадающий список Select-kit: у выбранных/подсвеченных элементов низкий контраст цветов, текст и иконки исчезают
**URL:** https://meta.discourse.org/t/select-kit-dropdown-selected-highlighted-items-have-poor-color-contrast-text-and-icons-disappear/396146
**Category:** Support
**Tags:** accessibility
**Created:** [15.Февраль.2026 20:30:04 UTC](https://meta.discourse.org/t/select-kit-dropdown-selected-highlighted-items-have-poor-color-contrast-text-and-icons-disappear/396146 "2026-02-15T20:30:04Z")
**Posts on this page:** 8
**Page:** 1
### Author:  [@BrettH](https://meta.discourse.org/u/BrettH)
#### Post date: [15.Февраль.2026 20:30:04 UTC](https://meta.discourse.org/t/select-kit-dropdown-selected-highlighted-items-have-poor-color-contrast-text-and-icons-disappear/396146/1 "2026-02-15T20:30:04Z")
При использовании выпадающего меню уведомлений по теме (Слежение/Отслеживание/Обычное/Заглушено) текст и иконка текущего выбранного пункта становятся невидимыми из-за недостаточного контраста между цветом фона выделения и цветами переднего плана.
## Шаги для воспроизведения
1. Откройте любую тему
2. Нажмите кнопку с колокольчиком уведомлений в нижней части темы
3. Обратите внимание на текущий выбранный уровень уведомлений (например, «Отслеживание»)
## Ожидаемое поведение
Выбранный пункт должен иметь четко видимый текст и иконку с хорошим контрастом.
## Фактическое поведение
- Текстовая метка исчезает или становится очень трудно читаемой
- Иконка колокольчика становится невидимой
- Проблема наиболее заметна в темных темах, но может проявляться в любой теме в зависимости от цветовой палитры
## Технические детали
В файле `app/assets/stylesheets/common/select-kit/select-kit.scss` состояние `.is-selected` устанавливает только цвет фона, не обеспечивая контрастность переднего плана:
```plaintext
&.is-selected,
&.is-selected.is-highlighted {
background: var(--d-selected);
// Нет переопределения цвета для текста или иконок
}
```
CSS-переменная `--d-selected` берется из цвета `$selected` темы, но текст (`.name`, `.desc`) и иконки (`.d-icon`) сохраняют свои цвета по умолчанию, которые могут плохо контрастировать с фоном выделения.
## Скриншоты
Примечание: Я хотел бы добавить другое изображение, где исчезает иконка для выбранного состояния, но я новичок и пока могу добавить только одно изображение.
## Окружение
- Версия Discourse: последняя
- Браузер: Edge
- Тема: тема **Foundation**
---
### Author:  [@Noble\_Fish](https://meta.discourse.org/u/Noble_Fish)
#### Post date: [16.Февраль.2026 04:26:36 UTC](https://meta.discourse.org/t/select-kit-dropdown-selected-highlighted-items-have-poor-color-contrast-text-and-icons-disappear/396146/3 "2026-02-16T04:26:36Z")
> [@BrettH](#):
>
> Примечание: Я бы добавил другое изображение, где иконка появляется для выбранного состояния, но я новичок и сейчас могу добавить только одно изображение.
Это ограничение для новых пользователей. Вы можете просматривать некоторые существующие темы, чтобы ваш уровень доверия быстро повысился до 1.
---
### Author:  [@bryce](https://meta.discourse.org/u/bryce)
#### Post date: [17.Февраль.2026 20:24:38 UTC](https://meta.discourse.org/t/select-kit-dropdown-selected-highlighted-items-have-poor-color-contrast-text-and-icons-disappear/396146/5 "2026-02-17T20:24:38Z")
Мне не удалось воспроизвести эту ошибку.
---
### Author:  [@NateDhaliwal](https://meta.discourse.org/u/NateDhaliwal)
#### Post date: [18.Февраль.2026 06:32:02 UTC](https://meta.discourse.org/t/select-kit-dropdown-selected-highlighted-items-have-poor-color-contrast-text-and-icons-disappear/396146/7 "2026-02-18T06:32:02Z")
@BrettH Это происходит в безопасном режиме?
---
### Author:  [@chapoi](https://meta.discourse.org/u/chapoi)
#### Post date: [18.Февраль.2026 06:53:11 UTC](https://meta.discourse.org/t/select-kit-dropdown-selected-highlighted-items-have-poor-color-contrast-text-and-icons-disappear/396146/8 "2026-02-18T06:53:11Z")
> [@BrettH](#):
>
> CSS-переменная `--d-selected` берётся из цвета `$selected` темы, но текст (`.name`, `.desc`) и иконки (`.d-icon`) сохраняют свои цвета по умолчанию, которые могут плохо контрастировать с фоном выделения.
Похоже, ваша цветовая палитра давно не обновлялась, потому что это не обычный цвет выделения. Когда вы в последний раз обновляли свой форум?
---
### Author:  [@Canapin](https://meta.discourse.org/u/Canapin)
#### Post date: [18.Февраль.2026 09:03:51 UTC](https://meta.discourse.org/t/select-kit-dropdown-selected-highlighted-items-have-poor-color-contrast-text-and-icons-disappear/396146/9 "2026-02-18T09:03:51Z")
Неужели это может быть связано с
> [@Discourse Free Plan setup - options are hard to read](https://meta.discourse.org/t/discourse-free-plan-setup-options-are-hard-to-read/395716/13?u=canapin):
>
> Thanks for the details @NateDhaliwal. My hunch is that it’s related to that missing CSS var when light/dark mode is involved, and how it’s compiled via PostCSS. It looks like the browser may be falling back to the light mode background color, which is odd since I can’t reproduce this. Judging by the screenshots, my fix hadn’t been deployed to your instance yet. It should be deployed there now, so give it another try and let me know if you still notice anything off.
?
---
### Author:  [@awesomerobot](https://meta.discourse.org/u/awesomerobot)
#### Post date: [18.Февраль.2026 14:36:34 UTC](https://meta.discourse.org/t/select-kit-dropdown-selected-highlighted-items-have-poor-color-contrast-text-and-icons-disappear/396146/10 "2026-02-18T14:36:34Z")
Да, скорее всего, так и есть — я сталкивался с подобными ситуациями, когда пользовательская цветовая палитра, созданная до добавления новых цветов, оказывалась с недостаточным контрастом… @BrettH, если вы создадите новую цветовую палитру и будете использовать её, проблема сохранится?
---
### Author:  [@BrettH](https://meta.discourse.org/u/BrettH)
#### Post date: [01.Март.2026 22:10:38 UTC](https://meta.discourse.org/t/select-kit-dropdown-selected-highlighted-items-have-poor-color-contrast-text-and-icons-disappear/396146/11 "2026-03-01T22:10:38Z")
Спасибо всем за предложения. Давайте разберём вопросы:
NateDhaliwal — Я ещё не тестировал в безопасном режиме, но, судя по тому, что описывают chapoi и Kris, подозреваю, что безопасный режим решит проблему, так как в этом случае система вернётся к стандартной светлой палитре вместо моей кастомной.
**@chapoi** — Хороший вопрос. Наша цветовая палитра была создана довольно давно — определённо до того, как в базовую палитру были добавлены цвета `selected` и `hover`. Думаю, палитра была настроена при запуске нашего сообщества, и с тех пор мы её не обновляли.
**@awesomerobot** — Это имеет смысл. Изучив код, я вижу, что `resolved_colors` вычисляет значения по умолчанию для `hover` и `selected` с помощью `dark_light_diff`, если они отсутствуют в палитре. Но проблема в том, что цвета текста (`.name`, `.desc`, `.d-icon`) всё ещё используют свои значения по умолчанию, которые были разработаны для цвета выделения стандартной светлой палитры, а не для вычисленного значения по умолчанию для моей тёмной темы.
Я создам новую палитру и явно задам цвета `selected` и `hover` такими значениями, которые обеспечивают должный контраст. Думаю, это исправит ситуацию.
Одна мысль во время тестирования: не имеет ли смысл, чтобы расчёт значений по умолчанию также учитывал контраст текста? Таким образом, старые палитры могли бы корректно обрабатывать новые цветовые добавления без ручного вмешательства. Просто идея — я знаю, что системы цветов сложно настроить правильно, и текущий подход, вероятно, покрывает большинство случаев. Готов создать отдельный запрос на добавление функции, если это будет полезно.
Спасибо за помощь в поиске причины проблемы!