11.11.12

Personalizando a data em hover

              

Vá em Modelo > Editar HTML > Ctrl + F e procure por:


.main-inner h2.date-header {
      font: $(date.font);
   color: $(date.text.color);
              }
                                                   
  Substitua o código acima por esse:

.main-inner h2.date-header {
float: left; /** data no lado esquerdo, pode mudar para right **/
width:55px;/** largura **/
height:55px;/** altura **/
overflow:hidden;
font-size:15px;/** tamanho da fonte **/
color: #fff !important;/** cor da fonte **/
text-align:center;/** alinha o texto **/
margin-bottom: -65px; /** desce **/
margin-left: -80px; /** margem pra esquerda **/
padding: 8px 2px 0px 2px; /** espaço interno: topo, direito, embaixo, esquerdo **/
-webkit-border-radius: 5em; -moz-border-radius: 5em; /** borda redonda **/
background: #xxxxx; /** cor do fundo **/
}
.main-inner h2.date-header:hover {
background: #xxxx; /** cor do fundo hover **/
}

Faça as alterações necessárias e visualize, se estiver tudo certo, salve.


Nenhum comentário:

Postar um comentário