Sombreamento e arredondamento de todo o fórum

Ver o tópico anterior Ver o tópico seguinte Ir em baixo

Resolvido Sombreamento e arredondamento de todo o fórum

Mensagem por Cristian 95 em 09/07/11, 02:29 am

Qual é sua questão:
Bom... nesse fórum, as coisas são separadas por um tipo de imagem, seilá, vendo bem, ele é arredondado e tem um sombreamento, que separa tudo, os perfis do topico, os widget do outros widget e etc... queria saber como deixa assim...

Que medidas você tomou para corrigir o problema:
Vim aqui ao FdF

Endereço do fórum:
http://fest-gunz.forumeiros.com

Versão do fórum:
INVISION
avatar

Cristian 95
Usuário destaque

Masculino
Inscrito dia : 16/12/2010
Mensagens : 946
Pontos Ativos : 1278

Ver perfil do usuário http://secondlifevirtual.forumeiros.com/

Resolvido Re: Sombreamento e arredondamento de todo o fórum

Mensagem por Luciano98 em 09/07/11, 02:42 am

Olá!

Aceda à "Folha de estilo CSS":
Painel de Controle Seta Visualização Seta Imagens e cores Seta Cores Seta Folha de estilo CSS

Código:
Código:
.introduction,.panel,.post{
background-color:transparent;
border:1px solid #eee;
-moz-border-radius-topleft:15px;
-webkit-border-radius-topleft:15px;
-moz-border-radius-bottomright:15px;
-webkit-border-radius-bottomright:15px;
-moz-box-shadow:0px 5px 5px #CCCCCC;
-webkit-box-shadow:0px 5px 5px #CCCCCC;
}

div.module{
background-color:transparent;
background-image:url(http://hitskin.com/themes/13/92/59/i_list_bg.png);
background-repeat:repeat;
border:1px solid #eee;
-moz-border-radius-topleft:15px;
-webkit-border-radius-topleft:15px;
-moz-border-radius-bottomright:15px;
-webkit-border-radius-bottomright:15px;
-moz-box-shadow:0px 5px 5px #CCCCCC;
-webkit-box-shadow:0px 5px 5px #CCCCCC;
}

input.button1,input.button2,a.button1,a.button2,button.button2,button.button1{
background:#e7f3f7 url(http://im1.all-up.com/i/img/bg_button.png) repeat-x;
border:1px solid #008AE6;
color:#5e6669;
overflow:visible;
-moz-border-radius-topleft:15px;
-webkit-border-radius-topleft:15px;
-moz-border-radius-topright:0px;
-webkit-border-radius-topright:0px;
-moz-border-radius-bottomright:15px;
-webkit-border-radius-bottomright:15px;
-moz-border-radius-bottomleft:0px;
-webkit-border-radius-bottomleft:0px;
-moz-box-shadow:0px 3px 3px #CCCCCC;
-webkit-box-shadow:0px 3px 3px #CCCCCC;
}
input.button1:hover,input.button2:hover,a.button1:hover,a.button2:hover,button.button2:hover,button.button1:hover{
border:1px solid #FF9D00;
color:black;
background-position:top;
-moz-box-shadow:0px 5px 5px #CCCCCC;
-webkit-box-shadow:0px 5px 5px #CCCCCC;
}

dl.codebox{
border:1px solid #008AE6;
padding:6px;
-moz-border-radius-topleft:15px;
-webkit-border-radius-topleft:15px;
-moz-border-radius-topright:0px;
-webkit-border-radius-topright:0px;
-moz-border-radius-bottomright:15px;
-webkit-border-radius-bottomright:15px;
-moz-border-radius-bottomleft:0px;
-webkit-border-radius-bottomleft:0px;
-moz-box-shadow:0px 10px 10px #CCCCCC;
-webkit-box-shadow:0px 10px 10px #CCCCCC;
}

codebox dt{
background-image:url('http://i65.servimg.com/u/f65/11/95/30/70/citati10.png');
background-repeat:no-repeat;
background-position:top right;
padding:5px 10px 3px 3px;
color:#000;
font-weight:bold;
background-color:#707070;
border:1px solid #888888;
-moz-border-radius:12px;
-webkit-border-radius:12px;
}

#text_editor_textarea{
border:1px solid #008AE6;
-moz-border-radius-topleft:15px;
-webkit-border-radius-topleft:15px;
-moz-border-radius-topright:0px;
-webkit-border-radius-topright:0px;
-moz-border-radius-bottomright:15px;
-webkit-border-radius-bottomright:15px;
-moz-border-radius-bottomleft:0px;
-webkit-border-radius-bottomleft:0px;
-moz-box-shadow:0px 10px 10px #CCCCCC;
-webkit-box-shadow:0px 10px 10px #CCCCCC;
}


