Тема Akveo Nebular Angular

Я пытаюсь переписать некоторые стили компонента 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;
  }
}

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

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

  • Туманность 5.

Спасибо,


angular nebular
person Emilio Numazaki    schedule 27.03.2020    source источник

Ответы (1)


arrow_upward
2
arrow_downward

Добавление :: 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;
  }
}

См. Подробные документы здесь

person Cristian Montini    schedule 04.04.2020
comment
Да, Кристиан, :: ng-deep избавил меня от многих неприятностей, но в данном случае я считаю, что что-то не так с моей настраиваемой темой, потому что не работает подстановка переменной SASS. В конце концов, я просто изменил тему по умолчанию и позже узнаю, как создать новую тему с нуля. Спасибо! - person Emilio Numazaki; 06.04.2020