Tumblr

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.
org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>{Title}</title> <link rel="shortcut icon" href="{Favicon}"> <link rel="alternate" type="application/rss+xml" href="{RSS}"> {block:Description} <meta name="description" content="{MetaDescription}" /> {/block:Description}
<meta name="image:Header" content=""/> <meta name="text:Resume Link" content=""/> <meta name="text:Blog Link" content=""/> <meta name="text:Email Address" content=""/> <meta name="text:Custom Image Thumbnail Height" content="167"/> <meta name="color:Accent" content="#e20033"/> <meta name="color:Text" content="#00000"/> <meta name="color:Link" content="#333333"/> <meta name="color:Background" content="#ffffff"/> <meta name="color:Thumbnail Background" content="#000000"/> <meta name="color:Hover Link Color" content="#ffffff"/> <meta name="color:Borders" content="#000000"/> <meta name="color:Small Borders" content="#cccccc"/>
<script type="text/javascript" src="http://matt.cc/tumblr/portfolio/infinitescroll.js"></script>
<script type="text/javascript" src="http://matt.cc/tumblr/portfolio/jquery1.5.2.min.js"></script>
{block:PermalinkPage}
<script src="http://matt.cc/tumblr/portfolio/jquery.colorbox-min.js"></script> <script type="text/javascript"> $(document).ready(function() {
$("a[rel='slideshow']").colorbox({photo:true});
}); </script>
{/block:PermalinkPage}
<link href='http://fonts.googleapis.com/css?family=Droid+Sans' rel='stylesheet' type='text/css'>
<style type="text/css" media="screen">
body{ margin:0px;
padding:40px; background:{color:Background}; font-family: 'Droid Sans', Helvetica, sans-serif; font-size:12px; line-height:18px; color:{color:Text}; }
a{color:{color:Link};}
a:hover{ background:{color:Accent}; text-decoration:none; color:{color:Hover Link Color}; -webkit-transition: all .25s ease-in-out; -moz-transition: all .25s ease-in-out; -o-transition: all .25s ease-in-out; -webkit-transition: all .25s ease-in-out; transition: all .25s ease-in-out;}
h1{font-size:20px; line-height:28px; padding:0px 0px 10px 0px; margin:0px; }
h1 a{color:{color:Text}; text-decoration:none; }
#container{ width:980px; margin:auto; }
#index-bar{border-top:2px solid {color:Borders};padding-bottom:25px;}
#header-image{max-width:160px;}
#left{width:160px; float:left; margin-right:10px; padding:25px 10px 0px 10px; border-top:2px solid {color:Borders}; }
#right{ width:780px; float:left; }
.box{ float:left; width:250px; height:167px; overflow:hidden; margin:5px; position:relative; background-color:{color:Thumbnail Background}; vertical-align:middle; padding:-5px 0px 0px 0px; }
.box-caption{ width:220px; height:167px; overflow:hidden; position:absolute; left:0px; top:0px; z-index:99; background-color:transparent; filter:alpha(opacity=0); opacity:0; display: inline-block;
padding:0px 15px; text-indent:-2000px; }
.box-caption-text{ color:{color:Hover Link Color}; width:220px; height:167px; overflow:hidden; position:absolute; left:0px; top:0px; z-index:95; font-size:12px; line-height:16px; background-color:transparent; filter:alpha(opacity=0); padding:0px 15px; opacity:0; display: inline-block; -webkit-transition: opacity .25s ease-in-out; -moz-transition: opacity .25s ease-in-out; -o-transition: opacity .25s ease-in-out; -webkit-transition: opacity .25s ease-in-out; transition: opacity .25s ease-in-out; }
.box:hover .box-caption{ display: inline-block; background-color:transparent; }
.box:hover .box-caption-text{ opacity:.85; filter:alpha(opacity=85); background-color:{color:Accent}; }
.middle{ float:left;width:500px;margin-right:10px; padding-top:25px; border-top:2px solid {color:Borders}; }
.caption{ width:250px;float:left; border-top:2px solid {color:Borders}; padding:15px 10px 0px 10px; }
.photoset-caption{ padding:5px 0px; }
.text{ border-top:2px solid {color:Borders}; padding:25px 10px 0px 10px; }
.tags{ padding:15px 0px; border-top:1px solid {color:Small Borders}; font-size:11px; } .tags a{ padding:2px; }
.permpaginate{ padding:15px 0px; border-top:1px solid {color:Small Borders}; border-bottom:1px solid {color:Small Borders}; font-size:11px; }
.permpaginate a{ padding:2px; }
#pages{list-style:none; margin:5px 0px; border-top:1px solid {color:Small Borders}; padding:0px;} #pages li{ }
#pages a{ padding:5px 2px; text-decoration:none; border-bottom:1px solid {color:Small Borders}; display:block; }
#footer{ font-size:11px; margin-top:50px; padding:20px 10px; border-top:2px solid {color:Borders}; border-bottom:2px solid {color:Borders};
#footer a{ padding:2px; }
.clear{ clear:both; }
.html_photoset p{ padding:0px 0px 5px 0px; margin:0; }
{block:IfCustomImageThumbnailHeight}
.box{height:{text:Custom Image Thumbnail Height}px;} .box-caption{height:{text:Custom Image Thumbnail Height}px;} .box-caption-text{height:{text:Custom Image Thumbnail Height}px;} {/block:IfCustomImageThumbnailHeight}
/* ColorBox Core Style: The following CSS is consistent between example themes and should not be altered. */ #colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;} #cboxOverlay{position:fixed; width:100%; height:100%;} #cboxMiddleLeft, #cboxBottomLeft{clear:left;} #cboxContent{position:relative;} #cboxLoadedContent{overflow:auto;} #cboxTitle{margin:0;} #cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;} #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;} .cboxPhoto{float:left; margin:auto; border:0; display:block;} .cboxIframe{width:100%; height:100%; display:block; border:0;}
/* User Style: Change the following styles to modify the appearance of ColorBox. They are ordered & tabbed in a way that represents the nesting of the generated HTML. */ #cboxOverlay{background:#fff;} #colorbox{} #cboxContent{margin-top:32px; overflow:visible;} #cboxError{padding:50px; border:1px solid #ccc;} #cboxLoadedContent{background:#000; padding:1px;}
#cboxLoadingGraphic{background:url(http://matt.cc/tumblr/portfolio/loader.gif) no-repeat center center;} #cboxLoadingOverlay{background:#000;} #cboxTitle{position:absolute; top:-22px; left:0; color:#000;} #cboxCurrent{position:absolute; top:-22px; right:205px; text-indent:-9999px;} #cboxSlideshow, #cboxPrevious, #cboxNext, #cboxClose{text-indent:-9999px; width:20px; height:20px; position:absolute; top:-20px; background:url(http://matt.cc/tumblr/portfolio/controls.png) no-repeat 0 0;} #cboxPrevious{background-position:0px 0px; right:44px;} #cboxPrevious.hover{background-position:0px -25px;} #cboxNext{background-position:-25px 0px; right:22px;} #cboxNext.hover{background-position:-25px -25px;} #cboxClose{background-position:-50px 0px; right:0;} #cboxClose.hover{background-position:-50px -25px;} .cboxSlideshow_on #cboxPrevious, .cboxSlideshow_off #cboxPrevious{right:66px;} .cboxSlideshow_on #cboxSlideshow{background-position:-75px -25px; right:44px;} .cboxSlideshow_on #cboxSlideshow.hover{background-position:-100px -25px;} .cboxSlideshow_off #cboxSlideshow{background-position:-100px 0px; right:44px;} .cboxSlideshow_off #cboxSlideshow.hover{background-position:-75px -25px;}
</style>

