JScript

Programação & Desenvolvimento


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

Sugestão - Novos icones

2 participantes

Ir para baixo  Mensagem [Página 1 de 1]

1Sugestão - Novos icones Empty Sugestão - Novos icones Dom 02 Fev 2014, 11:04 pm

waghcwb

waghcwb
Desenvolvedores
Desenvolvedores

Venho sugerir através deste tópico a inserção de novos ícones para o fórum, segue a lista abaixo:
Ícons das MP's
Sugestão - Novos icones Ud38mlp

Sugiro estes mais discretos e elegantes...
Sugestão - Novos icones R2g92j4
Sugestão - Novos icones IkGjfKL
Sugestão - Novos icones N13lbOj
Sugestão - Novos icones Au4Do4v

Em breve faço uma nova sugestão com novos ícones, não estou encontrando eles aqui em meu computador...

http://wagneraugusto.com.br/

2Sugestão - Novos icones Empty Re: Sugestão - Novos icones Dom 02 Fev 2014, 11:55 pm

JScript

JScript
Administradores
Administradores

Perfeito, pode continuar com a sugestão e inclusive aquela que deu sobre os botões em CSS!

JS

http://autoitbrasil.com

3Sugestão - Novos icones Empty Re: Sugestão - Novos icones Seg 03 Fev 2014, 9:18 am

waghcwb

waghcwb
Desenvolvedores
Desenvolvedores

Botões de edição das mensagens em CSS, basta adicionar os botões que faltam..
http://jsfiddle.net/Wagner/kC24x/1/embedded/result/

http://wagneraugusto.com.br/

4Sugestão - Novos icones Empty Re: Sugestão - Novos icones Sex 21 Fev 2014, 5:49 pm

waghcwb

waghcwb
Desenvolvedores
Desenvolvedores

Main title só com CSS
http://jsfiddle.net/Wagner/4ELLr/embedded/result

(Avise se não puder fazer mais postagens abaixo sem respostas..)

http://wagneraugusto.com.br/

5Sugestão - Novos icones Empty Re: Sugestão - Novos icones Sex 21 Fev 2014, 6:51 pm

JScript

JScript
Administradores
Administradores

Ícones da MP:
Veja como irão ficar no meu projeto final:

Sugestão - Novos icones EOU4HG4

[quote=Wagner]Main title só com CSS[/quote]
Já está adicionado!!!

[quote=Wagner]Avise se não puder fazer mais postagens abaixo sem respostas..[/quote]
Tá louco?! Continue amigo, você é fera no CSS!!!


Conseguiria com esses:
Código:

#branding {
   background: #0F3854 url(http://i78.servimg.com/u/f78/18/17/62/92/brandi10.png) repeat-x;
   border-bottom: 1px solid #1B3759;
   min-height: 64px;
}

.ipsButton_secondary.important {
   background: url("http://i34.servimg.com/u/f34/18/17/62/92/captur24.png") repeat-x scroll center top #9F2A00 !important;
   border: 1px solid #812200;
   box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4) inset, 0 1px 0 rgba(0, 0, 0, 0.3);
   color: #FBF4F4 !important;
}

.postmain cite, cite, .codebox.spoiler dt {
   background: url("http://i34.servimg.com/u/f34/18/17/62/92/captur13.png") repeat-x scroll 0 0 #F2F2F2;
    border-radius: 5px 5px 0 0;
    font-size: 12px;
    font-weight: 700;
    overflow-x: auto;
    margin-left: -10px;
    margin-right: -10px;
    margin-top: -10px;
    padding-right: 10px;
   padding: 8px 10px;
}

.input_submit {
  background: url("http://i78.servimg.com/u/f78/18/17/62/92/topic_12.png") repeat-x scroll center top #212121;
  border-color: #212121;
  border-radius: 3px 3px 3px 3px;
  border-style: solid;
  border-width: 1px;
  box-shadow: 0 1px 0 0 #5C5C5C inset, 0 2px 3px rgba(0, 0, 0, 0.2);
  color: #FFFFFF;
  cursor: pointer;
  padding: 4px 10px;
  text-decoration: none;
}

.ipsButton_secondary {
    /*background: -moz-linear-gradient(center top , #F6F6F6 0%, #E5E5E5 100%) repeat scroll 0 0 transparent;*/
   /*background: url("http://i74.servimg.com/u/f74/18/08/53/97/highli11.png") repeat-x scroll 0 0 #ECECEC;*/
   background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAASCAYAAACaV7S8AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAACxJREFUeNpi+v///24mBgaGTSDiF4j4AWd9h7N+YiF+wFlgJb/hLDDxByDAANyoFCbp1yqEAAAAAElFTkSuQmCC")
      repeat-x scroll 0 0 #ECECEC;
    border: 1px solid #DBDBDB;
    border-radius: 3px 3px 3px 3px;
    box-shadow: 0 1px 0 #FFFFFF inset, 0 1px 0 rgba(0, 0, 0, 0.3);
    color: #616161;
    display: inline-block;
    font-size: 12px;
    height: 22px;
    line-height: 22px;
    padding: 0 10px;
    transition: all 0.2s ease-in-out 0s;
    white-space: nowrap;
}

