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 » Arquivos » Lixeira

#1
 sapinhu

avatar
Membro
Descrição da Questão:
http://staffergroupbr.stuning.net/t1017-tutorial-perfil-arriba-del-post#5595

Segui o tutorial e funcionou quase perfeitamente, gostaria que o perfil ficasse como o daqui, pois o meu está comendo o texto do tópico

Endereço e Versão do Site/Fórum:
http://academianinja2.forumeiros.com/ ( PunBB )

Imagem Sugestiva:
http://imagens.academianinjakonoha.com/images/semttuooo.png
Ver perfil do usuário prof_roy@hotmail.com

#2
 Gmtp

avatar
Membro
Olá,

Já sei qual é o problema, Poderia me mandar sua folha de estilo css ?

Até mais.
Ver perfil do usuário

#3
 sapinhu

avatar
Membro
Segue

Spoiler:
Código:
/* códigos retirados de http://staffergroupbr.stuning.net*/
/** resposta retrail**/
#quick_reply {
display: none;
}
/*Informações Pessoais em Linha Horizontal*/
ul.profile_field_list li {exibição :em linha - bloco; display: block; display:inline-block !important;
}
/*---/ Caixa de Cores /---*/
        .colorpicker {
                          width: 356px;
                          height: 176px;
                          overflow: hidden;
                          position: absolute;
                          background: url(http://i46.servimg.com/u/f46/16/56/73/62/colorp11.png);
                          font-family: Arial, Helvetica, sans-serif;
                          display: none;
                        }
                        .colorpicker_color {
                          width: 150px;
                          height: 150px;
                          left: 14px;
                          top: 13px;
                          position: absolute;
                          background: #f00;
                          overflow: hidden;
                          cursor: crosshair;
                        }
                        .colorpicker_color div {
                          position: absolute;
                          top: 0;
                          left: 0;
                          width: 150px;
                          height: 150px;
                          background: url(http://i46.servimg.com/u/f46/16/56/73/62/colorp12.png);
                        }
                        .colorpicker_color div div {
                          position: absolute;
                          top: 0;
                          left: 0;
                          width: 11px;
                          height: 11px;
                          overflow: hidden;
                          background: url(http://i46.servimg.com/u/f46/16/56/73/62/select10.gif);
                          margin: -5px 0 0 -5px;
                        }
                        .colorpicker_hue {
                          position: absolute;
                          top: 13px;
                          left: 171px;
                          width: 35px;
                          height: 150px;
                          cursor: n-resize;
                        }
                        .colorpicker_hue div {
                          position: absolute;
                          width: 35px;
                          height: 9px;
                          overflow: hidden;
                          background: url(http://i46.servimg.com/u/f46/16/56/73/62/colorp10.gif) left top;
                          margin: -4px 0 0 0;
                          left: 0px;
                        }
                        .colorpicker_new_color {
                          position: absolute;
                          width: 60px;
                          height: 30px;
                          left: 213px;
                          top: 13px;
                          background: #f00;
                        }
                        .colorpicker_current_color {
                          position: absolute;
                          width: 60px;
                          height: 30px;
                          left: 283px;
                          top: 13px;
                          background: #f00;
                        }
                        .colorpicker input {
                          background-color: transparent;
                          border: 1px solid transparent;
                          position: absolute;
                          font-size: 10px;
                          font-family: Arial, Helvetica, sans-serif;
                          color: #898989;
                          top: 4px;
                          right: 11px;
                          text-align: right;
                          margin: 0;
                          padding: 0;
                          height: 11px;
                        }
                        .colorpicker_hex {
                          position: absolute;
                          width: 72px;
                          height: 22px;
                          background: url(http://i46.servimg.com/u/f46/16/56/73/62/colorp13.png) top;
                          left: 212px;
                          top: 142px;
                        }
                        .colorpicker_hex input {
                          right: 6px;
                        }
                        .colorpicker_field {
                          height: 22px;
                          width: 62px;
                          background-position: top;
                          position: absolute;
                        }
                        .colorpicker_field span {
                          position: absolute;
                          width: 12px;
                          height: 22px;
                          overflow: hidden;
                          top: 0;
                          right: 0;
                          cursor: n-resize;
                        }
                        .colorpicker_rgb_r {
                          background-image: url(http://i46.servimg.com/u/f46/16/56/73/62/colorp14.png);
                          top: 52px;
                          left: 212px;
                        }
                        .colorpicker_rgb_g {
                          background-image: url(http://i46.servimg.com/u/f46/16/56/73/62/colorp15.png);
                          top: 82px;
                          left: 212px;
                        }
                        .colorpicker_rgb_b {
                          background-image: url(http://i46.servimg.com/u/f46/16/56/73/62/colorp16.png);
                          top: 112px;
                          left: 212px;
                        }
                        .colorpicker_hsb_h {
                          background-image: url(http://i46.servimg.com/u/f46/16/56/73/62/colorp17.png);
                          top: 52px;
                          left: 282px;
                        }
                        .colorpicker_hsb_s {
                          background-image: url(http://i46.servimg.com/u/f46/16/56/73/62/colorp18.png);
                          top: 82px;
                          left: 282px;
                        }
                        .colorpicker_hsb_b {
                          background-image: url(http://i46.servimg.com/u/f46/16/56/73/62/colorp19.png);
                          top: 112px;
                          left: 282px;
                        }
                        .colorpicker_submit {
                          position: absolute;
                          width: 22px;
                          height: 22px;
                          background: url(http://i46.servimg.com/u/f46/16/56/73/62/aceita10.png) top;
                          left: 322px;
                          top: 142px;
                          overflow: hidden;
                        }
                        .colorpicker_focus {
                          background-position: center;
                        }
                        .colorpicker_hex.colorpicker_focus {
                          background-position: bottom;
                        }
                        .colorpicker_submit.colorpicker_focus {
                          background-position: bottom;
                        }
                        .colorpicker_slider {
                          background-position: bottom;
                        }
/** Barra de Navegação Personalizada **/
#pun-head #pun-navlinks {
background-color: #333;
border-color: #CCC;
padding: .5em 1.1em .6em;
}
#pun-navlinks {
background-image: -moz-linear-gradient(#313029, #58564A 10%, #313029);
background-image: -webkit-gradient(linear, 0% 0%, 0% 10% 100%, from(#313029), to(#58564A), to(#313029));
background-image: -webkit-linear-gradient(#313029, #58564A 10%, #313029);
background-image: -o-linear-gradient(#313029, #58564A 10%, #313029);
}
#pun-navlinks {
border-top: 5px solid #21C8FF!important;
height: 43px;
overflow: visible!important;
padding: 1px 10px!important;
}
#pun-navlinks li:hover {
-webkit-transition: all .2s linear;
background: url(http://i42.servimg.com/u/f42/17/32/13/00/menu-s14.png) no-repeat 40% top;
}
#pun-navlinks ul[class="clearfix"] {
border: 0!important;
padding-top: 4px;
width: 90%;
}
#pun-navlinks a, #pun-navlinks a:visited {
text-decoration: none;
}
#pun-navlinks li a {
color: #EDEDED;
font-family: Trebuchet MS,"Lucida Grande",Verdana,Helvetica,Arial,sans-serif;
font-size: 12px;
font-weight: 700;
margin: 0;
}
#pun-navlinks li a {
background: url(http://i42.servimg.com/u/f42/17/32/13/00/nav-di10.png) repeat-y center right;
color: white;
font-family: Arial,Helvetica,sans-serif!important;
font-size: 14px!important;
font-weight: 700;
margin: 0!important;
padding: 14px 7px 14px 0;
text-decoration: none!important;
}
#pun-navlinks li {
-moz-transition: all .2s linear;
-o-transition: all .2s linear;
-webkit-transition: all .2s linear;
background: url(http://i42.servimg.com/u/f42/17/32/13/00/menu-s14.png) no-repeat 40% -10px;
padding-top: 14px;
position: relative;
transition: all .2s linear;
}
#pun-navlinks li {
display: inline;
font-size: 1.15em;
}
/*tópico*/
.userinfo { 
border: 1px solid #E7E7E7;
border-bottom: 1px solid #D9E2EC;
background: #0d0101;
text-shadow: white 0px 1px 0px;
float: none;
width: auto;
text-align: left;
position: relative;
padding-left: 11px;
padding-right: 11px;
padding-top: 11px;
height: 115px;
}

.user-avatar a img {
border-radius: 600px !important;
float: left;
max-height: 94px;
max-width: 94px;
height: 94px!important;
width: 94px!important;
margin-right: 10px;
padding: 1px;
border: 1px solid #D5D5D5;
background: white;
-webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1);
-moz-box-shadow: 0px 2px 2px rgba(0,0,0,0.1);
box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1);
}
.username {
padding-left: 4px;
margin-left: 4px;
}

.post-options img:hover {
opacity: 0.8;
}

.posting img:hover {
opacity: 0.9;
}

.pun .postmain {
background-color: #080808;
border-left: 0px;
margin-left: 0em;
}

.perfilsright {
float: right;
}

.pun .post-entry {
font-size: 14px;
line-height: 1.5em;
text-align: justify;
color: #444;
}
.pun .post-entry {
padding: 1em 1em 0;
}


/*--- Estatística estilo IPB por Premotheus ---*/

#estadisticas{
  background: #0f0e0f;
  border:1px solid #0f0e0f;
  padding-top: 0px;
  padding-bottom: 0px;
  padding-right: 8px;
  padding-left: 8px;
  border-radius:7px;
}

#Legend {
  border-top: 1px solid #EAEAEA;
  padding-top:10px;
  font-size: 1.1em;
  font-weight: bold;
  clear:both;
  font-weight:700;
  padding-bottom:5px
}


.main .main-content.frm {
background: #0f0e0f;
padding: 10px;
}

#quick_reply, .main .main-content.frm {
background-color: #0f0e0f;
}
.main-content.frm{background-color:#0a010a}.main .main-content.google{background-color:#140314;padding:10px 10px 0}
.pun .main-content {
background: white;
}

.pun .main-content {
webkit-border-top-left-radius: 1px;
border-radius: 1px;
-moz-border-radius-topleft: 1px;
-moz-border-radius-topright: 1px;
border-radius: 1px;
background-color: #0a010a;
border: 1px solid #080008;
}

#onlinelist {
border-top: 0px transparent;
padding: 0.6em 1em;
}

#board-stats span{
  background-color:transparent;
  color:#4A4A4A;
  font-weight:700;
  padding:2px 6px
}

#board-stats{
  background:#0f0e0f;
  border-left: 1px solid #eaeaea;
  border-left-color-ltr-source:physical;
  border-left-color-rtl-source:physical;
  border-left-color-value:#DEDEDE;
  border-left-style-ltr-source:physical;
  border-left-style-rtl-source:physical;
  border-left-style-value:solid;
  border-left-width-ltr-source:physical;
  border-left-width-rtl-source:physical;
  border-left-width-value:0;
  float:right;padding-left:20px;
  margin-top:-7px;
  width:38%
}

#board-stats dl{margin-top:10px}#board-stats dd,#board-stats dt{
  border-top-color:#DEDEDE;
  border-top-style:solid;
  border-top-width:1px;
  float:left;
  font-size:.85em;padding:6px 2px;
  width:45%}

#board-stats dt{
  color: #595959;
  font: normal 10px tahoma, arial, verdana, sans-serif;
  clear:both;
  font-weight:700
}

#board-stats h2{
  padding-top:10px;
  font-size: 1.1em;
  font-weight: bold;
  clear:both;
  font-weight:700
}



