Mini-Maratona de Tutoriais: Personalizando a Data

E ai, Cupcakes!

Como estão? Eu estou ótima!

Chegamos ao último tutorial da maratona, espero que tenham gostado dos outros tutus, se você não viu, aqui está os link dos tutoriais anteriores:

Borda Pressionada no PhotoScape

Faixinha Acima do Gadget

Retirando a Borda das Imagens

Imagem no Leia Mais

O tutu de hoje é como personalizar a data do blog, é bem simples. Achei no blog Space Tutorials,

comandado pela Tory, o Go Imagine da Anny, o On The Fame da Dani . Lá havia 3 modelos diferentes de uma data personalizada, então resolvi postar os 3 para vocês não perderem nada. Curioso? Leia Mais!

Vá em Modelo > Editar Modelo > Aperte F3 e pesquise o que está em itálico:

.main-inner h2.date-header {

 font: $(date.font);

 color: $(date.text.color); }

Para a data ficar assim:

Cole esse código:

.main-inner h2.date-header {

-webkit-transition-duration: .50s;

float:57 left;

width:px;

height:57px;

overflow:hidden;

font-size:13px;

color: #fff !important;

text-align:center;

margin-bottom: -75px;

margin-left: -70px;

padding: 8px 2px 0px 2px;

-webkit-border-radius: 5em; -moz-border-radius: 5em;

background: #CCD4DA; }

.main-inner h2.date-header:hover {

-webkit-transition-duration: .50s;

background: #BEC8CF; }

Ps. Se quiser, modifique apenas o que está em negrito.

Para a data ficar assim:

Cole esse código:

.main-inner h2.date-header {text-align: center;background:#fff ;color: #fff;border-radius: 10px 10 px 10 px 10px; }

Para a data ficar assim:

Cole esse código:

.main-inner h2.date-header {-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;text-align: center;background: #FFF;margin: 10px -1px -15px -110px;color: #D256C;Border: 2px solid #D2D56C;width: 15%;float: left;}

Espero que tenham gostado do ultimo tutu da maratona. Por enquanto é só, beijokinhas, tchau!