Staffer Group BR™

Fórum interativo totalmente gratuito!

/* Widget *//* Resposta rápida bloqueada */
Cadastre-se
→ Crie a sua conta

 VisualizaçõesPermissão deste fórum:
Você não pode responder aos tópicos neste fórum


CurtirDiretório deste fórum:
Fóruns » Principal »  » Tutoriais » Tutoriais sobre programação

Ir à página : Anterior  1, 2

#1
 D'Leandro™

avatar
Fundador
Relembrando a primeira mensagem :


ChatBox Personalizado


PunBB PhpBB2  PhpBB3  Invision

--> Código CSS <--
Obs: Para que funcione, o Chat Box Original deve estar ativo.
Código:
      /*ChatBox Personalizado por D'Leandro™️*/
#message, #submit_button {
        border: none;
        border-top-style: none !important;
        background: #fff;
}
#chatbox_footer {
        padding: 0px;
        background: url("") repeat scroll 0% 0% rgb(245, 245, 245);
        border-top: 2px solid #1E90FF;
        display: block !important;
        border-radius: 0px 0px 0px 0px;
        top: 270px;
        left: 0px;
        right: 0px;
}
#submit_button {
        color: #1E90FF;
        border: 1px solid #ddd;
        margin: 2px;
        padding: 2px;
}
.fontbutton_selected {
        border: none;
        background: #1E90FF;
        float: left;
        margin-right: 3px;
        padding: 1px;
        border-radius: 3px;
}
.fontbutton:hover {
        border: none;
        background: none;
        float: left;
        margin-right: 3px;
        padding: 1px;
        border-radius: 3px;
}
.fontbutton {
        background: none;
        float: left;
        margin-right: 3px;
        padding: 1px;
        border-radius: 3px;
}
#chatbox_footer label {
        background: none repeat scroll 0% 0% rgb(255, 255, 255);
        border-width: 2px;
        border-right: 2px solid rgb(221, 221, 221);
        border-style: dashed solid solid;
        border-color: rgb(221, 221, 221);
       -moz-border-top-colors: none;
       -moz-border-right-colors: none;
       -moz-border-bottom-colors: none;
       -moz-border-left-colors: none;
        border-image: none;
        border-radius: 6px 6px 6px 6px;
        font-size: 11px;
        margin: 0px;
        padding: 3px;
        border-top: 1px;
}
#cp-main .panel {
        background: none repeat scroll 0% 0% rgb(255, 255, 255);
        border-width: 2px;
        border-right: 2px solid rgb(221, 221, 221);
        border-style: dashed solid solid;
        border-color: rgb(221, 221, 221);
       -moz-border-top-colors: none;
       -moz-border-right-colors: none;
       -moz-border-bottom-colors: none;
       -moz-border-left-colors: none;
        border-image: none;
        border-radius: 6px 6px 6px 6px;
        font-size: 11px;
        margin: 0px;
        padding: 3px;
}
#chatbox_main_options span,#chatbox_main_options label,#chatbox_main_options a{
        height:34px;
        margin-right:0;
        border:0;
        border-right:1px solid #CFCFCF;
        background-color:#f5f5f5;
        padding:7px;color:#000;
        padding-top:14px}#chatbox_main_options{
        position:absolute;
        bottom:0;
        left:0;
        z-index:1;
        color:#818181!important;
        height:34px;
        font-size:0;
        margin:0;
        margin-bottom:-25px
}
#chatbox_main_options li a[onclick*="ajax_refresh_chatbox"]{
        background: none;
}
#chatbox_main_options a[href="/chatbox/index.forum?archives=1"],#chatbox_main_options a[href="/chives"]{
        font-size:0;
        background:url(http://www.dreamtemplate.com/dreamcodes/web_icons/gray-archive-icon.png) no-repeat center whiteSmoke;
        padding-top:25px;
        padding-bottom:9px;
        padding-right:31px;
        border-top:1px solid #CFCFCF;
        cursor:default
}
#chatbox_main_options a[href="/chatbox/index.forum?archives"]{
        background-color:#E6E6E6
}
#chatbox_main_options li a[onclick="CB_disconnect();"]{
        border-right:0;
        padding:0
}
#chatbox_main_options li a[onclick="CB_disconnect();"] span{
        font-size:0;
        background:url(http://i.imgur.com/xXA8w.gif) no-repeat 50% 50% #f5f5f5;
        padding-top:25px;
        padding-bottom:9px;
        padding-right:31px;
        border-top:1px solid #CFCFCF;
        cursor:default
}
#chatbox_messenger_form .right {
       padding:0;font-size:0
}
#chatbox_messenger_form .right input#message{
        height:34px;
        font-weight:normal;
        background-color:white;
        background-image:url();
        border:0;height:34px;
        margin-bottom:0;font-size:16px;cursor:default;padding:0 0 0 5px;outline:none;width:304px
}
#chatbox_messenger_form .right input[name="submit_button"]{
        height:33px;
        font-size:15px;
        border:0;
        background-color:transparent;
        padding-left:10px;
        padding-right:11px;
        margin-left:-4px;
        cursor:default;
        font-weight:normal
}
#chatbox_messenger_form .right img[src="http://illiweb.com/fa/subsilver/wysiwyg/menupop.gif"],#chatbox_members h4.member-title,#chatbox_main_options li#chatbox_option_autorefresh,#chatbox p.clearfix span.date-and-time,#chatbox p.clearfix:hover span.date-and-time{
        display:none
}
#chatbox_header{
        height:0;
        font-size:0
}
#chatbox{
        top:32px;
        left:0
}
#chatbox p.clearfix:first-child{
        padding-top:8px;
        border-radius: 6px;
        background: rgb(245, 245, 245);
}
#chatbox_members{
        margin-top: -30px;
        border: 0px solid #1E90FF;
        position:absolute;
        z-index:1;
        height:29px;
        width:1100px;
        background:url(http://www.addthis.com/forum/styles/addthis2/theme/images/whosonline.gif) 8px -3px no-repeat white;
        border-bottom:1px solid #CFCFCF
}
#chatbox_members li{
        display:inline;
        margin-right:0
}
#chatbox_members a:last-child:after{
        content:', '
}
#chatbox_members li:last-child a:last-child:after{
content:'.'
}
#chatbox_members ul{
        padding-top:8px;
        font-size:12px;
        margin:0;
        overflow-y:auto;
        overflow-x:auto;
        margin-left:46px;
        padding-right:8px;
        padding-bottom:0;
        white-space:nowrap;
        height:23px;
        max-width:none
}
#chatbox_footer #chatbox_messenger_form .right ,#chatbox_header #chatbox_main_options.chatbox-options a:hover,#chatbox_header #chatbox_main_options.chatbox-options span:hover,#chatbox_messenger_form .right input[name="submit_button"]:hover{
        background-color:#CFCFCF!important
}
#chatbox_footer #chatbox_messenger_form .right {
        background-color:#E6E6E6
}
#chatbox p.clearfix {
        background-color: #DDD;
        margin: 2px;
        padding: 2px;
        border-radius: 6px;
}
#chatbox p.clearfix span.user,#chatbox p.clearfix .msg,#chatbox_main_options li{
        font-size:0
}
#chatbox p.clearfix .msg,#chatbox p.clearfix span.user *{
        font-family:Verdana;
        font-size:12px
}
.user a[href*="/u"]{
        margin-right:8px
}
.user span:first-child strong{
        margin-right:4px
}
.user span:last-child strong{
        margin-right:0
}
a[onclick*="ajax_refresh_chatbox"]:hover{
        background: none;
}
#chatbox p.clearfix[class^="chatbox_row_1"] span[style="font-style:italic"]{
        font-size:15px;
        font-style:normal!important;
        margin-left:-66px;
        background-color:#EDEFF4
}
#chatbox p.chatbox_row_1.clearfix:first-child span[style="font-style:italic"]:last-child{
        font-size:0px
}
#chatbox p.chatbox_row_1.clearfix:first-child span[title]:first-child{
        visibility:hidden
}
#chatbox p.chatbox_row_1.clearfix:first-child span[style="font-style:italic"]:last-child:before{
        margin-left:7px;
        background:url(http://i.imgur.com/xXA8w.gif) top left no-repeat;
        background-size:20px;
        padding-left:22px;
        content:'Entre para conversar!';
        font-size:15px
}
#chatbox_contextmenu{
        z-index:1
}
#chatbox_messenger_form{
        margin-top:0px
}
.user-msg{
        display:inline-block;
        padding-left:38px;
        background:url(http://i.imgur.com/BMdww.gif) no-repeat top left;
        background-size:32px 32px;
        min-height:32px
}
.user-msg .msg{
        display:block
}
.user-msg .msg span{
        border-image-width:0px;
        border:0px;
        border-image-source:url(http://i.imgur.com/BMdww.gif)
}/*http://staffergroupbr.stuning.net/t1075-tutorialchatbox-personalizado*/

--> Resultado Final <--



Desenvolvido por Luciano98 | D'Leandro™
Editado e Postado por 2012 © Staffer Group BR™
Ver perfil do usuário

#26
 Master Publicitario

avatar
Membro
Muito bom!
Ver perfil do usuário

#27
 heitorsimonetti

avatar
Membro
obrigadooooo
Ver perfil do usuário

#28
 Conteúdo patrocinado


Ir à página : Anterior  1, 2