PrimeNG造型/主題

Question

尋找一些關於如何改變primeNG面板組件背景的造型/主題的建議。

我試圖在組件的scss文件中使用下面的名稱進行覆蓋。但是，這並沒有奏效。內嵌我試圖

<p-panel header="Test" [style]="{'background': '#20A8D8 '}" [toggleable]="true">

它只是改變了組件的背景，沒有標題標題。想知道是否有人堅持/剝皮了任何組件，並可以幫助向我解釋如何去做。

這些可用於面板 - 只是不知道如何訪問/覆蓋它們：

UI面板容器元素。 ui-panel-titlebar標題部分。 ui-panel-title面板的標​​題文本。 ui-panel-titlebar-toggler切換圖標。 ui-panel-content面板的內容。

感謝

Answer 1

很簡單，在你的CSS文件中使用他們作爲類，如下列：

.ui-panel-title { // Your css code for Title text of the panel. }

希望它可以幫助

Answer 2

覆蓋PrimeNG組件的使用styleClass屬性和你的風格必須將您的樣式放入根styles.css或styles.scss（如果您使用的是SCSS）。

我的風格將覆蓋PrimeNG面板頁腳風格：

.editClientPanel .ui-panel-footer { 
background: linear-gradient(to bottom, #f6f7f9 0%, #ebedf0 100%); 

}

希望它可以幫助或者如果你想辦法克服的問題，希望你學到的東西你沒有。