New Links

I present you hack transformation options for DataLife Engine. Powered by CSS2.0 support each browser. 

The trick is that when you hover on a link it is animated and the background turns to the left or right. Very nice to look at any design!

Installation?!
1. Open {THEME}/css/engine.css
add this code to your css.

/*  New Link by Ciorax & www.dlesupport.blogspot.com */
.newlink a {
    display: inline-block;
    padding: 4px;
    outline: 0;
    color: #587ed7;    
    -webkit-transition-duration: 0.25s;
    -moz-transition-duration: 0.25s;
    -o-transition-duration: 0.25s;
    transition-duration: 0.25s;
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    -o-transition-property: -o-transform;
    transition-property: transform;
    -webkit-transform: scale(1) rotate(0);
    -moz-transform: scale(1) rotate(0);
    -o-transform: scale(1) rotate(0);
    transform: scale(1) rotate(0);
    }
.newlink a:hover {
    background: #587ed7;     
    text-decoration: none;
    color: #fff;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px;
    -webkit-transform: scale(1.05) rotate(-1deg);
    -moz-transform: scale(1.05) rotate(-1deg);
    -o-transform: scale(1.05) rotate(-1deg);
    transform: scale(1.05) rotate(-1deg);
    }
.newlink a:nth-child(2n):hover {
    -webkit-transform: scale(1.05) rotate(1deg);
    -moz-transform: scale(1.05) rotate(1deg);
    -o-transform: scale(1.05) rotate(1deg);
    transform: scale(1.05) rotate(1deg);
    }

2. Open {THEME}/fullstory.tpl or {THEME}/shortstory.tpl
and add:

<div class="newlink">{fullstory}</div>

or

<div class="link">{short-story}</div>

That's all :)