Skip to content

Instantly share code, notes, and snippets.

@skopp

skopp/h5bp.redux.html

Created October 14, 2012 15:40
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save skopp/3888955 to your computer and use it in GitHub Desktop.
Save skopp/3888955 to your computer and use it in GitHub Desktop.
Download ZIP
H5BP Redux Site Source-Code
Raw
h5bp.redux.html
<!doctype html public "lice">
<!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ -->
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8" lang="en"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9" lang="en"> <![endif]-->
<!-- Consider adding a manifest.appcache: h5bp.com/d/Offline -->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<title>H5BP Redux - HTML5 Boilerplate on steroids</title>
<!--
Welcome to the light side of the source, young padawan.
One step closer to learn something interesting you are...
____
_.' : `._
.-.'`. ; .'`.-.
__ / : ___\ ; /___ ; \ __
,'_ ""--.:__;".-.";: :".-.":__;.--"" _`,
:' `.t""--.. '<@.`;_ ',@:` ..--""j.' `;
`:-.._J '-.-'L__ `-- ' L_..-;'
"-.__ ; .-" "-. : __.-"
L ' /.------.\ ' J
"-. "--" .-"
__.l"-:_JL_;-";.__
.-j/'.; ;"""" / .'\"-.
.' /:`. "-.: .-" .'; `.
.-" / ; "-. "-..-" .-" : "-.
.+"-. : : "-.__.-" ;-._ \
; \ `.; ; : : "+. ;
: ; ; ; : ; : \:
; : ; : ;: ; :
: \ ; : ; : ; / ::
; ; : ; : ; : ;:
: : ; : ; : : ; : ;
;\ : ; : ; ; ; ;
: `."-; : ; : ; / ;
; -: ; : ; : .-" :
:\ \ : ; : \.-" :
;`. \ ; : ;.'_..-- / ;
: "-. "-: ; :/." .' :
\ \ : ;/ __ :
\ .-`.\ /t-"" ":-+. :
`. .-" `l __/ /`. : ; ; \ ;
\ .-" .-"-.-" .' .'j \ / ;/
\ / .-" /. .'.' ;_:' ;
:-""-.`./-.' / `.___.'
\ `t ._ /
"-.t-._:'
-->
<meta name="author" content="your name" />
<meta name="keywords" content="keywords,go,here,you-can-use-key-phrases-to" />
<meta name="description" content="description goes here" />
<!-- https://developer.mozilla.org/En/Controlling_DNS_prefetching (FF) -->
<!-- http://www.chromium.org/developers/design-documents/dns-prefetching (WEBKIT) -->
<!-- Prefetch DNS lookups. Are your visitors going here? Use their idle time wisely and precache the DNS lookups -->
<link rel="dns-prefetch" href="//eiremedia.co">
<link rel="dns-prefetch" href="//u-n-i.co">
<link rel="dns-prefetch" href="//iwantaneff.in">
<link rel="dns-prefetch" href="//higg.in">
<link rel="dns-prefetch" href="//pinboard.in">
<link rel="dns-prefetch" href="//twitter.com">
<link rel="dns-prefetch" href="//r3versin.com">
<!-- Give your visitors more options regarding which RSS Feed they want. There doesn't have to be just ONE RSS Feed ;) -->
<link rel="alternate" type="application/rss+xml" title="Edan's Blog RSS Feed" href="http://edanhewitt.com/blog/feed/"/>
<link rel="alternate" type="application/rss+xml" title="Edan's Tumblr" href="http://edanhewitt.tumblr.com/rss"/>
<link rel="alternate" type="application/rss+xml" title="Edan's Twitter" href="https://twitter.com/statuses/user_timeline/edanhewitt.rss"/>
<link rel="alternate" type="application/rss+xml" title="Reverse The Web RSS Feed" href="http://r3versin.com/blog/feed/"/>
<link rel="alternate" type="application/rss+xml" title="David Higgins' RSS Feed" href="http://higg.in/rss.xml"/>
<!-- Multiple (duplicate) versions of the page? Tell the search engines what version to use: -->
<link rel="canonical" href="http://r3versin.com/redux/">
<!-- A URL Shortener version of the page's URL goes here. Save your visitors a lot of time, and give them a short link. -->
<link rel="shortlink" href="http://goo.gl/2jVCE/">
<!-- Blank Favicon, because we're lazy -->
<!-- http://davidwalsh.name/blank-favicon -->
<link rel="icon" type="image/x-icon" href="data:image/x-icon;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQEAYAAABPYyMiAAAABmJLR0T///////8JWPfcAAAACXBIWXMAAABIAAAASABGyWs+AAAAF0lEQVRIx2NgGAWjYBSMglEwCkbBSAcACBAAAeaR9cIAAAAASUVORK5CYII="/>
<!-- Fallback favicon LINK for legacy browsers that don't support the DATA URI -->
<link rel="shortcut icon" type="image/x-icon" href="http://iwantaneff.in/favicon.ico" />
<link rel="shortcut icon" type="image/ico" href="http://iwantaneff.in/favicon.ico" />
<!--
Submit this humans.txt:
http://humanstxt.org/Im-human.html
Browse others' humans.txt
http://humanswhomade.com/
-->
<link rel="humans" href="http://iwantaneff.in/humans.txt" />
<!-- Facebook Graphic you want to use when sharing the link as a status: -->
<!-- You can use this PNG if you are tired of creating custom graphics for Facebook Open Graph HTML -->
<link rel="image_src" href="http://iwantaneff.in/facebook.ping" />
<!-- Best if you include these. Let Facebook know what text to show upon sharing the link: -->
<!-- https://developers.facebook.com/docs/opengraph/keyconcepts/ -->
<!-- You can use this PNG if you are tired of creating custom graphics for Facebook Open Graph HTML -->
<meta property="og:image" content="http://iwantaneff.in/facebook.ping" />
<meta property="og:title" content="The homepage of David Higgins, a Web Developer based in Dublin" />
<meta property="og:url" content="http://davidhiggins.me/" />
<meta property="og:site_name" content="The homepage of David Higgins" />
<!-- This meta data was taken from bowdenweb.com -->
<!-- Thanks to J. Albert Bowden for being so semantic! -->
<!-- https://twitter.com/#!/jalbertbowdenii -->
<meta name="google-site-verification" content="key-goes-here-000" />
<meta http-equiv="imagetoolbar" content="no" />
<meta http-equiv="MsThemeCompatible" content="no" />
<meta http-equiv="content-style-type" content="text/css" />
<meta http-equiv="content-script-type" content="text/javascript" />
<meta http-equiv="content-language" content="en-us" />
<link rel="schema.foaf" href="http://xmlns.com/foaf/0.1/" />
<link rel="meta" type="application/rdf+xml" title="FOAF" href="http://bowdenweb.com/social/xml/j.albert.bowden.ii.foaf.rdf" />
<link rel="contents" href="http://bowdenweb.com/sitemap.html" title="Main Contents" type="text/html" />
<link rel="start" href="http://bowdenweb.com/" title="Introduction Page" />
<link rel="copyright" href="http://creativecommons.org/licenses/by/3.0/" title="Copyright Statement" />
<link rel="license" href="http://creativecommons.org/licenses/by/3.0/" title="License Information" />
<link rel="author" href="mailto:david.higgins.tech@gmail.com" />
<link rel="index" type="text/html" href="http://r3versin.com/redux/index.html" />
<!-- Where else are you on the web? -->
<link rel="me" href="http://davidhiggins.me/" rel="home" />
<link rel="me" type="text/html" href="https://gplus.to/higgo/" />
<link rel="me" href="https://www.facebook.com/gold.account.needed.to.view" />
<link rel="me" href="https://twitter.com/_davidhiggins_" />
<link rel="me" href="http://higg.in/" />
<link rel="me" href="http://flavors.me/eire/" />
<link rel="me" href="http://delicious.com/0x0" />
<link rel="me" href="http://pinboard.in/u:em" />
<link rel="me" href="http://www.youtube.com/user/00x0000x" />
<link rel="meta" type="application/rdf+xml" title="FOAF" href="http://r3versin.com/redux/h5bp.rdf" /> <!-- VCard -->
<!-- Let potential crawlers know where the site's HQ is based. This doesn't have to be your home BTW. Just a company / agency HQ -->
<!-- Want to get your company's Coordinates from Google Maps? Open up scratchpad in Firefox and paste this in: -->
<!-- void(prompt('',gApplication.getMap().getCenter())); -->
<!-- Thank you Lifehacker -->
<!-- http://lifehacker.com/267361/google-mapstude?tag=software -->
<!-- Area 51, LOL: -->
<meta name="ICBM" content="37.235949080010755, -115.80939531326294" /> <!-- georul -->
<meta name="geo.position" content="37.235949080010755, -115.80939531326294" /> <!-- georul -->
<!-- The Dublin Core® Metadata Initiative -->
<link rel="schema.DC" href="http://www.purl.org/dc/elements/1.1/" />
<meta name="DC.title" lang="en-us" content="H5BP Redux" />
<meta name="DC.creator" content="David Higgins, Edan Hewitt" />
<meta name="DC.subject" lang="en-us" content="DCMI; Dublin Core Metadata Initiative; DC META Tags" />
<meta name="DC.description" lang="en-us" content="Examples of Dublin Core META Tags." />
<meta name="DC.publisher" content="Publisher here" />
<meta name="DC.contributor" content="DCMI Dublin Core Metadata Initiative" />
<meta name="DC.date" scheme="W3CDTF" content="2008-08-09" />
<meta name="DC.type" scheme="DCMIType" content="Text" />
<meta name="DC.format" scheme="IMT" content="text/html" />
<meta name="DC.identifier" content="/meta-tags/dublin/" />
<meta name="DC.source" content="/meta-tags/" />
<meta name="DC.language" scheme="RFC1766" content="en-us" />
<meta name="DC.relation" content="/meta-tags/" />
<meta name="DC.coverage" content="World" />
<meta name="DC.rights" content="/legal/terms-of-use.asp" />
<!-- Open ID -->
<link rel="openid.server" href="http://www.myopenid.com/server" />
<link rel="openid.delegate" href="http://yourid.myopenid.com/" />
<link rel="openid2.provider" href="http://www.myopenid.com/server" />
<link rel="openid2.local_id" href="http://h5bp.myopenid.com/" />
<link href="http://fonts.googleapis.com/css?family=Maven+Pro" rel="stylesheet" type="text/css">
<link href='http://fonts.googleapis.com/css?family=Advent+Pro:700' rel='stylesheet' type='text/css'>
<!-- Custom WebkitScrollbar -->
<link href="http://iwantaneff.in/custom.webkit.scrollbar.css" rel="stylesheet" type="text/css">
<!-- Cursor.css -->
<!-- http://trac.webkit.org/export/37902/trunk/WebCore/manual-tests/cursor.html -->
<link href="http://iwantaneff.in/cursor.css" rel="stylesheet" type="text/css">
<!-- Use the .htaccess and remove these lines to avoid edge case issues.
More info: h5bp.com/i/378 -->
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<!-- Mobile viewport optimized: h5bp.com/viewport -->
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/buttons.css">
<!--
holmes.css is useful for checking the quality of your code (up to W3C HTML5 standards),
nitpicking over ensuring markup is valid and semantic and accessility guidelines are met,
and when you are tasked to fix up and debug an old, OLD website.
It has a simple implementation and a mostly unobtrusive effect on your page.
Not recommended for live enviroments.
Remember too that these are just guidelines: if something is flagged but you can't change it for a good reason,
don't worry about it :) Also use a validator if you want to be 100% sure.
More Info: http://www.red-root.com/sandbox/holmes/
-->
<link rel="stylesheet" href="css/holmes.css">
<!--
Cabin helps your projects get going quicker by eliminating the need for you to write basic CSS styles yourself.
More Info: http://cabincss.com/
-->
<link rel="stylesheet" href="css/cabin.css">
<!-- More ideas for your <head> here: h5bp.com/d/head-Tips -->
<!--
All JavaScript at the bottom, except this Modernizr build.
Modernizr enables HTML5 elements & feature detects for optimal performance.
Create your own custom Modernizr build: www.modernizr.com/download/
-->
<script src="js/libs/modernizr-2.5.3.min.js"></script>
<link href="css/formalize.css" rel="stylesheet" type="text/css">
<!-- Uncomment to use LESSCSS -->
<!-- http://lesscss.org/ -->
<!--
<link rel="stylesheet/less" type="text/css" href="less/less.less">
<script src="less/less.js" type="text/javascript"></script>
-->
<style>
/* Mother effin brute force CSS reset... */
/* Always include after any other CSS */
* {
resize: none;
border: none;
outline: none;
text-decoration: none;
padding: 0px;
margin: 0px;
list-style-type: none;
}
</style>
<link href="http://iwantaneff.in/custom.webkit.scrollbar.css" rel="stylesheet" type="text/css">
<script>
(function() {
var s = document.createElement('script'), t = document.getElementsByTagName('script')[0];
s.type = 'text/javascript';
s.async = true;
s.src = 'http://api.flattr.com/js/0.6/load.js?mode=auto';
t.parentNode.insertBefore(s, t);
})();
</script>
</head>
<body>
<div class="wrap">
<h1>H5BP <span class="star"></span> REDUX</h1>
<h2>HTML5 Boilerplate, on steroids <img src="img/steroids.png" alt="steroids" /></h2>
<article>
<div class="sidebar">
<div class="btnBdr">
<a href="https://github.com/higgo/h5bp-redux/zipball/master"><span class="symbol">A&nbsp; </span>DOWNLOAD REDUX</a>
<a href="https://github.com/downloads/higgo/h5bp-redux/site-source-code.zip"><span class="symbol">A&nbsp; </span>DOWNLOAD SITE SOURCE</a>
<a href="#source"><span class="symbol">A&nbsp; </span>VIEW PAGE SOURCE</a>
</div></div>
<header>
<h3>Break it down <span>now</span></h3>
</header>
<pre>
<span class="symbol">c&nbsp; </span><span class="info">H5BP Redux has everything H5BP has, but with the following enhancements</span>
<ul class="list">
<li>More richer, and more <a href="http://www.youtube.com/watch?v=6gmP4nk0EOE" title="The Machine is Us/ing Us">semantic</a> &lt;HEAD&gt; tag elements.
<li><a href="http://www.red-root.com/sandbox/holmes/" title="holmes.css">Holmes</a> - Find out where you went wrong with your HTML.
<li><a href="http://cabincss.com/" title="cabin.css">Cabin.css</a> - Cabin helps your projects get going quicker by eliminating the need for you to write basic CSS styles yourself.
<li>Open non-site-specific links / foreign domains in a new window.
<li><a href="http://leaverou.github.com/prefixfree/" title="Break free from prefix hell">Prefix Free.</a> Lets you use only unprefixed CSS properties everywhere. It works behind the scenes, adding the current browser’s prefix to any CSS code, only when it’s needed.
<li><a href="http://css3pie.com/" title="CSS3 decorations for IE OMG">PIE</a>. PIE makes Internet Explorer 6-9 capable of rendering several of the most useful CSS3 decoration features. Note: the path to PIE.htc must be relative to the HTML page, not the css!
<li><a href="http://iwantaneff.in/custom.webkit.scrollbar.css" title="Hotlink friendly">Custom webkit scrollbars.</a>
<li><a href="https://github.com/nathansmith/formalize" title="Teach your forms some manners">Formalize.</a> We've all been there. You are nearly done with a beautiful site design, only to arrive at the task we all dread – form styling. Depending on operating system and browser, default form elements can look okay or horribly disfigured.
<li><a href="http://iwantaneff.in/cursor.css" title="For making web apps">Custom Cursors. (cursor.css)</a> Custom CSS-powered cursors you can use in your page.
<li>Shrinkr. A tool that lets you minify all your JS &amp; CSS files really quickly via drag and drop. New - Windows machine only :(.
<li><a href="http://pnggauntlet.com/">PNG Gauntlet.</a> A tool that optimizes all your PNG files with ease. A (Windows) GUI alternative to PNGCrush.
<li><a href="http://lesscss.org/">Less CSS.</a> LESS extends CSS with dynamic behavior such as variables, mixins, operations and functions.
<li><a href="https://github.com/sirbrad/h5bp-ui">H5BP UI.</a> A bootstrap-like framework to get your project off the ground, based on H5BP (Utility)
<li><a href="http://microformats.org/code/hcard/creator">Hidden Microformats.</a> Microformatted HTML is buried in the source, and hidden from view with CSS. Microformats give an extra semantic layer on top of a site.
<li><a href="http://higgins.s3.amazonaws.com/shrinkr.rar">Shrinkr</a>. A tool that automatically compresses CSS, and JS, via drag and drop. Drop your project's folder into the window, and it minifies everything. (Windows only. Java Required to run)
</ul>
</pre>
<header>
<h3>Explain (some of) these <span>now</span></h3>
</header>
<pre>
<span class="symbol">c&nbsp; </span><span class="info">More richer, and more <a href="http://www.youtube.com/watch?v=6gmP4nk0EOE" title="The Machine is Us/ing Us"> &lt;HEAD&gt;</a> tag elements:</span>
Make your site more crawl-able with these ultra jam packed <a href="http://www.youtube.com/watch?v=6gmP4nk0EOE" title="The Machine is Us/ing Us">semantic</a> &lt;HEAD&gt; tag elements. Use the <a href="http://www.w3.org/2003/12/semantic-extractor.html" title="W3C's Semantic Data Extractor">W3C's Semantic Data Extractor</a> to see how semantic your site is. Check the source-code of this page for a commented breakdown of what the elements mean. Caution: lots of &lt;META&gt;, and &lt;LINK&gt; tags! I agree this can at times seem like cruft, but do believe me when I say this version of H5BP is delete key friendly.
</pre>
<pre>
<span class="symbol">c&nbsp; </span><span class="info">Open non-site-specific links / foreign domains in a new window</ul></span>
A jQuery script that opens all links on the page in a new window (providing the domain for that link is different). A script I've been using since jQuery's inception. It's best you keep visitors on your page, so they don't wander off into <i>teh internetz</i> and forget your page / site.
<pre>
<code>
$(document).ready(function(){
$('a').each(function() {
var a = new RegExp('/' + window.location.host + '/');
if(!a.test(this.href)) {
$(this).click(function(event) {
event.preventDefault();
event.stopPropagation();
window.open(this.href, '_blank');
});
}
});
})
</code>
</pre>
</pre>
<pre>
<span class="symbol">c&nbsp; </span><span class="info">Custom webkit scrollbars</span>
Webkit browsers have a little known CSS feature that allows you to customize the look and feel of the browser's scrollbar. David uses this in <a href="http://davidhiggins.me/" title="All of David Higgins's sites">all his sites</a>, and he thinks you should too. The file we're going to be using is <a href="http://iwantaneff.in/custom.webkit.scrollbar.css" title="Hotlink friendly">located here</a>. Don't worry, you can hotlink to this, as it's very small in size, plus it's hosted via <a href="http://www.cloudflare.com/features-cdn">Cloudflare's CDN</a> (Content Delivery Network).
<pre>
<code>
/* Feel free to hotlink to this */
/* That's what it's here for? */
::-webkit-scrollbar {
margin-right: 5px;
background-color: #eee;
width: 12px;
}
::-webkit-scrollbar-track {
-webit-box-shadow: 0 0 2px #ccc;
box-shadow: 0 0 2px #ccc;
}
::-webkit-scrollbar-thumb {
border: 1px #eee solid;
border-radius: 12px;
background: #777;
-webit-box-shadow: 0 0 8px #555 inset;
box-shadow: 0 0 8px #555 inset;
-webit-transition: all .3s ease-out;
transition: all .3s ease-out;
}
::-webkit-scrollbar-thumb:window-inactive {
background: #bbb;
box-shadow: 0 0 8px #999 inset;
}
::-webkit-scrollbar-thumb:hover { background: #999 }
</code>
</pre>
</pre>
<pre>
<span class="symbol">c&nbsp; </span><span class="info">Custom cursors (cursor.css)</span>
Did you know CSS has <i>a vast number</i> of options regarding cursors you can use on your HTML5 elements? You might want to visit <a href="http://trac.webkit.org/export/37902/trunk/WebCore/manual-tests/cursor.html" title="hotlink friendly">this page</a> for live demos of all the cursors you can use. Example:
<div style="background: none repeat scroll 0% 0% #201e1c; height: 70px; line-height: 70px; text-align:center;" class="crosshair">Crosshair</div>
<div style="background: none repeat scroll 0% 0% #201e1c; height: 70px; line-height: 70px; text-align:center;" class="move">Move</div>
As ever, you can always hotlink to our <a href="http://iwantaneff.in/cursor.css" title="hotlink friendly">cursor.css</a> file which is hosted by <a href="http://www.cloudflare.com/features-cdn">Cloudflare's CDN</a> (Content Delivery Network)
</pre>
<pre>
<span class="symbol">c&nbsp; </span><span class="info">More information</span>
The author of Redux is very well aware that Paul Irish, and Divya, <i>et al</i> would never accept this as a pull request on the official H5BP Github repo. It's a bit of fun, and it should be always treated as such. It does not set out to claim betterment over the original. In-fact, we leave nothing out of the original. Our Redux version builds on top of an existing project. Redux also serves as an educational tool; whereby it lets developers know of the <i>other</i> possibilities available for a framework.
Like us, tweet us, Flattr us, +1 Us. Ooh yeah please, do that, it will make us very happy. Do it! Do it now!
<div class="social"></div>
</pre>
<pre>
<span class="symbol">c&nbsp; </span><span class="info">Change-log</span>
<ul class="list">
<li>PNG Gauntlet added
<li>Tidied up the &lt;META&gt; tag elements
<li>Added LESSCSS. Thanks <a href="http://aaunel.com">Aaunel</a>
<li>Added Shrinkr
<li>Changed this page's styling / layout. Loads of fixes done. Also now based on H5BP Redux!</ul>
</pre>
<div class="clear"></div>
</article>
<article>
<header>
<h3>Brought to you by the following <span>people</span></h3>
</header>
<div class="download production with-hover">
<a href="https://twitter.com/_davidhiggins_" title="David Higgin on Twitter"></a>
<h4><span>David Higgins</span></h4>
<p>Web developer</p>
<div class="tweet-icon"></div>
</div>
<div class="download development with-hover">
<a href="https://twitter.com/edanhewitt" title="Edan Hewitt on Twitter"></a>
<h4><span>Edan Hewitt</span></h4>
<p>Open Web Evangelist</p>
<div class="tweet-icon"></div>
</div>
<div class="download development with-hover last">
<a href="http://twitter.com/jalbertbowdenii" title="J. Albert Bowden on Twitter"></a>
<h4><span>J. Albert Bowden</span></h4>
<p>Head Tag Closer</p>
<div class="tweet-icon"></div>
</div>
<div class="clear"></div>
</article>
</div>
<footer>
<div class="wrap">
<article>
<header><h3>Suggest things!</h3></header>
<form method="post" action="email.php" class="suggest">
<fieldset>
<ol>
<li>
<input type="text" name="first_name" id="name" class="cf" placeholder="What's your name?">
</li>
<li>
<input type="text" name="email" id="email" class="cf" placeholder="And your email?">
</li>
<li>
<textarea name="comments" id="message" placeholder="What do you think this needs?"></textarea>
</li>
<li>
<input type="submit" id="submit" value="Send!">
</li>
</ol>
</fieldset>
</form>
</article>
<div class="clear"></div>
</div>
</footer>
<!-- hCard // http://microformats.org/wiki/hcard -->
<div id="hcard-David-Higgins" class="vcard">
<img style="float:left; margin-right:4px" src="http://isharefil.es/HhUn/david-higgins-html5.jpg" alt="photo of David Higgins" class="photo"/>
<a class="url fn n" href="http://higg.in/">
<span class="given-name">David Higgins</span>
<span class="additional-name"></span>
<span class="family-name"></span>
</a>
<div class="org">Eire Media</div>
<div class="adr">
<span class="locality">Dublin</span>
<span class="country-name">Ireland</span>
</div>
<div class="tel">+353862202839</div>
</div>
<div class="fl">
<div class="tweet_button" onmouseover="s(this,0,21)" onmouseout="s(this,0,0)" onmousedown="s(this,0,42)" onclick="do_the_twitter_dance();"></div>
<div class="buffer_button" onmouseover="s(this,0,21)" onmouseout="s(this,0,0)" onmousedown="s(this,0,42)" onclick="do_the_buffer_dance();"></div>
<div class="fork_button" onmouseover="s(this,0,21)" onmouseout="s(this,0,0)" onmousedown="s(this,0,42)" onclick="do_the_fork_dance();"></div>
</div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="js/libs/jquery-1.7.2.min.js"><\/script>')</script>
<script src="js/jquery.formalize.min.js"></script>
<script src="js/jquery.addsocial.js"></script>
<script src="js/jquery.ba-hashchange.min.js"></script>
<script src="js/init.js"></script>
<script src="https://apis.google.com/js/plusone.js"></script>
<script src="http://stats.higg.in/?js"></script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment