Menu para calendário (02 modelos)

Finalmente a menina aqui resolveu criar um novo PSD o mais semelhante possível, pra fazer as ilustrações hihi. É que eu tinha perdido, gente. Ah, vocês conhecem o Blog de ilustras do Wonderland, e a ask? Eu dei uma abandonada, mas estou de volta *u* aqui estão »Ask/Shine Gallery«. Então gente, faz muito tempo que não posto menus, então eu trouxe dois modelos pra calendário! Esta é a preview» (x) Obs: gadget Menu calendário.

MODELO 01

Vá em seu Modelo, em seguida em Editar HTML. Tecle Ctrl + F e na caixinha que aparecer, procure pela tag ]]></b:skin>. Acima dela, cole este código:

/* menu por wonderland */

@font-face { font-family: 'PF Arma Five';

src: url('http://static.tumblr.com/xf6erfz/sUBm594pm/pf_arma_five.ttf'); src: format('truetype');}

.agenda {

font-family: PF Arma Five;

font-size: 8px;

color: #ababab;

border-bottom: 1px dotted #ffbec9; /* cor da bordinha pontilhada */

-webkit-transition-duration: 1s;

max-width: 158px;

}

.agenda:hover {

background: #f7f7f7; /* cor do fundinho em hover */

margin-left: 5px; /* não modifique */

border-bottom: 1px dotted #ff738a; /* cor da bordinha pontilhada hover */

cursor: text;

-webkit-transition-duration: .10s;

}

Agora, em Layout, adicione um Gadget HTML/JavaScript e nele cole o seguinte código:

<div class="agenda">
<b>00/00</b> Assunto do post</div>
<div class="agenda">
<b>00/00</b> Assunto do post</div>
<div class="agenda">
<b>00/00</b> Assunto do post</div>
<div class="agenda">
<b>00/00</b> Assunto do post</div>
<div class="agenda">
<b>00/00</b> Assunto do post</div>
<div class="agenda">
<b>00/00</b> Assunto do post</div>
<div class="agenda">
<b>00/00</b> Assunto do post</div>
<div class="agenda">
<b>00/00</b> Assunto do post</div>
<div class="agenda">
<b>00/00</b> Assunto do post</div>

Azul = Texto da data, está entre <b> </b> para o texto em si ficar em negrito

Vermelho = Texto que você deseja colocar.

/// NÃO MODIFIQUE O RESTO.

MODELO 02 

Vá em seu Modelo, em seguida em Editar HTML. Tecle Ctrl + F e na caixinha que aparecer, procure pela tag ]]></b:skin>. Acima dela, cole este código:

@font-face { font-family: 'PF Arma Five';

src: url('http://static.tumblr.com/xf6erfz/sUBm594pm/pf_arma_five.ttf'); src: format('truetype');}

.agenda02 {

margin: 1px;

background: #ffedf2; /* fundinho */

font-family: PF Arma Five; /* fonte */

font-size: 8px;

color: #8c8c8c; /* cor da fonte */

padding-left: 2px;

border: 1px solid #ff7ea5; /* cor da bordinha  */

-webkit-transition-duration: 1s;

text-shadow: 0px 1px 0px #fff;

border-radius: 3px;

box-shadow:inset 1px 1px 0 0 #fff;

max-width: 158px;

}

.agenda02:hover {

background: #f7f7f7; /* cor do fundinho em hover */

margin-left: 7px; /* não modifique */

border-bottom: 1px dotted #ff7ea5; /* cor da bordinha */

cursor: default;

-webkit-transition-duration: .2s; /* não modifique */

}

 Agora, em Layout, adicione um Gadget HTML/JavaScript e nele cole o seguinte código:

<div class="agenda02">

<b>00/00</b> Assunto do post</div>

<div class="agenda02">

<b>00/00</b> Assunto do post</div>

<div class="agenda02">

<b>00/00</b> Assunto do post</div>

<div class="agenda02">

<b>00/00</b> Assunto do post</div>

<div class="agenda02">

<b>00/00</b> Assunto do post</div>

<div class="agenda02">

<b>00/00</b> Assunto do post</div>

<div class="agenda02">

<b>00/00</b> Assunto do post</div>

<div class="agenda02">

<b>00/00</b> Assunto do post</div>

Azul = Texto da data, está entre <b> </b> para o texto em si ficar em negrito

Vermelho = Texto que você deseja colocar.

/// NÃO MODIFIQUE O RESTO. 

Obs: Os menus são hover, então quando você encosta o mouse, tem efeito!