Como deixo meu chatbox desse jeito?

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

Resolvido Como deixo meu chatbox desse jeito?

Mensagem por @Evil em 10/03/13, 08:48 am

Qual é minha questão:
Olá pessoal queria saber como deixo a chatbox assim ou shoutbox no caso que eu vejo no fórum do mu que eu jogo olhem só ela pode coloca avisos pode colocar as regras do shoutbox ou chatbox em um spoiler ou sem spoiler eu queria deixa a minha desse jeito alguem podia manda um código ou oque devo fazer?
imagem para ficar melhor para ajuda:


Endereço do meu fórum:
http://universomaker.foruns.com.pt

Versão do fórum:
PHPBB3


Última edição por Evil em 10/03/13, 04:45 pm, editado 1 vez(es)
avatar

@Evil
Usuário destaque

Masculino
Inscrito dia : 24/02/2013
Mensagens : 505
Pontos Ativos : 754

Ver perfil do usuário http://coracaodomaker.fantasyboard.net/

Resolvido Re: Como deixo meu chatbox desse jeito?

Mensagem por [F]lames em 10/03/13, 10:04 am

Olá,

Adicione isto á teu CSS:

Código:
    /*chatbox*/
        #chatbox, #chatbox_footer, #chatbox_members {
        background: white;
        border-top: 1px solid #EAEAEA;
        }

        #chatbox_header.main-head {
        background: #2C5687 url(http://www.ipbforumskins.com/skindemo/public/style_images/master/maintitle.png) repeat-x top;
        padding: 2px;
        font-weight: 300;
        -moz-border-radius: 4px 4px 0 0;
        border-radius: 4px 4px 0 0;
        border-radius: 4px 4px 0 0;
        -webkit-box-shadow: inset 0px 1px 0 #528CBC;
        -moz-box-shadow: inset 0px 1px 0 #528cbc;
        box-shadow: inset 0px 1px 0 #528CBC;
        border-width: 1px 1px 0 1px;
        border-color: #316897;
        border-style: solid;
        }

        .chatbox-title, .chatbox-title a.chat-title {
          color: white;
        font-size: 15px;
        font-weight: bold;
        }

        .chatbox-options li, .chatbox-options li a, .chatbox-options li label {
        color: white;
        }

        #chatbox_members .member-title {
        background: #F8E7DD;
        background-color: #F4F9FD;
        background-image: none;
        border-bottom: 2px solid red;
        color: #A30000;
        font-family: Verdana,Arial,Helvetica,sans-serif;
        font-size: 12px;
        padding: .5em .25em;
        text-align: center;
        text-shadow: 1px 0 0 white;
        }

        #chatbox_members {
        display: none;
        }

        div.main-content.chatbox.clearfix {
        border: 1px solid #EAEAEA;
        border-radius: 4px;
        }

        #chatbox p {
        border-bottom: 1px solid #DDD;
        border-top: 1px solid white;
        line-height: 1.2em;
        }

        #chatbox_footer {
          width: 290px;
          min-width: 230px;
          background: #FCFCFC;
          float: right;
          clear:both;
          position: relative;
          border-top: 1px solid gainsboro;
        }

        .right {
        clear: both;
        float: right;
        }

        input#message.post {
        height: 45px;
        width: 240px;
        padding: 6px;
        border: 1px solid #D4D4D4;
        background: #FCFCFC;
        color: #9F9F9F;
        text-shadow: white 0px 1px 0px;
        -webkit-box-shadow: inset rgba(0, 0, 0, 0.1) 0px 1px 3px;
        -moz-box-shadow: inset rgba(0,0,0,0.1) 0px 1px 3px;
        box-shadow: inset rgba(0, 0, 0, 0.1) 0px 1px 3px;
        margin: 20px;
        margin-bottom: 0px;
        }

        #message, #submit_button {
          background: #323232 url('http://lifegames.in/forum/public/style_images/LifeGames_v2_0/highlight_faint.png') repeat-x 0 0;
        border-color: #2B2B2B;
        color: white;
        text-shadow: #2B2B2B 0px -1px 0px;
        -moz-box-shadow: rgba(0,0,0,0.43) 0px 1px 3px;
        -webkit-box-shadow: rgba(0, 0, 0, 0.43) 0px 1px 3px;
        box-shadow: rgba(0, 0, 0, 0.43) 0px 1px 3px;
        -moz-border-radius: 2px;
        padding: 5px;
        -webkit-border-radius: 2px;
        border-radius: 2px;
        display: block;
        margin: 10px;
        margin-top: 0px;
        margin-left: 20px;
        }

        #message, #submit_button:hover {
          opacity: 0.9;
        }

        .fontbutton {
        cursor: pointer;
        float: left;
        margin: 3px;
        padding: 3px;
        margin-right: 10px;
        text-align: left;
        background: #E2E9F0;
        border-color: #DAE2EA;
        color: #464646;
        -moz-box-shadow: inset 0 1px 0 0 #eff3f8, 0px 2px 3px rgba(0,0,0,0.2);
        -webkit-box-shadow: inset 0 1px 0 0 #EFF3F8, 0px 2px 3px rgba(0, 0, 0, 0.2);
        box-shadow: inset 0 1px 0 0 #EFF3F8, 0px 2px 3px rgba(0, 0, 0, 0.2);
        }

        .fontbutton:hover {
          opacity: 0.9;
        }

        #divsmilies img + img{visibility:visible!important}

        #chatbox_messenger_form div.right img{visibility:hidden}

        #simple-wrap {
          background:white;
        }

        #divbold, #divcolor, #divitalic, #divsmilies, #divstrike, #divunderline {
        background-position: center;
        background-repeat: no-repeat;
        }

        #divbold {
        background-image: url(http://cdn2.iconfinder.com/data/icons/oxygen/16x16/actions/format-text-bold.png);
        }

        #divitalic {
        background-image: url(http://cdn2.iconfinder.com/data/icons/oxygen/16x16/actions/format-text-italic.png);
        }

        #divunderline {
        background-image: url(http://cdn2.iconfinder.com/data/icons/oxygen/16x16/actions/format-text-underline.png);
        }

        #divstrike {
        background-image: url(http://cdn1.iconfinder.com/data/icons/bnw/16x16/actions/text_strike.png);
        }

        #divcolor {
        background-image: url(http://illiweb.com/fa/wysiwyg/color_swatch.png);
        }

        #divsmilies {
        background-image: url(http://i26.servimg.com/u/f26/12/56/56/12/emotic10.png);
        }

        #chatbox{
          background: #FBFBFB;
          padding: 8px;
          border: 1px solid #DBE4EF;
          border-bottom: 3px solid #DBE2EC;
          right: 290;
          margin-top: 5px;
          left:0
        }

        .attach {
        float: right;
        }

        div.main-content.chatbox.clearfix {
        border: 0px;
        border-radius: 4px;
        padding: 0px;
        }
