Sidebar Personalizada

         Awee *uu* voltei meus pudins de leite 0/ , mas ainda n to de ferias (#pqp #chatiada).
Primeiro eu queria saber se alguém já assistiu Shingeki no Kyojin , se não ASSISTAM ! pensou no melhor anime do mundo é ele , sério mesmo *uu*.

No tempo livre que eu tive essa semana criei o código de uma sidebar muito fofa e chamei ela de Walt Disney  veja demo aqui    ☃

Acima de </head> Cole isso :

<link href='http://fonts.googleapis.com/css?family=Montez' rel='stylesheet' type='text/css'/>

Esse código é responsável , pela fonte que vai aparecer no título .

De Ctrl+F e procure por :  Headings

Apague todo o Código encontrado abaixo dessa linha e Cole esse:

/*===   Começo Sidebar Walt Disney *By Celly Braga*  ===*/
.sidebar h2 {
  margin-top:-37px; /* margem entre o background do titulo e o background da caixa */
  font-family: 'Montez' arial , serif; /* tipo da fonte */
  line-height: 2.2em; /* altura da linha */
  text-transform: capitalize; /* transformação do texto */
  padding-right:3px;
  word-spacing:.1em; /* espaço entre palavras */
  color: #000000; /* cor do título */
  background: url()no-repeat; /* cor do background do título */
  width:335px;
  font-size: 30px; /* tamanho da fonte */
  text-align: center; /* alinhamento centralizado do título */
  padding-top:2px;
  font-weight:italic; /* deixa o título em negrito */
  border-radius: 0px 0px 0 0; /* arredondamento das bordas do título */
  }
/*===  Fim Sidebar Walt Disney *By Celly Braga*  ===*/

Agora Procure Por :  .Sidebar . Widget 

apague todo o código correspondennte e cole no lugar esse :

/*=== Começo 2° Parte Sidebar Walt Disney *By Celly Braga* ===*/ .sidebar .widget { border-radius: 3px; background: #fff; padding-top: 4px; padding-left: 5px; padding-right: 5px; margin: 5px 3px 25px; -webkit-transition: .80s ease-out; background: #fff; border-radius: 2px; padding-top: 5px; padding-left: 9px; padding-bottom: 9px; padding-right:9px; margin-bottom: -15px; outline: dashed 1px #FF3C6F; outline-offset: -5px; margin: 3px 8px 15px; } .sidebar .widget:hover { border-radius: 3px; background: #fff; padding-top: 4px; padding-left: 5px; padding-right: 5px; margin: 5px 3px 25px; -webkit-transition: .80s ease-out; background: #fff; border-radius: 2px; padding-top: 5px; padding-left: 9px; padding-bottom: 9px; padding-right:9px; margin-bottom: -15px; outline: dashed 1px #C4A7D3; outline-offset: -5px; margin: 3px 8px 15px; -moz-box-shadow: 9px 10px 22px rgba(196, 167, 211, 0.98);/*--- sombra da caixa em hover *---/ } /*=== Fim 2° Parte Sidebar Walt Disney *By Celly Braga*===*/

 Bem é isso aí *uu*  espero que tenham gostado , qualquer dúvida comentem 

( Ah é não tirem os créditos isso deu trabalho ;--; )