Personalizar Chat Invision

2 participantes

Ir para baixo

Tópico resolvido Personalizar Chat Invision

Mensagem por Kasthiel 23.04.14 7:19

  • Descrição:
Minha dúvida.
Estou editando meu chat e gostaria de saber como tiro essas barras de scrol do lado direito e que está embaixo.
Pois quanto mais mensagem tem o chat cria a barra original do chat e fica essa outra ai pertubando e a debaixo é inutil.
E outra como coloco para as mensagem que estao ali tipo mensagem 1, mensagem 2, mensagem 3 ficarem com fundo diferente, uma transparente a outra branca quase transparente?
E para por bordas arredondas no chat tambem?

https://i.imgur.com/OF2Wmat.jpg

  • Informações:
Fórum:http://playing.playsboard.com/Versão:INVISION
Tipo:Pedido de códigoTags:Personalizar,Invision



Última edição por Kasthiel em 23.04.14 23:01, editado 3 vez(es) (Motivo da edição : Link da imagem off)
Kasthiel
Kasthiel
***

Membro desde : 20/12/2012
Mensagens : 130
Pontos : 188

http://wydchronus.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Personalizar Chat Invision

Mensagem por Kyo Panda 23.04.14 13:25

Olá,

Adicione isso ao seu CSS:

Código:
body.chatbox {
  overflow: hidden;
}

Abraços. Feliz
Kyo Panda
Kyo Panda
Hiper Membro

Membro desde : 08/01/2012
Mensagens : 4641
Pontos : 5939

https://ajuda.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Personalizar Chat Invision

Mensagem por Kasthiel 23.04.14 19:39

Bom, em relação as barras de scroll, ja está tudo ok, agora falta o restinho ...
Kasthiel
Kasthiel
***

Membro desde : 20/12/2012
Mensagens : 130
Pontos : 188

http://wydchronus.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Personalizar Chat Invision

Mensagem por Kyo Panda 23.04.14 19:50

Peço perdão por não ter observado todas as demandas, realmente um erro gravíssimo de minha parte.

Quanto as bordas redondas, adicione isso ao seu CSS:

Código:
#chatboxpop {
  border-radius: 10px !important;
}

Quanto maior o 10px, mais redondo.

Quanto ao fundo transparente, precisarei de mais informações. Transparentes referentes a qual elemento? Pois o fundo do chat é branco, logo a transparência em fundo branco não surte efeito.

Mas, adicione isso ao seu CSS:

Código:
p.chatbox_row_1 {
  background: #f00 !important;
}

p.chatbox_row_2 {
  background: #0f0 !important;
}

Aqui você pode mudar o #f00 e #0f0 para as cores desejadas, que elas alternarão nas linhas.

Abraços. Feliz
Kyo Panda
Kyo Panda
Hiper Membro

Membro desde : 08/01/2012
Mensagens : 4641
Pontos : 5939

https://ajuda.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Personalizar Chat Invision

Mensagem por Kasthiel 23.04.14 20:54

Ta quse la ahushaus.
Agora tem um problema olha a foto ai, quando escrevo demasiado texto, fica bugado o texto sem o fundo, o texto fica praticamente flutuando no chat. Dá pra arrumar isso? ou por um limite pro tamanho do texo no chat?

https://i.imgur.com/U4oCcQN.jpg

Tambem estou tentando por uma imagem no fundo e nao to conseguindo, o script e enorme e nao consigo achar o lugar certo.
Kasthiel
Kasthiel
***

Membro desde : 20/12/2012
Mensagens : 130
Pontos : 188

http://wydchronus.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Personalizar Chat Invision

Mensagem por Kyo Panda 23.04.14 21:07

Para a quebra de palavras grandes, adicione isso ao CSS:

Código:
#chatbox > p {
  word-wrap: break-word;
}

Para o fundo:

Código:
#chatbox {
  background: url(http://cdn.css-tricks.com/wp-content/themes/CSS-Tricks-11/images/forest-small.png) !important;
}

Aqui é só trocar o http://cdn.css-tricks.com/wp-content/themes/CSS-Tricks-11/images/forest-small.png pela imagem desejada.

Penso que com uma imagem de fundo, conseguimos adicionar um pouco de transparência as linhas. Feliz

Seria:

Código:
p.chatbox_row_1 {
  background: rgba(255, 255, 255, 0.5) !important;
}

p.chatbox_row_2 {
  background: rgba(255, 255, 255, 0.8) !important;
}

Por exemplo. Feliz
Kyo Panda
Kyo Panda
Hiper Membro

Membro desde : 08/01/2012
Mensagens : 4641
Pontos : 5939

https://ajuda.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Personalizar Chat Invision

Mensagem por Kasthiel 23.04.14 21:16

Kyo Panda escreveu:Para a quebra de palavras grandes, adicione isso ao CSS:

Código:
#chatbox > p {
  word-wrap: break-word;
}

Tipo, esse codigo nao funciona muito bem, quando escrevo a mensagem enorme, ele continua com aquele buguizinho,
So ativa o codigo aqui comigo se eu atualizar a pagina, ai ele pega o limite do texto c tamanho do chat e quebra pra linha de baixo, mas se eu escrever tudo enorme de novo volta aquele erro. Tonto 
Kasthiel
Kasthiel
***

Membro desde : 20/12/2012
Mensagens : 130
Pontos : 188

http://wydchronus.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Personalizar Chat Invision

Mensagem por Kyo Panda 23.04.14 21:22

Hum... Estranho. Bem, remova o código citado e adicione esse:

Código:
#chatbox {
  overflow-x: hidden;
}

Pelo menos dessa forma conseguimos cortar palavras muito grandes. Feliz
Kyo Panda
Kyo Panda
Hiper Membro

Membro desde : 08/01/2012
Mensagens : 4641
Pontos : 5939

https://ajuda.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Personalizar Chat Invision

Mensagem por Kasthiel 23.04.14 21:33

Hahaha.
Pelo menos tira aquele escroll de baixo.
Queria que tivesse um limite pro tamanho do texto, seria muito top.
Do jeito que eu botei fica extranho kkk.
Deixei assim

Nao era assim que eu queria, se souber outro jeito.
Assim o que escreve de mais o chat corta e quando atualiza o resto das mensagens aparecem embaixo.
Código:

#chatbox {
  overflow-x: hidden;
  word-wrap: break-word;
}
Kasthiel
Kasthiel
***

Membro desde : 20/12/2012
Mensagens : 130
Pontos : 188

http://wydchronus.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Personalizar Chat Invision

Mensagem por Kyo Panda 23.04.14 21:47

Vamos tentar mais um pouco. Feliz

Adicione isso ao CSS:

Código:
#chatbox .user-msg {
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
  display: block;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
Kyo Panda
Kyo Panda
Hiper Membro

Membro desde : 08/01/2012
Mensagens : 4641
Pontos : 5939

https://ajuda.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Personalizar Chat Invision

Mensagem por Kasthiel 23.04.14 22:00

Código:

#chatbox {
  overflow-x: hidden;
  word-wrap: break-word;
}

Código:

#chatbox .user-msg {
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
  display: block;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

Bom usando essas dois juntos resolveu meu problema.  Tive uma idéia! 
Kasthiel
Kasthiel
***

Membro desde : 20/12/2012
Mensagens : 130
Pontos : 188

http://wydchronus.forumeiros.com/

Ir para o topo Ir para baixo

Ir para o topo

- Tópicos semelhantes

 
Permissões neste sub-fórum
Não podes responder a tópicos