</head>
<body> <div id="container"> <div id="left">
{block:IfHeaderImage} <a href="/"><img src="{image:Header}" id="header-image" border="0"/></a> {/block:IfHeaderImage}
{block:IfNotHeaderImage} <h1><a href="/">{Title}</a></h1> {/block:IfNotHeaderImage}
{block:Description} <p id="description">{Description}</p> {/block:Description}
<ul id="pages">
{block:HasPages} {block:Pages}<li><a href="{URL}">{Label}</a></li>{/block:Pages} {/block:HasPages}
{block:IfResumeLink} <li><a href="{text:Resume Link}">Resume</a></li>
{block:IfResumeLink}
{block:IfBlogLink} <li><a href="{text:Blog Link}">Blog</a></li> {block:IfBlogLink}
{block:IfEmailAddress} <li><a href="mailto:{text:Email Address}">Contact</a></li> {block:IfEmailAddress}
</ul>
</div> <div id="right"> {block:IndexPage} <div id="index-bar"></div> <div class="clear"></div> {/block:IndexPage}
<div id="posts" class="autopagerize_page_element"> {block:Posts}
{block:Photo} <div class="post photo">
{block:IndexPage}<div class="box">
<img src="{PhotoURL-250}" alt="{PhotoAlt}"/>
<div class="box-caption-text">{Caption}</div> <a href="{Permalink}" class="box-caption">#</a>
</div> {/block:IndexPage}
{block:PermalinkPage}
<div class="middle">
<div class="middle-content">
<a href="{PhotoURL-HighRes}" rel="slideshow"> <img src="{PhotoURL-500}" alt="{PhotoAlt}" border="0"/> </a>
</div>
</div>
<div class="caption"> {block:Caption} {Caption} {/block:Caption}
{block:HasTags} <div class="tags">Tags: {block:Tags}<a href="{TagURL}">{Tag}</a> {/block:Tags} </div> {/block:HasTags} {block:PermalinkPagination} <div class="permpaginate">
{block:NextPost} <a href="{NextPost}">Previous Project</a> {/block:NextPost} {block:PreviousPost} <a href="{PreviousPost}">Next Project</a> {/block:PreviousPost} </div>
{/block:PermalinkPagination}
</div>
{/block:PermalinkPage}
</div> {/block:Photo}
{block:Photoset} {block:IndexPage} <script type="text/javascript"> $(document).ready(function() { $('.html_photoset').killPhotoset({ photoSize: 250 }); });
</script> {/block:IndexPage}
{block:PermalinkPage} <script type="text/javascript"> $(document).ready(function() { $('.html_photoset').killPhotoset({
photoSize: 500 }); });
</script> {/block:PermalinkPage} <div class="post photoset"> {block:IndexPage} <div class="box">
{block:Photos} <img src="{PhotoURL-250}" alt="{PhotoAlt}"/> {/block:Photos}
</div> {/block:IndexPage}
{block:PermalinkPage} <div class="middle"> <div class="middle-content">
{block:Photos} <a href="{PhotoURL-HighRes}" rel="slideshow"> <img src="{PhotoURL-500}" alt="{PhotoAlt}"border="0"/> </a>
<div class="photoset-caption">{Caption}</div>
{/block:Photos}
</div>
</div> <div class="caption"> {block:Caption} {Caption} {/block:Caption}
{block:HasTags} <div class="tags">Tags: {block:Tags}<a href="{TagURL}">{Tag}</a> {/block:Tags} </div> {/block:HasTags}
{block:PermalinkPagination} <div class="permpaginate">
{block:NextPost} <a href="{NextPost}">Previous Project</a> {/block:NextPost} {block:PreviousPost} <a href="{PreviousPost}">Next Project</a> {/block:PreviousPost}
</div> {/block:PermalinkPagination}
</div>
{/block:PermalinkPage} </div> {/block:Photoset}
{block:Video} <div class="post video"> {block:IndexPage}<div class="box">
{Video-250}
</div>
{/block:IndexPage}
{block:PermalinkPage} <div class="middle">
<div class="middle-content">{Video-500}</div>
</div> <div class="caption"> {block:Caption} {Caption} {/block:Caption}
{block:HasTags} <div class="tags">Tags: {block:Tags}<a href="{TagURL}">{Tag}</a> {/block:Tags} </div> {/block:HasTags}
{block:PermalinkPagination} <div class="permpaginate">
{block:NextPost} <a href="{NextPost}">Previous Project</a> {/block:NextPost}
{block:PreviousPost} <a href="{PreviousPost}">Next Project</a> {/block:PreviousPost}
</div> {/block:PermalinkPagination}
</div>
{/block:PermalinkPage} </div> {/block:Video}
{/block:Posts}
{block:PermalinkPage} {block:Posts} {block:Text}
<div class="post text"> {block:Title} <h1>{Title}</h1> {/block:Title}
{Body} </div>
{/block:Text} {/block:Posts} {/block:PermalinkPage}
</div> </div>
<div class="clear"> </div>
<p id="footer">
<a href="/">Home</a> • <a href="/archive">Archive</a> • <a href="/rss">RSS</a> • <a href="http://hasaportfolio.com">hasaportfolio</a> theme by <a href="http://matt.cc">matt mcinerney</a>
</p> </div> </body> </html>

Tumblr

Загружено:

Сведения о документе

Авторское право

Доступные форматы

Поделиться этим документом

Поделиться или встроить документ

Параметры публикации

Этот документ был вам полезен?

Это неприемлемый материал?

Авторское право:

Доступные форматы

Tumblr

Загружено:

Авторское право:

Доступные форматы

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.

<script type="text/javascript" src="http://matt.cc/tumblr/portfolio/infinitescroll.js"></script>

<script type="text/javascript" src="http://matt.cc/tumblr/portfolio/jquery1.5.2.min.js"></script>

<script src="http://matt.cc/tumblr/portfolio/jquery.colorbox-min.js"></script> <script type="text/javascript"> $(document).ready(function() {

<link href='http://fonts.googleapis.com/css?family=Droid+Sans' rel='stylesheet' type='text/css'>

<style type="text/css" media="screen">

h1{font-size:20px; line-height:28px; padding:0px 0px 10px 0px; margin:0px; }

#container{ width:980px; margin:auto; }

#index-bar{border-top:2px solid {color:Borders};padding-bottom:25px;}

#right{ width:780px; float:left; }

padding:0px 15px; text-indent:-2000px; }

.box:hover .box-caption{ display: inline-block; background-color:transparent; }

.box:hover .box-caption-text{ opacity:.85; filter:alpha(opacity=85); background-color:{color:Accent}; }

.middle{ float:left;width:500px;margin-right:10px; padding-top:25px; border-top:2px solid {color:Borders}; }

.caption{ width:250px;float:left; border-top:2px solid {color:Borders}; padding:15px 10px 0px 10px; }

.photoset-caption{ padding:5px 0px; }

.text{ border-top:2px solid {color:Borders}; padding:25px 10px 0px 10px; }

#pages a{ padding:5px 2px; text-decoration:none; border-bottom:1px solid {color:Small Borders}; display:block; }

.html_photoset p{ padding:0px 0px 5px 0px; margin:0; }

<!--[if IE]> <style type="text/css" media="screen"> .box-caption{ font-size:80px;

#right{ width:785px; float:left; }

#container{ width:985px; margin:auto; }

<body> <div id="container"> <div id="left">

{block:IfHeaderImage} <a href="/"><img src="{image:Header}" id="header-image" border="0"/></a> {/block:IfHeaderImage}

{block:IfNotHeaderImage} <h1><a href="/">{Title}</a></h1> {/block:IfNotHeaderImage}

{block:Description} <p id="description">{Description}</p> {/block:Description}

{block:HasPages} {block:Pages}<li><a href="{URL}">{Label}</a></li>{/block:Pages} {/block:HasPages}

{block:IfResumeLink} <li><a href="{text:Resume Link}">Resume</a></li>

{block:IfBlogLink} <li><a href="{text:Blog Link}">Blog</a></li> {block:IfBlogLink}

{block:IfEmailAddress} <li><a href="mailto:{text:Email Address}">Contact</a></li> {block:IfEmailAddress}

</div> <div id="right"> {block:IndexPage} <div id="index-bar"></div> <div class="clear"></div> {/block:IndexPage}

<div id="posts" class="autopagerize_page_element"> {block:Posts}

{block:Photo} <div class="post photo">

<img src="{PhotoURL-250}" alt="{PhotoAlt}"/>

<div class="box-caption-text">{Caption}</div> <a href="{Permalink}" class="box-caption">#</a>

<a href="{PhotoURL-HighRes}" rel="slideshow"> <img src="{PhotoURL-500}" alt="{PhotoAlt}" border="0"/> </a>

<div class="caption"> {block:Caption} {Caption} {/block:Caption}

{block:PermalinkPage} <script type="text/javascript"> $(document).ready(function() { $('.html_photoset').killPhotoset({

photoSize: 500 }); });

</script> {/block:PermalinkPage} <div class="post photoset"> {block:IndexPage} <div class="box">

{block:Photos} <img src="{PhotoURL-250}" alt="{PhotoAlt}"/> {/block:Photos}

<div class="box-caption-text">{Caption}</div> <a href="{Permalink}" class="box-caption">#</a>

{block:PermalinkPage} <div class="middle"> <div class="middle-content">

{block:Photos} <a href="{PhotoURL-HighRes}" rel="slideshow"> <img src="{PhotoURL-500}" alt="{PhotoAlt}"border="0"/> </a>

</div> <div class="caption"> {block:Caption} {Caption} {/block:Caption}

{block:HasTags} <div class="tags">Tags: {block:Tags}<a href="{TagURL}">{Tag}</a> {/block:Tags} </div> {/block:HasTags}

{block:PermalinkPagination} <div class="permpaginate">

{/block:PermalinkPage} </div> {/block:Photoset}

{block:Video} <div class="post video"> {block:IndexPage}<div class="box">

<div class="box-caption-text">{Caption}</div> <a href="{Permalink}" class="box-caption">#</a>

{block:PermalinkPage} <div class="middle">

</div> <div class="caption"> {block:Caption} {Caption} {/block:Caption}

{block:HasTags} <div class="tags">Tags: {block:Tags}<a href="{TagURL}">{Tag}</a> {/block:Tags} </div> {/block:HasTags}

{block:PermalinkPagination} <div class="permpaginate">

{block:NextPost} <a href="{NextPost}">Previous Project</a> {/block:NextPost}

{block:PreviousPost} <a href="{PreviousPost}">Next Project</a> {/block:PreviousPost}

{/block:PermalinkPage} </div> {/block:Video}

{block:PermalinkPage} {block:Posts} {block:Text}

<div class="post text"> {block:Title} <h1>{Title}</h1> {/block:Title}

{/block:Text} {/block:Posts} {/block:PermalinkPage}

<div class="clear"> </div>

</p> </div> </body> </html>

Вам также может понравиться