Elly's Base Code


<!--
Base code por elly - http://thelittledanger.tumblr.com/
Não redistribua sem minha autoria!
-->

<html lang="en">

<head>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>

{block:IndexPage}
<script type="text/javascript" src="http://static.tumblr.com/dbek3sy/iBElrgjim/jquerymasonry.js"></script>
<script type="text/javascript" src="http://static.tumblr.com/dbek3sy/Qyblrgjfn/jqueryinfintescroll.js"></script>

<script type="text/javascript">
$(window).load(function(){
var $wall = $('#entry');
$wall.imagesLoaded(function(){
$wall.masonry({
itemSelector: '#post, #post_photo',
isAnimated : false
});
});

$wall.infinitescroll({
navSelector : '#pagination',
nextSelector : '#pagination a',
itemSelector : '#post, #post_photo',
bufferPx : 2000,
debug : false,
errorCallback: function() {
$('#scroll').fadeOut('normal');
}},
function( newElements ) {
var $newElems = $( newElements );
$newElems.hide();
$newElems.imagesLoaded(function(){
$wall.masonry( 'appended', $newElems,{isAnimated: false}, function(){$newElems.fadeIn('slow');} );
});
}); $('#entry').show(500);
});
</script>
{/block:IndexPage}

<style type="text/css">

    body {
        background-color: white;
        background-attachment: fixed;
    }

    a {
        color: #FAA0BB;
        text-decoration: none;
-webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
    }

    a:hover {
        color: #FFDEF0;
-webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
    }

    #container {
        margin: auto;
        width: 510px;
        font-family: consolas;
        font-size: 11px;
        color: #757575;
    }

    #entry {
        width: 270px;
        margin-left: 250px;
        margin-top: 20px;
    {block:PermalinkPage}
    width:500px;
    {/block:PermalinkPage}
    }

    #post {
        width: 250px;
        padding: 10px;
        margin-bottom: 20px;
    {block:PermalinkPage}
    width:500px;
    {/block:PermalinkPage}

    }

    #post img {
        max-width: 100%;
    }

    .posttitle {
        text-align: center;
        font-size: 15px;
        color: #FAA0BB;
    }

    .permalink {
        text-align: center;
        border-top: 1px solid #FAA0BB;
        margin-top: 10px;
        padding-top: 5px;
        color: #FAA0BB;
    }

    #sidebar {
        width: 150px;
        position: fixed;
        text-align: center;
        margin-top: 140px;
        margin-left: 20px;
    }

    #sidebar img {
        max-width: 100%;
    }

    .sidetitle {
        font-size: 15px;
        color: #FAA0BB;
    }

    #links {
        position: relative;
    }

    #links a {
        color: #fff;
        display: block;
        background-color: #FAA0BB;
        margin-bottom: 5px;
        padding: 1px;
    }

    #links a:hover {
        background-color: #fff;
        color: #FAA0BB;
    }

    .source {
        margin-top: 5px;
        text-align: right;
    }

    #scroll{
    bottom:-20px;
    position: absolute;
    left: 50%;
    width:10px;
    height:5px;
    overflow:hidden;
    margin-bottom:80px;}

    ol.notes li.note {
    padding-bottom: 3px;
}

    ol.notes {
    padding-top: 10px;
    margin-left: -40px;
    list-style-type: none;
}

    ol.notes li.note img.avatar {
    vertical-align: -4px;
    margin-right: 10px;
    width: 16px;
    height: 16px;
}

::-moz-selection {
background:#FAA0BB; /*Cor do fundo*/
color:#fff; /*Cor da fonte*/
}
::selection {
background:#FAA0BB;/*Cor do fundo*/
color: #fff; /*Cor da fonte*/
}


</style>

</head>

<body>
<div id="container">

<div id="sidebar">

    <div class="sidetitle">{Title}</div></p>

    <img src="http://media-cache-ak0.pinimg.com/236x/e4/f7/4d/e4f74d5313c0b2fea331132eaae5e9a1.jpg"></p>

    It does not matter how slow you go so long as you do not stop.</p>

    <div id="links">
        <a href="#">Home</a>
        <a href="#">Message</a>
        <a href="#">Archive</a>
    </div>

</div>

<div id="entry">

{block:Posts}

{block:ContentSource}
<!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
{/block:SourceLogo}
{block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
{/block:ContentSource}

<div id="post">

{block:Text}
<div class="posttitle">{block:Title}{Title}{/block:Title}</div>
{Body}
{/block:Text}

{block:Quote}
"{Quote}"<br>
— {Source}
{/block:Quote}

{block:Link}
<div class="posttitle"><a href="{URL}">{Name}</a></div>
{/block:Link}

{block:Chat}
{block:Lines}{block:Label}{Label} {/block:Label}{Line}<br>{/block:Lines}
{/block:Chat}

{block:Answer}
{Asker} asked: {Question}<br>
{Answer}
{/block:Answer}

{block:Audio}
{AudioPlayer}
{/block:Audio}

{block:Video}
{Video-400}
{/block:Video}

{block:Photo}
<img src="{PhotoURL-400}"/>
{/block:Photo}

{block:Photoset}
{Photoset-400}
{/block:Photoset}

{block:caption}{Caption}{/block:caption}

{block:PermalinkPage}
{block:Caption}{Caption}{/block:Caption}
<p>{block:Date} {Month} {DayofMonthWithSuffix}, {Year}{/block:Date}  {block:NoteCount}, {NoteCountWithLabel}{/block:NoteCount} {block:RebloggedFrom}, (via <a href="{ReblogParentURL}">{ReblogParentName}</a>){/block:RebloggedFrom}
{block:PostNotes}{PostNotes}{/block:PostNotes}{/block:PermalinkPage}

{block:IndexPage}
<div class="permalink"><a href="{ReblogURL}">Reblog</a> /
<a href="{Permalink}">{NoteCount}</a></div>{/block:IndexPage}

</div>
{/block:Posts}
</div>

{block:IndexPage}
{block:Pagination}
<div id="pagination">
{block:NextPage}
<a id="nextPage" href="{NextPage}"></a>
{/block:NextPage}
{block:PreviousPage}
<a href="{PreviousPage}"></a>
{/block:PreviousPage}
</div>
{/block:Pagination}
{/block:IndexPage}

</body>

</html>