Você não está conectado. Conecte-se ou registre-se

Rank em CSS

Ver o tópico anterior Ver o tópico seguinte Ir em baixo  Mensagem [Página 1 de 1]

1 Rank em CSS em Sex Mar 27, 2015 3:18 pm

d3v4st

avatar
Membro ativo

  • Descrição:
Olá, gostaria de saber como eu faço para colocar os ranks igual ao do fórum todos em CSS. Grato!!!
  • Informações:
Fórum:http://universotecnologico.forumeiros.comVersão:PUNBB
Tipo:Pedido de códigoTags:

Ver perfil do usuário

2 Re: Rank em CSS em Sex Mar 27, 2015 3:42 pm

Cepheus

avatar
Admin





  • Gostou?
     não esqueça de
  • Reputar!



    Ver perfil do usuário

    3 Re: Rank em CSS em Sex Mar 27, 2015 9:58 pm

    d3v4st

    avatar
    Membro ativo

    Amigo não queria com fundo igual ao tuto do grande waghcwb, queria igual ao do Bestskin se for possível.

    Ver perfil do usuário

    4 Re: Rank em CSS em Sab Mar 28, 2015 12:10 pm

    Bruno_Michael

    avatar
    Membro ativo

    Olá veja se está do seu gosto d3v4st




    Adicionar no seu CSS:
    *Lembrando se você adicionar algum css de rank antes retira para não  ocorre um bug e tambem faça o bacukp do seu CSS!


    Este codigo e o efeito que o sr deseja não sei se está do seu gosto , ele tem a função de aplicar o efeito em todo rank como diz o tutorial do waghcwb.Link do Tutorial dele.

    Código:
    .rank {
      -moz-user-select: none;
      -ms-user-select: none;
      -o-user-select: none;
      -webkit-user-select: none;
      background-image: linear-gradient(45deg,rgba(255,255,255,.1)25%,transparent 25%,transparent 50%,rgba(255,255,255,.1)50%,rgba(255,255,255,.1)75%,transparent 75%,transparent);
      background-size: 10px 10px;
      border-radius: 3px;
      box-shadow: inset 0 1px 0 rgba(255,255,255,.5), inset 0 -1px 0 rgba(255,255,255,.5), rgba(0,0,0,.3) 0 1px 1px;
      color: #fff;
      cursor: default;
      font-family: Arial,sans-serif;
      font-size: 12px;
      font-style: normal;
      font-variant: normal;
      font-weight: normal;
      margin: 5px auto;
      padding: 3px;
      text-align: center;
      text-shadow: #000 1px 1px 0;
      user-select: none;
      width: 110px;
    }



    Esse codigo abaixo você adicionará em baixo do outro no CSS , esse tem como função aplicar a cor do rank!



    Código:
    .rank.mod {
      background-color: #1D38CC!important;
    }


    *Como editar ?


    .rank.mod { = Nome do rank que será setado no codigo abaixo. Sempre você deixar o ".rank" mudar so o ".mod" para o nome do rank, ex: ".adm" ".des"!

    background-color: #1D38CC!important; = Cor do rank , você deverá editar so á Cor Hex (#1D38CC).


    Agora você vai em :

    Painel de Controle > Usuários & Grupos > Ranks > Administração dos ranks ,e adionar o rank de acordo com o codigo abaixo.



    Código:
    <div class="rank mod">Moderador</div>

    "rank mod" = Irá mudar só o "rank mod" de acordo com que você colocou no css. Ex o meu foi .rank.mod então vai ser "rank mod".

    Moderador = Nome que você quer que aparecer no rank.






    Espero ter ajudado até mas.

    Ver perfil do usuário

    5 Re: Rank em CSS em Sab Mar 28, 2015 2:06 pm

    d3v4st

    avatar
    Membro ativo

    Vlw Bruno_Michel só estou com dificuldade em Editar se vc puder esclarecer um pouco mais, já que a tempos estou fora da forumeiros. Very Happy

    Coloquei assim no CSS.

    Código:
    .rank {
          -moz-user-select: none;
          -ms-user-select: none;
          -o-user-select: none;
          -webkit-user-select: none;
          background-image: linear-gradient(45deg,rgba(255,255,255,.1)25%,transparent 25%,transparent 50%,rgba(255,255,255,.1)50%,rgba(255,255,255,.1)75%,transparent 75%,transparent);
          background-size: 10px 10px;
          border-radius: 3px;
          box-shadow: inset 0 1px 0 rgba(255,255,255,.5), inset 0 -1px 0 rgba(255,255,255,.5), rgba(0,0,0,.3) 0 1px 1px;
          color: #fff;
          cursor: default;
          font-family: Arial,sans-serif;
          font-size: 12px;
          font-style: normal;
          font-variant: normal;
          font-weight: normal;
          margin: 5px auto;
          padding: 3px;
          text-align: center;
          text-shadow: #000 1px 1px 0;
          user-select: none;
          width: 110px;
        }
        .rank.administrador {
          background-color: #ff0000!important;
        }
        .rank.membro {
          background-color: #1D38CC!important;
        }

    Mais só aparece a cor no Membro no administrador fica apenas branco.

    Ver perfil do usuário

    6 Re: Rank em CSS em Sab Mar 28, 2015 4:19 pm

    Bruno_Michael

    avatar
    Membro ativo

    Então essa parte aqui e do efeito que você pediu :

    Código:
    .rank {
          -moz-user-select: none;
          -ms-user-select: none;
          -o-user-select: none;
          -webkit-user-select: none;
          background-image: linear-gradient(45deg,rgba(255,255,255,.1)25%,transparent 25%,transparent 50%,rgba(255,255,255,.1)50%,rgba(255,255,255,.1)75%,transparent 75%,transparent);
          background-size: 10px 10px;
          border-radius: 3px;
          box-shadow: inset 0 1px 0 rgba(255,255,255,.5), inset 0 -1px 0 rgba(255,255,255,.5), rgba(0,0,0,.3) 0 1px 1px;
          color: #fff;
          cursor: default;
          font-family: Arial,sans-serif;
          font-size: 12px;
          font-style: normal;
          font-variant: normal;
          font-weight: normal;
          margin: 5px auto;
          padding: 3px;
          text-align: center;
          text-shadow: #000 1px 1px 0;
          user-select: none;
          width: 110px;
        }


    **IMPORTANTE : Eu esqueci de cita que quando você bota um cor exata igual do nick o rank não aparecer o efeito , então colocar a mesma cor porem mas forte so um pouco.


    Em questão dos ranks branco pelo teste que fiz aqui e por causa do nome do rank : Ex

    O seu ta assim : 
    .rank.administrador

    .rank.membro



    Para evitar esses bugs coloque so as iniciais da palavra :
    .rank.adm 
    .rank.mbr


    Teste agora para ver se tenha resultados .

    Ver perfil do usuário

    7 Re: Rank em CSS em Sab Mar 28, 2015 5:42 pm

    d3v4st

    avatar
    Membro ativo

    Resolvido, pode fechar ^^

    Ver perfil do usuário

    8 Re: Rank em CSS em Sab Mar 28, 2015 9:36 pm

    Noumi

    avatar
    Membro ativo

    tem como oferecer prints dessa CCS de rank ?



    Ver perfil do usuário http://www.cdzmaximumpower.forumsrpg.com

    Conteúdo patrocinado


    Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo  Mensagem [Página 1 de 1]

    Permissão deste fórum:
    Você não pode responder aos tópicos neste fórum