.postprofile{
border:1px solid #eee;
text-align:left;
background-image:url(http://hitskin.com/themes/13/92/59/i_list_bg.png);
background-repeat:repeat;
-moz-border-radius-topleft:15px;
-webkit-border-radius-topleft:15px;
-moz-border-radius-bottomright:15px;
-webkit-border-radius-bottomright:15px;
-moz-box-shadow:0px 5px 5px #CCCCCC;
-webkit-box-shadow:0px 5px 5px #CCCCCC;
}

.h3,.catHead{
background-image:url(http://www.sebrasil.com.br/styles/AeroBlack/theme/images/cellpic1.gif);
background-repeat:repeat;
border:1px solid #eee;
color:#FFF;
-moz-border-radius-topleft:10px;
-webkit-border-radius-topleft:10px;
-moz-border-radius-bottomright:10px;
-webkit-border-radius-bottomright:10px;
-moz-box-shadow:0px 5px 5px #CCCCCC;
-webkit-box-shadow:0px 5px 5px #CCCCCC;
text-align:center;
}
ul.topiclist{
border:1px solid #eee;
-moz-border-radius-topleft:10px;
-webkit-border-radius-topleft:10px;
-moz-border-radius-bottomright:10px;
-webkit-border-radius-bottomright:10px;
-moz-box-shadow:0px 2px 2px #CCCCCC;
-webkit-box-shadow:0px 2px 2px #CCCCCC;
}


.pathname-box{
background-image:url('http://demo.phpbb3styles.net/styles/proVista/theme/images/cellpic4.gif');
background-repeat:repeat;
border:1px solid #eee;
-moz-border-radius-topleft:10px;
-webkit-border-radius-topleft:10px;
-moz-border-radius-bottomright:10px;
-webkit-border-radius-bottomright:10px;
-moz-box-shadow:0px 5px 5px #CCCCCC;
-webkit-box-shadow:0px 5px 5px #CCCCCC;
}

Salve.

Até mais.
Luciano98
avatar

Luciano98
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 01/09/2010
Mensagens : 7648
Pontos Ativos : 11045

Ver perfil do usuário http://ajuda.forumeiros.com

Resolvido Re: Sombreamento e arredondamento de todo o fórum

Mensagem por Cristian 95 em 09/07/11, 03:19 am

Agradeço a quem sempre edita o titulo do meu tópico. (:

@Luciano, ae deu certo, pego dirieitinho, mas como fas para editar?
avatar

Cristian 95
Usuário destaque

Masculino
Inscrito dia : 16/12/2010
Mensagens : 946
Pontos Ativos : 1278

Ver perfil do usuário http://secondlifevirtual.forumeiros.com/

Resolvido Re: Sombreamento e arredondamento de todo o fórum

Mensagem por Luciano98 em 09/07/11, 03:35 am

@Cristian 95 escreveu:Agradeço a quem sempre edita o titulo do meu tópico. (:

@Luciano, ae deu certo, pego dirieitinho, mas como fas para editar?
Para editar você deve aprender CSS.
Me fale o que você quer editar que eu edito.

OBS: Sou eu quem muda o título.

Até mais.
Luciano98.
avatar

Luciano98
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 01/09/2010
Mensagens : 7648
Pontos Ativos : 11045

Ver perfil do usuário http://ajuda.forumeiros.com

Resolvido Re: Sombreamento e arredondamento de todo o fórum

Mensagem por Cristian 95 em 09/07/11, 05:37 am

Ok Luciano... mas pode ser mais tarde? ainda não durmi, se minha mãe me pega no pc essa hora ele fala um monte, ai amanhã vejo com mais calma beleza?

e aproveitando que você está me ajudando, se não for pedir muito, eu vi em um topico, falando que você era bom com esses códigos, seria possivel me passa o site onde você aprendeu JavaScript ou CSS? obrigado. quero aprender uma das linguas. (:
-----------
Pronto Luciano, já sei como quero. (:

a parte do sombreamento pode por dessa cor, "#575757"
avatar

Cristian 95
Usuário destaque

Masculino
Inscrito dia : 16/12/2010
Mensagens : 946
Pontos Ativos : 1278

Ver perfil do usuário http://secondlifevirtual.forumeiros.com/

Resolvido Re: Sombreamento e arredondamento de todo o fórum

Mensagem por Luciano98 em 09/07/11, 05:02 pm

Olá!

Aceda à "Folha de estilo CSS":
Painel de Controle Seta Visualização Seta Imagens e cores Seta Cores Seta Folha de estilo CSS

Código:
Código:
.introduction,.panel,.post{
background-color:transparent;
border:1px solid #eee;
-moz-border-radius-topleft:15px;
-webkit-border-radius-topleft:15px;
-moz-border-radius-bottomright:15px;
-webkit-border-radius-bottomright:15px;
-moz-box-shadow:0px 5px 5px #575757;
-webkit-box-shadow:0px 5px 5px #575757;
}

div.module{
background-color:transparent;
background-image:url(http://hitskin.com/themes/13/92/59/i_list_bg.png);
background-repeat:repeat;
border:1px solid #eee;
-moz-border-radius-topleft:15px;
-webkit-border-radius-topleft:15px;
-moz-border-radius-bottomright:15px;
-webkit-border-radius-bottomright:15px;
-moz-box-shadow:0px 5px 5px #575757;
-webkit-box-shadow:0px 5px 5px #575757;
}

input.button1,input.button2,a.button1,a.button2,button.button2,button.button1{
background:#e7f3f7 url(http://im1.all-up.com/i/img/bg_button.png) repeat-x;
border:1px solid #008AE6;
color:#5e6669;
overflow:visible;
-moz-border-radius-topleft:15px;
-webkit-border-radius-topleft:15px;
-moz-border-radius-topright:0px;
-webkit-border-radius-topright:0px;
-moz-border-radius-bottomright:15px;
-webkit-border-radius-bottomright:15px;
-moz-border-radius-bottomleft:0px;
-webkit-border-radius-bottomleft:0px;
-moz-box-shadow:0px 3px 3px #575757;
-webkit-box-shadow:0px 3px 3px #575757;
}
input.button1:hover,input.button2:hover,a.button1:hover,a.button2:hover,button.button2:hover,button.button1:hover{
border:1px solid #FF9D00;
color:black;
background-position:top;
-moz-box-shadow:0px 5px 5px #575757;
-webkit-box-shadow:0px 5px 5px #575757;
}

dl.codebox{
border:1px solid #008AE6;
padding:6px;
-moz-border-radius-topleft:15px;
-webkit-border-radius-topleft:15px;
-moz-border-radius-topright:0px;
-webkit-border-radius-topright:0px;
-moz-border-radius-bottomright:15px;
-webkit-border-radius-bottomright:15px;
-moz-border-radius-bottomleft:0px;
-webkit-border-radius-bottomleft:0px;
-moz-box-shadow:0px 10px 10px #575757;
-webkit-box-shadow:0px 10px 10px #575757;
}

codebox dt{
background-image:url('http://i65.servimg.com/u/f65/11/95/30/70/citati10.png');
background-repeat:no-repeat;
background-position:top right;
padding:5px 10px 3px 3px;
color:#000;
font-weight:bold;
background-color:#707070;
border:1px solid #888888;
-moz-border-radius:12px;
-webkit-border-radius:12px;
}

#text_editor_textarea{
border:1px solid #008AE6;
-moz-border-radius-topleft:15px;
-webkit-border-radius-topleft:15px;
-moz-border-radius-topright:0px;
-webkit-border-radius-topright:0px;
-moz-border-radius-bottomright:15px;
-webkit-border-radius-bottomright:15px;
-moz-border-radius-bottomleft:0px;
-webkit-border-radius-bottomleft:0px;
-moz-box-shadow:0px 10px 10px #575757;
-webkit-box-shadow:0px 10px 10px #575757;
}


.postprofile{
border:1px solid #eee;
text-align:left;
background-image:url(http://hitskin.com/themes/13/92/59/i_list_bg.png);
background-repeat:repeat;
-moz-border-radius-topleft:15px;
-webkit-border-radius-topleft:15px;
-moz-border-radius-bottomright:15px;
-webkit-border-radius-bottomright:15px;
-moz-box-shadow:0px 5px 5px #575757;
-webkit-box-shadow:0px 5px 5px #575757;
}

.h3,.catHead{
background-image:url(http://www.sebrasil.com.br/styles/AeroBlack/theme/images/cellpic1.gif);
background-repeat:repeat;
border:1px solid #eee;
color:#FFF;
-moz-border-radius-topleft:10px;
-webkit-border-radius-topleft:10px;
-moz-border-radius-bottomright:10px;
-webkit-border-radius-bottomright:10px;
-moz-box-shadow:0px 5px 5px #575757;
-webkit-box-shadow:0px 5px 5px #575757;
text-align:center;
}
ul.topiclist{
border:1px solid #eee;
-moz-border-radius-topleft:10px;
-webkit-border-radius-topleft:10px;
-moz-border-radius-bottomright:10px;
-webkit-border-radius-bottomright:10px;
-moz-box-shadow:0px 2px 2px #575757;
-webkit-box-shadow:0px 2px 2px #575757;
}


.pathname-box{
background-image:url('http://demo.phpbb3styles.net/styles/proVista/theme/images/cellpic4.gif');
background-repeat:repeat;
border:1px solid #eee;
-moz-border-radius-topleft:10px;
-webkit-border-radius-topleft:10px;
-moz-border-radius-bottomright:10px;
-webkit-border-radius-bottomright:10px;
-moz-box-shadow:0px 5px 5px #575757;
-webkit-box-shadow:0px 5px 5px #575757;
}

Salve.

Até mais.
Luciano98
avatar

Luciano98
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 01/09/2010
Mensagens : 7648
Pontos Ativos : 11045

Ver perfil do usuário http://ajuda.forumeiros.com

Resolvido Re: Sombreamento e arredondamento de todo o fórum

Mensagem por Cristian 95 em 09/07/11, 05:35 pm

Luciano pensei que a sobreamento era o que dava animação... mas tem uma parte branca, teria como deixa-la preta? "#000000"
avatar

Cristian 95
Usuário destaque

Masculino
Inscrito dia : 16/12/2010
Mensagens : 946
Pontos Ativos : 1278

Ver perfil do usuário http://secondlifevirtual.forumeiros.com/

Resolvido Re: Sombreamento e arredondamento de todo o fórum

Mensagem por Convidad em 09/07/11, 09:28 pm

Oi Cristian 95,

Você está se referindo às bordas ou uma outra parte? Pelo que pude entender, você estava se referindo às bordas no código. Abaixo o código editado e o local onde deverá inseri-lo:

Código:
.introduction,.panel,.post{
background-color:transparent;
border:1px solid #000000;
-moz-border-radius-topleft:15px;
-webkit-border-radius-topleft:15px;
-moz-border-radius-bottomright:15px;
-webkit-border-radius-bottomright:15px;
-moz-box-shadow:0px 5px 5px #575757;
-webkit-box-shadow:0px 5px 5px #575757;
}

div.module{
background-color:transparent;
background-image:url(http://hitskin.com/themes/13/92/59/i_list_bg.png);
background-repeat:repeat;
border:1px solid #000000;
-moz-border-radius-topleft:15px;
-webkit-border-radius-topleft:15px;
-moz-border-radius-bottomright:15px;
-webkit-border-radius-bottomright:15px;
-moz-box-shadow:0px 5px 5px #575757;
-webkit-box-shadow:0px 5px 5px #575757;
}

input.button1,input.button2,a.button1,a.button2,button.button2,button.button1{
background:#e7f3f7 url(http://im1.all-up.com/i/img/bg_button.png) repeat-x;
border:1px solid #008AE6;
color:#5e6669;
overflow:visible;
-moz-border-radius-topleft:15px;
-webkit-border-radius-topleft:15px;
-moz-border-radius-topright:0px;
-webkit-border-radius-topright:0px;
-moz-border-radius-bottomright:15px;
-webkit-border-radius-bottomright:15px;
-moz-border-radius-bottomleft:0px;
-webkit-border-radius-bottomleft:0px;
-moz-box-shadow:0px 3px 3px #575757;
-webkit-box-shadow:0px 3px 3px #575757;
}
input.button1:hover,input.button2:hover,a.button1:hover,a.button2:hover,button.button2:hover,button.button1:hover{
border:1px solid #000000;
color:black;
background-position:top;
-moz-box-shadow:0px 5px 5px #575757;
-webkit-box-shadow:0px 5px 5px #575757;
}

dl.codebox{
border:1px solid #008AE6;
padding:6px;
-moz-border-radius-topleft:15px;
-webkit-border-radius-topleft:15px;
-moz-border-radius-topright:0px;
-webkit-border-radius-topright:0px;
-moz-border-radius-bottomright:15px;
-webkit-border-radius-bottomright:15px;
-moz-border-radius-bottomleft:0px;
-webkit-border-radius-bottomleft:0px;
-moz-box-shadow:0px 10px 10px #575757;
-webkit-box-shadow:0px 10px 10px #575757;
}

codebox dt{
background-image:url('http://i65.servimg.com/u/f65/11/95/30/70/citati10.png');
background-repeat:no-repeat;
background-position:top right;
padding:5px 10px 3px 3px;
color:#000;
font-weight:bold;
background-color:#707070;
border:1px solid #888888;
-moz-border-radius:12px;
-webkit-border-radius:12px;
}

#text_editor_textarea{
border:1px solid #008AE6;
-moz-border-radius-topleft:15px;
-webkit-border-radius-topleft:15px;
-moz-border-radius-topright:0px;
-webkit-border-radius-topright:0px;
-moz-border-radius-bottomright:15px;
-webkit-border-radius-bottomright:15px;
-moz-border-radius-bottomleft:0px;
-webkit-border-radius-bottomleft:0px;
-moz-box-shadow:0px 10px 10px #575757;
-webkit-box-shadow:0px 10px 10px #575757;
}


.postprofile{
border:1px solid #000000;
text-align:left;
background-image:url(http://hitskin.com/themes/13/92/59/i_list_bg.png);
background-repeat:repeat;
-moz-border-radius-topleft:15px;
-webkit-border-radius-topleft:15px;
-moz-border-radius-bottomright:15px;
-webkit-border-radius-bottomright:15px;
-moz-box-shadow:0px 5px 5px #575757;
-webkit-box-shadow:0px 5px 5px #575757;
}

.h3,.catHead{
background-image:url(http://www.sebrasil.com.br/styles/AeroBlack/theme/images/cellpic1.gif);
background-repeat:repeat;
border:1px solid #000000;
color:#FFF;
-moz-border-radius-topleft:10px;
-webkit-border-radius-topleft:10px;
-moz-border-radius-bottomright:10px;
-webkit-border-radius-bottomright:10px;
-moz-box-shadow:0px 5px 5px #575757;
-webkit-box-shadow:0px 5px 5px #575757;
text-align:center;
}
ul.topiclist{
border:1px solid #000000;
-moz-border-radius-topleft:10px;
-webkit-border-radius-topleft:10px;
-moz-border-radius-bottomright:10px;
-webkit-border-radius-bottomright:10px;
-moz-box-shadow:0px 2px 2px #575757;
-webkit-box-shadow:0px 2px 2px #575757;
}


.pathname-box{
background-image:url('http://demo.phpbb3styles.net/styles/proVista/theme/images/cellpic4.gif');
background-repeat:repeat;
border:1px solid #000000;
-moz-border-radius-topleft:10px;
-webkit-border-radius-topleft:10px;
-moz-border-radius-bottomright:10px;
-webkit-border-radius-bottomright:10px;
-moz-box-shadow:0px 5px 5px #575757;
-webkit-box-shadow:0px 5px 5px #575757;
}

1. Painel de controle
2. Visualização
3. Cores
4. Folha de estilos CSS

Espero que essa mensagem lhe ajude. Sinta-se livre para entrar em contato conosco novamente se tiver outras consultas ou preocupações.

Obrigado e tenha um bom fim de semana!

Supero

Convidad
Convidado


Resolvido Re: Sombreamento e arredondamento de todo o fórum

Mensagem por LiteCoder em 09/07/11, 09:58 pm

Oi Supero,

O código disponibilizado por você não funciona no navegador Opera. O Opera não reconhece o -webkit- e o -moz-, ele não necessita destes códigos no início, sendo assim, fica somente o próprio código, no caso border-radius.
Desculpa, por me intrometer.

Abraços.
avatar

LiteCoder
Nível 6

Masculino
Inscrito dia : 08/07/2011
Mensagens : 61
Pontos Ativos : 84

Ver perfil do usuário

Resolvido Re: Sombreamento e arredondamento de todo o fórum

Mensagem por Convidad em 09/07/11, 10:09 pm

Oi CupCake,

O código não foi desenvolvido por mim, eu simplesmente o editei adequando-o aos padrões que o membro requisitou. O que fiz foi editar a cor das bordas, e não adicionar bordas arredondadas funcionando em todos os navegadores. O código que passei funciona corretamente para o efeito desejado (alterar a cor da borda).

Espero que isso responda a sua questão.

Convidad
Convidado


Resolvido Re: Sombreamento e arredondamento de todo o fórum

Mensagem por Cristian 95 em 10/07/11, 02:28 am

Pode closar aqui.

Obrigado Luciano e Supero. (:


Última edição por Cristian 95 em 10/07/11, 02:29 am, editado 1 vez(es)
avatar

Cristian 95
Usuário destaque

Masculino
Inscrito dia : 16/12/2010
Mensagens : 946
Pontos Ativos : 1278

Ver perfil do usuário http://secondlifevirtual.forumeiros.com/

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo

- Tópicos similares

Permissão deste fórum:
Você não pode responder aos tópicos neste fórum