PrimeNG 스타일링/테마

Question

primeNG 패널 구성 요소의 배경에 대한 스타일링/테마 변경 방법에 대한 조언을 찾고 있습니다.

구성 요소에 대한 내 scss 파일의 아래 이름을 사용하여 덮어 쓰려고했습니다. 그러나 그것은 작동하지 않았다. 그것은 단지 구성 요소의 배경이 아닌 제목 헤더를 변경

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

인라인 나는 시도했다. 누군가가 구성 요소를 stlyed/skinned했는지 궁금해하고 어떻게하는지 설명 할 수 있습니다.

이 패널을 사용할 수 있습니다 -을 덮어/액세스하는 방법을 단지 확실하지 :

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. }

그것이 styleClass 속성과 당신과 함께

Answer 2

무시 PrimeNG 구성 요소 '스타일을 도왔다 희망 루트 styles.css 또는 styles.scss에 스타일을 넣어야합니다 (SCSS를 사용하는 경우).

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

}

그것이 도움이되기를 바랍니다하거나 문제가 과거의 방법이 있다면, 당신은, 당신은하지 않았다 뭔가를 배운 희망 :

내 스타일은 PrimeNG 패널 바닥 글 스타일을 재정의합니다.