Стили переопределения Vaadin 24 для NavBar

Версия Vaadin 24 имеет следующие стили дляnavbar:

      [part="navbar"] {
  min-height: var(--lumo-size-xl);
  border-bottom: 1px solid var(--lumo-contrast-10pct);
}

Я хочу удалить следующую строку:

      min-height: var(--lumo-size-xl);

Для этого я создал файл и поместил его вmytheme\componentsпапка:

      [part~="navbar"] {
  border-bottom: 1px solid var(--lumo-contrast-10pct);
}

Но это не имеет никакого эффекта. Что я делаю не так и как правильно переопределить этот стиль?

ОБНОВЛЕНО

я добавилmytheme\components\vaadin-app-layout.css

      [part="navbar"] {
  border-bottom: 1px solid var(--lumo-contrast-10pct);
  min-height: unset;
}

но это не работает

Затем я добавил вstyles.css:

      vaadin-app-layout::part(navbar) {
  border-bottom: 1px solid var(--lumo-contrast-10pct);
  min-height: unset;
}

и это работает. Почему это не работает дляvaadin-app-layout.css?

1 ответ

Я думаю, начиная с Vaadin 24, нужно помещать CSS для настройки компонентов Vaadin в каталогcomponent-stylesвнутри каталога вашей темы (больше не простоcomponents).

Другие вопросы по тегам