.maintitle {
background: #F8F8F8 url(http://www.ggames.com.br/forum/public/style_images/baisik/gradient_bg.png) repeat-x left 50%;
color: #B4453B;
text-shadow: white 0px 1px 0px;
font-size: 14px;
line-height: 20px;
font-weight: bold;
border-radius: 5px 5px 0 0;
-moz-border-radius: 5px 5px 0 0;
-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
padding: 11px !important;
margin: 0 !important;
overflow: hidden;
border-bottom: 1px solid #EAEAEA;
}

h3.maintitle{
color: #B4453B;
text-shadow: white 0px 1px 0px;
line-height: 20px;
font-weight: bold;
display: block;
font-size: 1.17em;
-webkit-margin-before: 1em;
-webkit-margin-after: 1em;
-webkit-margin-start: 0px;
-webkit-margin-end: 0px;
font-weight: bold;
}

/*--- Fim ---*/
/* Efeito black in white */
img {
-webkit-filter: grayscale(0);
display: inline-block;
-webkit-transition: all 0.7s ease-in-out;
-moz-transition: all 0.7s ease-in-out;
-o-transition: all 0.7s ease-in-out;
-ms-transition: all 0.7s ease-in-out;
transition: all 0.7s ease-in-out;
}img:hover {
-webkit-filter: grayscale(1);
}
.module {
text-align: center;
}
.statused .hierarchy {
    position: relative;
    left: 50%;
    }