Resulta?

Até mais.
avatar

[F]lames
Usuário destaque

Masculino
Inscrito dia : 05/10/2012
Mensagens : 866
Pontos Ativos : 1207

Ver perfil do usuário http://www.bestskins.net/

Resolvido Re: Como deixo meu chatbox desse jeito?

Mensagem por @Evil em 10/03/13, 10:11 am

Olá veja a chatbox la no fórum no final da pagina a caixa de mensagem era pra está embaixo e de acordo com o da chatbox ):
avatar

@Evil
Usuário destaque

Masculino
Inscrito dia : 24/02/2013
Mensagens : 505
Pontos Ativos : 754

Ver perfil do usuário http://coracaodomaker.fantasyboard.net/

Resolvido Re: Como deixo meu chatbox desse jeito?

Mensagem por [F]lames em 10/03/13, 10:57 am

Olá,

Sem retirar o código acima adicione isto:

Código:
#chatbox_footer label {color: transparent!important;}
#chatbox_footer {width: 280px!important;height: 259px!important;}
Resulta ?

Até mais. Piscada
avatar

[F]lames
Usuário destaque

Masculino
Inscrito dia : 05/10/2012
Mensagens : 866
Pontos Ativos : 1207

Ver perfil do usuário http://www.bestskins.net/

Resolvido Re: Como deixo meu chatbox desse jeito?

Mensagem por @Evil em 10/03/13, 03:18 pm

continuo do mesmo jeito :S
avatar

@Evil
Usuário destaque

Masculino
Inscrito dia : 24/02/2013
Mensagens : 505
Pontos Ativos : 754

Ver perfil do usuário http://coracaodomaker.fantasyboard.net/

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