Dúvidas em colorir o prosilver

[robra]

1 - Notasse que entre a assinatura e o post do user existe uma linha divisória cinza, como a linha que divide o post do mini-perfil. Onde eu altero a cor desta linha que divide a assinatura do post?

No arquivo content.css, ache:

Código: Selecionar todos

.signature {
margin-top: 1.5em;
padding-top: 0.2em;
font-size: 1.1em;
border-top: 1px solid #CCC;
clear: left;
line-height: 140%;
overflow: hidden;
width: 100%;
} 

A cor cinza é definida na linha border-top: 1px solid #CCC;

2 - É possível add uma borda ao post? Tipo uma borda a cor de fundo do post? Fanzendo o post ficar, tipo, dentro de uma caixa?

No arquivo colours.css, ache:

Código: Selecionar todos

.bg1    { background-color: ##EDEDED; }
.bg2    { background-color: #F3F3F3;  }        

bg1 e bg2 são as cores do bloco inteiro da 1ª e da 2ª mensagem do Tópico, continuando de forma sequencial.
Quanto a borda e a cor de fundo onde a mensagem é postada, no content.css ache:

Código: Selecionar todos

.content {
    min-height: 3em;
    overflow: hidden;
    line-height: 1.4em;
    font-family: "Lucida Grande", "Trebuchet MS", Verdana, Helvetica, Arial, sans-serif;
    font-size: 1em;
    color: #333333;
    padding-bottom: 1px;
} 

Adicione a linha border: 1px solid #000000;, em uma nova linha, abaixo da linha color: #333333;, sendo a cor preta da borda definida em #000000.
Adicione[/b] a linha background-color: #FFF000;, em uma nova linha, acima da linha color: #333333;, sendo a cor amarela do fundo onde a mensagem é postada definida em #FFF000;.

3 - É possível add uma linha divisória entre os posts, tipo, logo acima do título das mensagens de resposta?

No arquivo content.css, ache:

Código: Selecionar todos

.postbody h3 {
font-size: 1.5em;
padding: 2px 0 0 0;
margin: 0 0 0.3em 0 !important;
text-transform: none;
border: none;
font-family: "Trebuchet MS", Verdana, Helvetica, Arial, sans-serif;
line-height: 125%;
} 

Adicione a linha border-top: 1px solid #000000;, em uma nova linha, abaixo da linha border: none;, sendo a cor preta definida em #000000.

Abraço.

[Philippus]

Muito bom robra, vlw, perfeito.

No ponto dois pensei em algo assim também.

Código: Selecionar todos

.bg1	{
	background-color: #ededed;
	border: 1px solid #204103;
}
.bg2	{
	background-color: #f3f3f3;
	border: 1px solid #204103;
}
.bg3	{
	background-color: #f3f3f3;
	border: 1px solid #204103;
}

Utilizei o conhecimento que vc me passou e adaptei.
Ficou interessante o resultado no fórum.

Outra pergunta, estas bordas, como a que coloquei acima, elas são "quadradas", existe alguma forma de fazer com que elas fiquem com o canto "aredondado"?

Grato
Philippus

[robra]

Outra pergunta, estas bordas, como a que coloquei acima, elas são "quadradas", existe alguma forma de fazer com que elas fiquem com o canto "aredondado"?

Acrescente a linha border-radius: 10px; ficando desta forma:

Código: Selecionar todos

.bg1   {
   background-color: #ededed;
   border: 1px solid #204103;
   border-radius: 10px;
}
.bg2   {
   background-color: #f3f3f3;
   border: 1px solid #204103;
   border-radius: 10px;
}
.bg3   {
   background-color: #f3f3f3;
   border: 1px solid #204103;
   border-radius: 10px;
} 

Abraço.

[robra]

Deu certo ?
Entrei lá no Fórum e não vi as bordas contornando toda a postagem.

Abraço.

[Philippus]

Deu certo ?
Entrei lá no Fórum e não vi as bordas contornando toda a postagem.

Abraço.

Deu certo sim robra, ficou bem legal.
ainda estou com testes na base local, mas veja o resultado. :D
Mais dua dúvidas sobre estas bordas...

Tentei de várias formas, mas não consegui, fazer com que a borda que divide a assinatura da mensagem ficasse de lado a lado totalmente, encostando na borda do corpo da mensagem. Como está, ela não preenche todos os espaços.

Da mesma forma, gostaria que a borda que divide o mini perfil da mensagem, fosse de cima a baixo preenchendo todo o espaço até encostar na borda do corpo da mensagem.

Como faço isso?

Grato
Philippus

[robra]

Mais dua dúvidas sobre estas bordas...

Tentei de várias formas, mas não consegui, fazer com que a borda que divide a assinatura da mensagem ficasse de lado a lado totalmente, encostando na borda do corpo da mensagem. Como está, ela não preenche todos os espaços.

Da mesma forma, gostaria que a borda que divide o mini perfil da mensagem, fosse de cima a baixo preenchendo todo o espaço até encostar na borda do corpo da mensagem.

Como faço isso?

Caso queira saber como identificar os elementos que compõe a página, veja o vídeo no tópico viewtopic.php?f=149&t=45575.
Sei que o assunto é diferente mas o princípio é o mesmo, o de clicar com o botão direito do mouse e escolher "inspecionar elemento", no Google Chrome.
Em ambos os casos as respectivas bordas acompanham o tamanho tanto da assinatura como do perfil e por isso não dá para aumentá-las onde estão. Para fazer estas alterações teria de:
- Eliminar a borda do perfil e criar a borda esquerda do corpo da mensagem (.postbody {).
- Eliminar a margem esquerda do corpo da mensagem (.postbody {).
- Criar a margem esquerda para o conteúdo (.content {).
- Criar a margem superior da assinatura (.signature {).
O problema é que se uma mensagem for pequena, apenas de 1 linha, e o usuário não tiver uma assinatura grande, a borda esquerda da mensagem poderá ficar menor que o perfil, já que esta borda acompanhará o tamanho da mensagem + o tamanho da assinatura.

Abraço.

[robra]

Se você quiser, pode eliminar a duplicidade de informações referente ao .postprofile { e ao .postbody { no colours.css e no content.css.
>> Quanto ao .postbody {:
No colours.css você tem as linhas...

Código: Selecionar todos

.postbody {
color: #333;
} 

...que podem ser eliminadas já que no content.css tem...

Código: Selecionar todos

.postbody {
padding: 0;
line-height: 1.48em;
color: #333;
width: 76%;
float: right;
clear: both;
} 

... com a mesma linha color: #333;

>> Quanto ao .postprofile {:
No colours.css você tem as linhas...

Código: Selecionar todos

.postprofile {
color: #666;
border-right-color: #204103;
} 

...que podem ser eliminadas já que no content.css tem...

Código: Selecionar todos

.postprofile {
margin: 5px 0 10px 0;
min-height: 80px;
color: #666;
border-right: 1px solid white;
width: 22%;
float: left;
display: inline;
} 

... precisando apenas alterar a linha border-right: 1px solid white; para border-right: 1px solid #204103;.

Abraço.