.main .main-head .page-title {
  font-size: 12px;
  font-weight: bold;
  text-align: center;
  }
.main .main-head {
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
border: 1px solid #000000;
}
/*** pesquisa ***/
#pesquisaButton:hover{background: rgba(50, 50, 50, 0.9);}
#pesquisaButton{padding: 5px;cursor:pointer;padding-left: 9px;border: 1px solid black;background: rgba(50, 50, 50, 0.7);padding-right: 9px;font-weight: 800;}
#pesquisaCaixa{height: 30px;background: rgba(50, 50, 50, 0.2);color: black;border-top:0px;
border-right:0px;border-bottom:0px;border-left: 2px solid black;font-weight: 800;font: arial;
width:300px;}
#formPesq{max-width:400px;padding:14px;margin-top:7px;border: 2px solid darkblue;border-bottom-left-radius: 8px;border-bottom-right-radius: 8px;background: #218AE0;}
#pesqButton:hover{color:black;}
#pesqButton{padding: 9px;border-top: 2px solid darkblue;border-left: 2px solid darkblue;
border-right: 2px solid darkblue;color: #fafafa;font-weight:bold;font: verdana;cursor:pointer;
border-top-left-radius: 8px;border-top-right-radius: 8px;background: #218AE0;}
/** navegação **/
.pun-crumbs {
-moz-border-radius: 3px;
-moz-box-shadow: inset rgba(0,0,0,0.1) 0 1px 3px;
-webkit-border-radius: 3px;
-webkit-box-shadow: inset rgba(0, 0, 0, 0.1) 0 1px 3px;
background: #0a010a;
border: 1px solid #D9D9D9;
border-radius: 3px;
box-shadow: inset rgba(0, 0, 0, 0.1) 0 1px 3px;
margin-top: 10px;
}
p.crumbs {
color: #F3F3F3;
}
.pun-crumbs p {
color: #666;
font-size: 1.11em;
line-height: 1.5;
margin: 0;
}
p.crumbs a {
background: url(http://i42.servimg.com/u/f42/17/32/13/00/second10.png) no-repeat 100% -1px;
color: #777!important;
font-size: 10px;
line-height: 30px;
padding: 11px 17px 11px 4px;
}
/** code **/

.codebox {
background: url('http://i32.servimg.com/u/f32/14/52/65/41/page_c10.png') no-repeat 6px #D7F8AC;
border: 2px solid#35A002;
padding: 0px;
border-radius: 0px 50px 0px 50px;
}
.codebox:hover {
    background: url('http://i32.servimg.com/u/f32/14/52/65/41/page_c10.png') no-repeat 6px #AAF886;
    box-shadow: 0px 0px 10px green;
-moz-transition: all .1s linear;
-o-transition: all .1s linear;
-webkit-transition: all .1s linear;
}
.codebox dd {
border: 2px dotted #229605;
border-radius: 20px;
margin: 1.5em;
padding: 0.5em;
background-color: rgba(228, 255, 228, 0.83);
margin-left: 45px;
}
.codebox dt {
border: none;
font-weight: bold;
color: green;
font-family: Arial;
font-size: 13px;
padding-left: 11px;
padding-top: 7px;
}
.codebox dt:before {
content: "Você está Visualizando um ";
}
/** Spoiler**/

.codebox.spoiler  {
padding: 0px;
border-radius: 0px 50px 0px 50px;
background: url('http://cdn2.iconfinder.com/data/icons/scrap/Folder%20Closed%20Silver.png') no-repeat 8px #F8EF86;
background-size: 31px;
box-shadow: 0px 0px 10px #ABB300;
border: 2px solid #B4B402;
}
.codebox.spoiler:hover {
background: url('http://cdn2.iconfinder.com/data/icons/scrap/Folder%20Closed%20Silver.png') no-repeat 8px #F8EF86;
box-shadow: 0px 0px 20px #C1D108;
-moz-transition: all .1s linear;
-o-transition: all .1s linear;
-webkit-transition: all .1s linear;
background-size: 41px;
}
.codebox.spoiler dd {
border-radius: 20px;
margin: 1.5em;
padding: 0.5em;
margin-left: 45px;
border: 3px dotted #B6B600;
    background-color: rgba(252, 255, 228, 0.84);
}
.codebox.spoiler dt {
border: none;
font-weight: bold;
font-family: Arial;
font-size: 13px;
padding-left: 11px;
padding-top: 7px;
color: rgb(170, 170, 2);
    text-shadow: 1px 1px 3px rgb(255, 255, 150);
}
.codebox dt:before {
content: "Você está Visualizando um ";
}
.spoiler_content.hidden {
display: none;
}
.spoiler:hover .spoiler_content {
    display:block;
}
/**opçoes em hover**/
.post:hover .post-options {
-moz-transition: all .2s linear;
-o-transition: all .2s linear;
-webkit-transition: all .2s linear;
opacity: .5;
}
.post .post-options:hover {
-moz-transition: all .2s linear;
-o-transition: all .2s linear;
-webkit-transition: all .2s linear;
opacity: 1!important;
}
.post .post-options {
-moz-transition: all .2s linear;
-o-transition: all .2s linear;
-webkit-transition: all .2s linear;
opacity: 0;
}
a:hover {
text-transform: uppercase;
}
#userlinks ul li a {
display: none !important;
}
.avatartge img {
    height: 150px !important;
    margin: -143px 5px 12px !important;
    width: 150px !important;
}
/* Link externo em pop-up - Por HenRyqUéè */
 #framelink{background:#adadad;width: 86%;right:15%;height:500px !important;}
 #locs2{margin-top:3%;}
 #locs{top:0%;position: fixed;z-index: 999;width: 100%;height: 1000px;background: rgba(50, 50, 50, 0.90);}
 #fecha{color:black;font-weight:bold;cursor:pointer;padding:7px;}
