Skip to content

Instantly share code, notes, and snippets.

@lenagroeger

lenagroeger/gist:5014929

Last active December 14, 2015 02:39
Show Gist options
  • Save lenagroeger/5014929 to your computer and use it in GitHub Desktop.
Save lenagroeger/5014929 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
gistfile1.html
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div id="page">
<header id="header">
<div class="main-header clearfix"><h1>Balance Media's Vertical Timeline</h1></div>
</header>
<div role="main" class="clearfix">
<div id="buttons">
<div id="expand-collapse-buttons">
<a class="expand-all active" href="#"><span>EXPAND ALL</span></a>
<a class="collapse-all" href="#"><span>COLLAPSE ALL</span></a>
</div>
<div id="sort-buttons">
<a class="sort-newest active" href="#"><span>NEWEST FIRST</span></a>
<a class="sort-oldest" href="#"><span>OLDEST FIRST</span></a>
</div>
</div>
<div id="timeline">
<div id="line-container"><div id="line"></div></div>
</div>
</div>
</div>
<script src="js/jquery.min.js"></script>
<script src="js/handlebars.js"></script>
<script src="js/tabletop.js"></script>
<script src="js/plugins.js"></script>
<script src="js/script.js"></script>
<script src="js/modernizr-2.5.3.min.js"></script>
<script id="year-marker-template" type="text/x-handlebars-template">
<div class="item year-marker">
<div class="inner">
<div class="inner2">
<div class="timestamp">{{timestamp}}</div>
<div class="year">{{year}}</div>
</div>
</div>
</div>
</script>
<script id="post-template" type="text/x-handlebars-template">
<div class="item post">
<div class="inner">
<div class="timestamp">{{timestamp}}</div>
<div class="title"><h3>{{title}}</h3></div>
<div class="date">{{display_date}}</div>
<div class="body">
{{#if photo_url}}
<img src="{{photo_url}}" alt="">
{{/if}}
{{#if caption}}
<div class="caption">({{caption}})</div>
{{/if}}
{{#if body}}
<div class="text">{{body}}</div>
{{/if}}
<div class="clearfix">
{{#if read_more_url}}
<a target="_blank" class="more" href="{{read_more_url}}">READ MORE</a>
<div class="share">
<a href="#" class="share-trigger"></a>
<div class="share-popup">
<a href="https://twitter.com/share" class="twitter-share-button" data-url="{{read_more_url}}" data-text="{{title}}" data-count="none">Tweet</a>
<a class="facebook-share-button" name="fb_share" type="button" share_url="{{read_more_url}}">Share</a>
</div>
</div>
{{/if}}
</div>
</div>
</div>
</div>
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment