如何更改 PrimeNg 侧边栏的背景颜色

Question

我正在使用 PrimeNg 14 的侧边栏组件。默认情况下，背景颜色为白色。 我希望它是红色或白色以外的任何东西。 我也遵循了主题的文档。 要么我做错了，要么需要其他东西。 请看一看。

HTML：

<p-sidebar [(visible)]="display">
  Sample comtent. <br> Navigation tabs will go here
  <ol>
    <li>home</li>
    <li>contact</li>
    <li>about us</li>
    <li>other controls</li>
  </ol>
</p-sidebar>

我试过这个：

<p-sidebar [(visible)]="display" [style]="{background: 'rgb(33,3,63);'}">
...

还有这个：

<p-sidebar [(visible)]="display" styleClass="p-sidebar-sm">

和

.p-sidebar-sm {
  background: rgb(33,3,63);
}

我也尝试了 ng deep scoping：

:host ::ng-deep .p-sidebar-sm {
    .p-sidebar-sm {
        background: rgb(33,3,63);
    }
}

但是还是没有颜色变化。 请投入。

Answer 1

您需要实现PrimeNg theming来自定义颜色。

如果没有，只需覆盖bachground中p-sidebar的bachground

样式.css

.p-sidebar {
  background: rgb(33, 3, 63) !important;
}