Personalizar a caixa de mensagens rápidas.

2 participantes

Ir para baixo

Tópico resolvido Personalizar a caixa de mensagens rápidas.

Mensagem por James Watts 25.01.18 21:30

Detalhes da questão


Endereço do fórum: http://pre-vestibulando.forumeiros.com
Versão do fórum: phpBB3

Descrição


Saudação, Pessoal do FDF.

Hoje, eu gostaria de alterar aparência da minha "caixa de mensagens" (c.d.m rápidas - especificamente). Se vocês me ajudarem a como fazer tal coisa ficaria muito agradecido. Muito feliz
Sendo assim, veja como está e como eu quero que fique:

Normal:

Personalizar a caixa de mensagens rápidas. Ela_no10


Como eu quero:

Personalizar a caixa de mensagens rápidas. Caixa_10

Como vcs podem ver... a diferença entre uma e outra é:

  • A cor verde preenchendo o espaço superior.


  • Os contornos envolta dos retângulos e também de toda a parte superior.


  • A imagem localizada no segmento inferior com o nível de opacidade bem baixo, o que acaba aumentado a sua transparência. Além do mais, ela está centralizada nessa seção.


Quadros

Quadro original:

Personalizar a caixa de mensagens rápidas. Imagem15


Quadro com "nível de transparência":

Personalizar a caixa de mensagens rápidas. Imagem16


  • Se o nível baixo de opacidade ainda não for suficiente, por favor, faça uso do quadro original e o modifique para tanto. Feliz



Em suma é só isso mesmo... Até logo, galerinha do FdF. Estilo cool


James Watts
James Watts
**

Membro desde : 20/11/2017
Mensagens : 78
Pontos : 129

http://pre-vestibulando.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Personalizar a caixa de mensagens rápidas.

Mensagem por Luiz 25.01.18 21:43

Boa noite,

Adicione em sua Folha de Estilos CSS:
Código:
.sceditor-container {
  border: solid 1px #000 !important;
}

.sceditor-container > textarea,
.sceditor-container > iframe {
  background-image: url(https://i62.servimg.com/u/f62/19/80/65/20/imagem16.png);
  background-position: center center;
  background-repeat: no-repeat;
  background-color: #fff !important;
}

.sceditor-container .sceditor-toolbar {
  border-bottom-color: #000 !important;
  background-color: #29cf5b !important;
}

.sceditor-container .sceditor-toolbar .sceditor-group {
  border: solid 1px #000;
  border-radius: 0px;
}

Até breve. o/
Luiz
Luiz
Membro Entusiasta

Membro desde : 23/04/2016
Mensagens : 6645
Pontos : 7451

https://luizfelipe.dev

Ir para o topo Ir para baixo

Tópico resolvido Re: Personalizar a caixa de mensagens rápidas.

Mensagem por James Watts 25.01.18 22:14

Luiz escreveu:Boa noite,

Adicione em sua Folha de Estilos CSS:
Código:
.sceditor-container {
  border: solid 1px #000 !important;
}

.sceditor-container > textarea,
.sceditor-container > iframe {
  background-image: url(https://i62.servimg.com/u/f62/19/80/65/20/imagem16.png);
  background-position: center center;
  background-repeat: no-repeat;
  background-color: #fff !important;
}

.sceditor-container .sceditor-toolbar {
  border-bottom-color: #000 !important;
  background-color: #29cf5b !important;
}

.sceditor-container .sceditor-toolbar .sceditor-group {
  border: solid 1px #000;
  border-radius: 0px;
}

Até breve. o/

Valeu, amigo! Mas só faltou a imagem do "quadro meio transparente".

Veja como ficou:

Personalizar a caixa de mensagens rápidas. Result10
James Watts
James Watts
**

Membro desde : 20/11/2017
Mensagens : 78
Pontos : 129

http://pre-vestibulando.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Personalizar a caixa de mensagens rápidas.

Mensagem por Luiz 25.01.18 22:16

No código que lhe passei acima, troque:
Código:
.sceditor-container > textarea,
.sceditor-container > iframe {
  background-image: url(https://i62.servimg.com/u/f62/19/80/65/20/imagem16.png);
  background-position: center center;
  background-repeat: no-repeat;
  background-color: #fff !important;
}

Por:
Código:
.sceditor-container > textarea,
.sceditor-container iframe {
  background-image: url(https://i62.servimg.com/u/f62/19/80/65/20/imagem16.png) !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  background-color: #fff !important !important;
}

Provavelmente o seu fórum tinha algum estilo que sobreponha os que citei anteriormente, mas agora deve funcionar! Piscada

Não se esqueça de votar nos seus candidatos favoritos!


o/
Luiz
Luiz
Membro Entusiasta

Membro desde : 23/04/2016
Mensagens : 6645
Pontos : 7451

https://luizfelipe.dev

Ir para o topo Ir para baixo

Tópico resolvido Re: Personalizar a caixa de mensagens rápidas.

Mensagem por James Watts 25.01.18 22:23

Luiz escreveu:No código que lhe passei acima, troque:
Código:
.sceditor-container > textarea,
.sceditor-container > iframe {
  background-image: url(https://i62.servimg.com/u/f62/19/80/65/20/imagem16.png);
  background-position: center center;
  background-repeat: no-repeat;
  background-color: #fff !important;
}

Por:
Código:
.sceditor-container > textarea,
.sceditor-container iframe {
  background-image: url(https://i62.servimg.com/u/f62/19/80/65/20/imagem16.png) !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  background-color: #fff !important !important;
}

Provavelmente o seu fórum tinha algum estilo que sobreponha os que citei anteriormente, mas agora deve funcionar! Piscada

Não se esqueça de votar nos seus candidatos favoritos!


o/

Funcionou! Muito obrigado! Muito feliz

Veja como ficou:

Personalizar a caixa de mensagens rápidas. C_m_d_10

Sendo assim, pode fechar o tópico e mais uma vez, obrigado! Muito feliz
James Watts
James Watts
**

Membro desde : 20/11/2017
Mensagens : 78
Pontos : 129

http://pre-vestibulando.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Personalizar a caixa de mensagens rápidas.

Mensagem por Luiz 25.01.18 22:24

Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada.
Tópico marcado como Resolvido e movido para Questões resolvidas.
Luiz
Luiz
Membro Entusiasta

Membro desde : 23/04/2016
Mensagens : 6645
Pontos : 7451

https://luizfelipe.dev

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