Невозможно установить цвет фона содержимого вкладки в Primeng

Question

Я создал p-tabview с каждой вкладкой, содержащей некоторый контент. Для этого я изменил свой app.component. html, добавив следующий код:

<p-tabView class="tabmain" [style]="{'background-color': 'cyan', 'margin-left':'0'}">
    <p-tabPanel header="Godfather I" leftIcon="pi pi-calendar" [style]="{'background-color': 'red'}">
        <div  [style]="{'background-color': 'red', 'margin-left':'0'}">
        Hi. This is the content.
        </div>
    </p-tabPanel>
</p-tabView>

Я намерен создать темный фон, так как мне нужно создать tabview в темной теме. Я попытался добавить стили выше, чтобы проверить цвет фона, и результат: введите описание изображения здесь

Как видно, часть между содержимым и вкладкой белого цвета. Я намерен стилизовать так, чтобы вся сетка стала темной. Голубой и красный - это всего лишь образцы цветов, чтобы проверить, где фоновый цвет применяется к каждому свойству. Как изменить цвет фона (в настоящее время белый) между границей содержимого и вкладки?

Answer 1

Просмотр документов

You should manipulate p-tabview-panels in your scss(or css) of your component our globaly in style.scss (or css).

So your css is something like this

:host ::ng-deep .p-tabview .p-tabview-panels{
  'background-color': 'red'
}

Read more here in local styling section https://www.primefaces.org/primeng/showcase/# / тематика