/*memberliste/*/
.Sname a{background-color:#FFF;border:1px solid #DDD;margin:2px;padding:1px 5px}
.Sname a:hover,.Sname a:active{background-color:#2F98D9;color:#FFF}
.Sname{text-align:right}
.rutgonML img{background-color:#000;border:3px double;border-radius:7px 7px 7px 7px;height:75px;width:72%;margin:10px}
.rutgonML{float:left;width:10%}
.rutgonML p{background-color:#C2BFBF;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin:0 2px;padding:2px 5px}
.rutgonML:hover{box-shadow:0 0 10px 5px #000}

/*Sombra estrutura*/
.pun {
-moz-box-shadow: 0px 20px 20px #CCCCCC;
-webkit-box-shadow: 0px 20px 20px #CCCCCC;
}
Ver perfil do usuário prof_roy@hotmail.com

#4
 Gmtp

avatar
Membro
Olá,

Pensei que havia um código no css dando interferência desculpa, Mais o único código que eu sei que da erros é o de múltiplas cores.

PS: Quando eu digo que um dos códigos css dava interferência digo tipo 2 códigos que meche no perfil;

Até mais.
Ver perfil do usuário

#5
 D'Leandro™

avatar
Fundador
Olá!

Este tipo de perfil prescisa ser muito bem usado para que fique bonito.
Ele vem ganhando popularidade, mas se voce usa muitos campos de perfil, ele fica feio.

Em relação ao design, se voce deichar igual ao do SGBR™ não irá combinar, já que seu fórum é de cor escura.
Aconcelho que peça um modelo que combine com seu fórum.

Decida oque quer fazer e poste aqui para que eu possa lhe ajudar.

Até mais.
Ver perfil do usuário

#6
 sapinhu

avatar
Membro
Em suma, aqueles são os campos que ficarão fixo, preenchi todos que iriao aparecer, o que eu queria ao me referir "com esse daqui" seria colocar em ordem como o daqui

1 avatar com nome em baixo
2 - rank e grupo
3 - perfil
4 dados rpg e enviar mp apenas
Ver perfil do usuário prof_roy@hotmail.com

#7
 D'Leandro™

avatar
Fundador
Olá!

Venho tentando organizar este perfil a muito tempo, até hj não consegui fazer isto.
Para organizar, voce deve saber usar as opções dos perfis na hora de preenche-los.
A organização que tem aqui é original, acredito que possa editar na versão PunBB, mas não sei como.

Até mais.
Ver perfil do usuário

#8
 sapinhu

avatar
Membro
aqui é phpbb3?
Ver perfil do usuário prof_roy@hotmail.com

#9
 D'Leandro™

avatar
Fundador
Olá!

Sim, Este fórum é versão PhpBB3

Até mais.
Ver perfil do usuário

#10
 sapinhu

avatar
Membro
Não será possível suporte?
Ver perfil do usuário prof_roy@hotmail.com

#11
 D'Leandro™

avatar
Fundador
Ola!

Amigo caso queira suporte abra um topico na area correta de suporte!
http://staffergroupbr.stuning.net/h23-

Ate mais.
Ver perfil do usuário

#12
 Conteúdo patrocinado