Аквео Небулярная Angular Тема - PullRequest
1 голос
/ 27 марта 2020

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

Если я устанавливаю стиль компонента без поддержки нескольких тем, он работает:

@import "../../@theme/styles/themes.scss";
$border: red;

.contato {
  margin-bottom: 5px !important;
}

nb-accordion nb-accordion-item:last-child.collapsed nb-accordion-item-header {
  border-radius: 5px;
  background-color: $border !important;
}

Но если я включу несколько тем в соответствии с инструкциями в: https://akveo.github.io/nebular/docs/design-system/use-theme-variables#access -with-multiples-theme-mode , это не сработает:

@import "../../@theme/styles/themes.scss";
@include nb-install-component {
  $border: nb-theme(background-alternative-color-4);

  .contato {
    margin-bottom: 5px !important;
  }

  nb-accordion nb-accordion-item:last-child.collapsed nb-accordion-item-header {
    border-radius: 5px;
    background-color: $border !important;
  }
}

Цвет фона компонента остается неизменным.

Что не так? Нужно ли включать что-то еще?

  • Nebular 5.

Спасибо,

1 Ответ

2 голосов
/ 04 апреля 2020

Добавление :: ng-deep в css классы работает для меня:

@import "../../@theme/styles/themes.scss";
@include nb-install-component {
  $border: nb-theme(background-alternative-color-4);

  ::ng-deep .contato {
    margin-bottom: 5px !important;
  }

  ::ng-deep nb-accordion nb-accordion-item:last-child.collapsed nb-accordion-item-header {
    border-radius: 5px;
    background-color: $border !important;
  }
}

См. Документы ng-deep здесь

...