JS

http://autoitbrasil.com

6Sugestão - Novos icones Empty Re: Sugestão - Novos icones Sex 21 Fev 2014, 8:56 pm

waghcwb

waghcwb
Desenvolvedores
Desenvolvedores

JScript escreveu:Tá louco?! Continue amigo, você é fera no CSS!!!
Obrigado amigo!

Aqui os que me pediu:

#branding
Código:
#branding {
 background-color: #36618f;
 background-image: -webkit-gradient(linear, 0 100%, 0 0, from(#416d9a), to(#2c5687))!important;
 background-image: -webkit-linear-gradient(#416d9a 0%, #2c5687 100%)!important;
 background-image: -moz-linear-gradient(#416d9a 0%, #2c5687 100%)!important;
 background-image: -ms-linear-gradient(#416d9a 0%, #2c5687 100%)!important;
 background-image: -o-linear-gradient(#416d9a 0%, #2c5687 100%)!important;
 background-image: linear-gradient(#416d9a 0%, #2c5687 100%)!important;
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#416d9a', endColorstr='#2c5687',GradientType=0 )!important;
 border-bottom: 1px solid #1B3759;
 border-top: 1pz solid #4f84af;
 min-height: 64px;
}

.ipsButton_secondary.important
Código:
.ipsButton_secondary.important {
    background: #9c2800;
    background: -moz-linear-gradient(top,  #9c2800 0%, #802100 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#9c2800), color-stop(100%,#802100));
    background: -webkit-linear-gradient(top,  #9c2800 0%,#802100 100%);
    background: -o-linear-gradient(top,  #9c2800 0%,#802100 100%);
    background: -ms-linear-gradient(top,  #9c2800 0%,#802100 100%);
    background: linear-gradient(to bottom,  #9c2800 0%,#802100 100%);
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9c2800', endColorstr='#802100',GradientType=0 );
 border: 1px solid #812200;
 box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4) inset, 0 1px 0 rgba(0, 0, 0, 0.3);
 color: #FBF4F4 !important;
}

.postmain cite, cite, .codebox.spoiler dt
Código:
.postmain cite, cite, .codebox.spoiler dt {
 background: #ededed;
    background: -moz-linear-gradient(top,  #f6f6f6 0%, #e5e5e5 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f6f6f6), color-stop(100%,#e5e5e5));
    background: -webkit-linear-gradient(top,  #f6f6f6 0%,#e5e5e5 100%);
    background: -o-linear-gradient(top,  #f6f6f6 0%,#e5e5e5 100%);
    background: -ms-linear-gradient(top,  #f6f6f6 0%,#e5e5e5 100%);
    background: linear-gradient(to bottom,  #f6f6f6 0%,#e5e5e5 100%);
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6f6f6', endColorstr='#e5e5e5',GradientType=0 );
    border-radius: 5px 5px 0 0;
    font-size: 12px;
    font-weight: 700;
    overflow-x: auto;
    margin-left: -10px;
    margin-right: -10px;
    margin-top: -10px;
    padding-right: 10px;
 padding: 8px 10px;
}

.input_submit
Código:
.input_submit {
 background: #2f2f2f;
    background: -moz-linear-gradient(top,  #3b3b3b 0%, #202021 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#3b3b3b), color-stop(100%,#202021));
    background: -webkit-linear-gradient(top,  #3b3b3b 0%,#202021 100%);
    background: -o-linear-gradient(top,  #3b3b3b 0%,#202021 100%);
    background: -ms-linear-gradient(top,  #3b3b3b 0%,#202021 100%);
    background: linear-gradient(to bottom,  #3b3b3b 0%,#202021 100%);
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3b3b3b', endColorstr='#202021',GradientType=0 );
 border-color: #212121;
 border-radius: 3px 3px 3px 3px;
 border-style: solid;
 border-width: 1px;
 box-shadow: 0 1px 0 0 #5C5C5C inset, 0 2px 3px rgba(0, 0, 0, 0.2);
 color: #FFFFFF;
 cursor: pointer;
 padding: 4px 10px;
 text-decoration: none;
}

.ipsButton_secondary
Código:
.ipsButton_secondary {
 background: #ececec;
    background: -moz-linear-gradient(top,  #ededed 0%, #e2e2e2 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ededed), color-stop(100%,#e2e2e2));
    background: -webkit-linear-gradient(top,  #ededed 0%,#e2e2e2 100%);
    background: -o-linear-gradient(top,  #ededed 0%,#e2e2e2 100%);
    background: -ms-linear-gradient(top,  #ededed 0%,#e2e2e2 100%);
    background: linear-gradient(to bottom,  #ededed 0%,#e2e2e2 100%);
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ededed', endColorstr='#e2e2e2',GradientType=0 );
    border: 1px solid #DBDBDB;
    border-radius: 3px 3px 3px 3px;
    box-shadow: 0 1px 0 #FFFFFF inset, 0 1px 0 rgba(0, 0, 0, 0.3);
    color: #616161;
    display: inline-block;
    font-size: 12px;
    height: 22px;
    line-height: 22px;
    padding: 0 10px;
    transition: all 0.2s ease-in-out 0s;
    white-space: nowrap;
}

Preview de todos os códigos..
http://jsfiddle.net/Wagner/yQ5FZ/embedded/result/

De uma analisada e me fale se encontrar algum bug..

http://wagneraugusto.com.br/

7Sugestão - Novos icones Empty Re: Sugestão - Novos icones Sex 21 Fev 2014, 9:56 pm

JScript

JScript
Administradores
Administradores

Agora deu certo, mas veja:

Sugestão - Novos icones NvKkC4h

Falta uma espécie de "brilho" e não combinou com o logo!

JS

http://autoitbrasil.com

8Sugestão - Novos icones Empty Re: Sugestão - Novos icones Sex 21 Fev 2014, 10:18 pm

waghcwb

waghcwb
Desenvolvedores
Desenvolvedores

Isso é fácil de resolver..
Só tem um problema eu precisaria do logo sem aquele fundo azul com degrade, no caso apenas a imagem do logo, você tem ai? Talvez o .psd do logo atual.. Ou até mesmo possamos usar este aqui:
http://jscript.forumeiros.com/t406-logo-para-o-forum

Aguardo resposta!

http://wagneraugusto.com.br/

9Sugestão - Novos icones Empty Re: Sugestão - Novos icones Sex 21 Fev 2014, 10:47 pm

JScript

JScript
Administradores
Administradores

Mas e o brilho que tem na parte superior e que se estende até quase o meio (eu acho..)?

Sugestão - Novos icones T6KDGJm

JS

http://autoitbrasil.com

10Sugestão - Novos icones Empty Re: Sugestão - Novos icones Sex 21 Fev 2014, 11:10 pm

waghcwb

waghcwb
Desenvolvedores
Desenvolvedores

Algo assim, que tal?
http://jsbin.com/soveqaxo/1
(Só testei no Mozilla, se curtir eu adapto para outros navegadores..)

http://wagneraugusto.com.br/

11Sugestão - Novos icones Empty Re: Sugestão - Novos icones Sex 21 Fev 2014, 11:16 pm

JScript

JScript
Administradores
Administradores

Perfeito, mas dá pra juntar mais um pouco o ícone do nome?

JS

http://autoitbrasil.com

12Sugestão - Novos icones Empty Re: Sugestão - Novos icones Sex 21 Fev 2014, 11:26 pm

waghcwb

waghcwb
Desenvolvedores
Desenvolvedores

Com certeza, veja se lhe agrada:

Sugestão - Novos icones HpsdHdF

http://wagneraugusto.com.br/

13Sugestão - Novos icones Empty Re: Sugestão - Novos icones Sex 21 Fev 2014, 11:50 pm

JScript

JScript
Administradores
Administradores

Ficou assim:

Sugestão - Novos icones 7loA4ve

E para ficar assim:

Sugestão - Novos icones T22uBFk

Eu adicionei este CSS:
Código:

#logo img {
  height: 40px;
  margin-left: 6px;
  margin-top: 12px;
}

Se poder deixar a imagem nessas dimensões atuais de 280x40 eu removo o CSS...

JS

http://autoitbrasil.com

14Sugestão - Novos icones Empty Re: Sugestão - Novos icones Sáb 22 Fev 2014, 9:28 am

waghcwb

waghcwb
Desenvolvedores
Desenvolvedores

Aqui está:
Sugestão - Novos icones FbM5Qwe

@Edit: O que acha deste efeito?
Código:
<div id="branding">
  <img src="http://i.imgur.com/FbM5Qwe.png" alt="Logo - PunBB Community" />
</div>
Código:
#branding {
    background: #407eba;
    background: -moz-radial-gradient(center, ellipse cover,  #407eba 0%, #2d5888 100%);
    background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,#407eba), color-stop(100%, #2d5888));
    background: -webkit-radial-gradient(center, ellipse cover,  #407eba 0%, #2d5888 100%);
    background: -o-radial-gradient(center, ellipse cover,  #407eba 0%, #2d5888 100%);
    background: -ms-radial-gradient(center, ellipse cover,  #407eba 0%, #2d5888 100%);
    background: radial-gradient(ellipse at center,  #407eba 0%, #2d5888 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#407eba', endColorstr=' #2d5888',GradientType=1 );
    border-bottom: 1px solid #1B3759;
    border-top: 1px solid #4f84af;
    min-height: 64px;
    max-height: 64px;
}
#branding img{
    padding: 12px;
    padding-bottom: 13px;
    border-bottom: #1b3759 1px solid;   
}
http://jsbin.com/soveqaxo/2

http://wagneraugusto.com.br/

Conteúdo patrocinado



Ir para o topo  Mensagem [Página 1 de 1]

Permissões neste sub-fórum
Não podes responder a tópicos