Мобильная версияЯ использую vaadin 24.1 и пытаюсь перенести часть устаревшего кода, использующего CssImport, на новый рекомендуемый vaadin метод.
Исходный CSSimport был:
@CssImport(value = "./themes/OnePub/comComponents/grid.css", themeFor = "vaadin-grid") Я удалил CssImport и переименовал файлgrid.css в vaadin-grid.css.
Файл vaadin-grid.css НЕ импортируется из файлаstyles.css, насколько я понимаю, требований vaadin.
В файле vaadin-grid.css у меня есть:
:host([theme~="custom-grid"]) #table::-webkit-scrollbar-thumb, { фон: var (--op-color-purple-dark); } HTML-код сетки показывает:
Проблема в том, что стиль больше не применяется к сетке, хотя он успешно работал в vaadin 24 до того, как я изменил импорт.
Что я делаю не так?
Изменить: Я также пробовал экспериментировать с селекторами частей
Поместив следующий фрагмент в файл style.css, я могу повлиять на ячейку сетки:
vaadin-grid[theme="custom-grid"]::part(cell) { красный цвет; цвет фона: красный; ширина: 10 пикселей; высота: 10 пикселей; } Однако, похоже, для полос прокрутки не существует селектора «части».
Редактирование 2: В ответ на вопрос @cfrick:
Я вас слышу, но я не просто пытаюсь стилизовать полосу прокрутки. Мой путь к vaadin-grid.css выглядит правильно:
frontend/themes/OnePub/comComponents/vaadin-grid.css. Я просто удалил @cssimport, переименовал файлgrid.css в vaadin-grid.css и переместил его по указанному выше пути. Теперь ни один из селекторов не работает. Вот еще один пример:
[part~="header-cell"] { цвет фона: var (-op-color-фиолетовый-темный); } По моему мнению, vaadin не может найти файл vaadin-grid.css. Я пробовал импортировать в style.css и без него (ничего не получилось):
styles.css
@import url('./comComponents/vaadin-grid.css'); Для ясности, мой код/css находится в одном проекте.
