Duvidas skin/css primefaces

Dentro do jar do Primefaces tem os css’s. Você pode editar ou substituí-los. Outra opção é criar um css que sobrescreva as classes do css do primefaces.

você pode criar seu próprio tema para os componentes do primefaces
que nada mais é do que um .jar que você adicona no seu projeto
e no seu web.xml você declara seu tema assim:

<context-param>
    <param-name>primefaces.THEME</param-name>
    <param-value>meutema</param-value>
</context-param>

a estrutura do .jar do tema deve ser a seguinte:

META-INF
resources
primefaces-nomemeutema
images
suas imagens do tema
theme.css

você pode baixar alguns temas no site do primefaces
e descompactar o .jar para dar uma olhada

Tranquilo…
mas naquele monte de ‘uis’ la
qual é o que altera o header do p panel?

e tem ou não tem como tirar aquela setinha do accordion panel?

dei uma olhada no css aqui… é muito doido aquilo pra mim… tem uns background-icone la que quando tu acessa o arquivo, é um pacote de icones…
não entendi muito bem como funciona

e se coloco um id no meu p:panel
e coloco no css:

#testePanel {

background-color: #000 !important;

font-size: 44px !important;

}

não muda nem a fonte nem a cor de fundo

marcosharbs:

você pode criar seu próprio tema para os componentes do primefaces
que nada mais é do que um .jar que você adicona no seu projeto
e no seu web.xml você declara seu tema assim:

<context-param>
    <param-name>primefaces.THEME</param-name>
    <param-value>meutema</param-value>
</context-param>

a estrutura do .jar do tema deve ser a seguinte:

META-INF
resources
primefaces-nomemeutema
images
suas imagens do tema
theme.css

você pode baixar alguns temas no site do primefaces
e descompactar o .jar para dar uma olhada

oi Marcos.

eu cheguei a ver isso, acessei o themeroller, mas eu gosto muito do tema default (sam), só queria mudar duas coisas dele, que são as cores do header do p:panel e tirar a seta do accordion panel…
se desse pra fazer deixando o default la, e só mudando esses dois detalhes, nem que seja em um css paralelo, eu ia gostar/achar prático

da uma olhada na tua página gerada no browser
olha o fonte dela
e ve qual css ele ta aplicando no header
de cabeça não lembro qual que ele usa

entendi
você consegue faezr sim
pdoe aplicar um style seu ao componente para sobrescrever o padrão

como por exemplo o abaixo:

margin: 0px !important;

padding: 0px !important;

text-align: left;

width: 250px;

border-width: 0px !important;

background-color: none !important;

background: none !important;

background-image: none !important;

filter:opacity(alpha=100);

border-collapse:collapse !important;

esse ai altera o conteúdo do panel mas não o header
no header você tem que ver qual o css que ele usa
você consegue ver isso olhando o codigo fonte gerado no browser
dai olha como é o css la no tema padrão do primefaces
e sobrescreve no atributo stylr do componente para como você quiser

é… se eu altero a propriedade:
.ui-widget-header
altera a cor dos p panel e varios outros header… mas altera!
o negocio do icone do accordion, impossivel ainda…

e pq não consigo alterar a cor do background do panel se eu dou um id p/ ele, e seto da forma supracitada?

ai não sei te responder
não sou especialista em css
mas olhando o css do tema ali
e com paciência para achar os lugares certos para alterar
acho que você consegue sobrescrever

Boa tarde pessoal,

Estou com duvida em personaliozação no prime faces tambem,

Estou utilizando pick lista que possuim o campo source e target um do lado do outro.

Eu gostaria de deixar na vertical, é possivel?