Skip to content

Instantly share code, notes, and snippets.

@roachhd
Created November 29, 2014 07:48
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 roachhd/01a5b0b918451d299606 to your computer and use it in GitHub Desktop.
Save roachhd/01a5b0b918451d299606 to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<!--[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]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<title>
Chimp Chomp Design | Design and Research Lab based in Surabaya, Indonesia
</title>
<meta name="description" content="Chimp Chomp is a design and research lab based in Surabaya, Indonesia. Powered by a troupe of hyper monkeys honed in multidisciplinary areas from design, computer science, photography, social science and cultural studies, our clients and collaborators range from independent initiatives to multi-national corporations and organisations.">
<meta name="generator" content="Bolt">
<link rel="canonical" href="http://chimpchomp.us/">
<link rel="stylesheet" href="http://chimpchomp.us//app/extensions/SimpleForms/assets/simpleforms.css" media="screen">
<link href='http://fonts.googleapis.com/css?family=Playfair+Display:400,700,400italic' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,300,600' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="http://chimpchomp.us/theme/chimpchomp/stylesheets/foundation.css">
<link rel="stylesheet" href="http://chimpchomp.us/theme/chimpchomp/stylesheets/app.css">
<script src="http://chimpchomp.us/theme/chimpchomp/javascripts/modernizr.foundation.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="http://chimpchomp.us/theme/chimpchomp/javascripts/jquery.foundation.topbar.js"></script>
<script src="http://chimpchomp.us/theme/chimpchomp/javascripts/jquery.flexslider-min.js"></script>
<script src="http://chimpchomp.us/theme/chimpchomp/javascripts/modernizr.custom.js"></script>
<script src="http://chimpchomp.us/theme/chimpchomp/javascripts/app.js"></script>
<script src="http://chimpchomp.us/theme/chimpchomp/javascripts/swipe.js"></script>
<script src="http://chimpchomp.us/theme/chimpchomp/javascripts/jquery.isotope.min.js"></script>
<script src="http://chimpchomp.us/theme/chimpchomp/javascripts/jquery.isotope.perfectmasonry.js"></script>
<script>
$(document).ready(function() {
var opt = {
layoutMode: 'perfectMasonry',
perfectMasonry: {
layout: 'vertical',
liquid: true, // Set layout as liquid (default: false)
columnWidth: 250,
rowHeight: 250,
minCols: 2, // Set min col count (default: 1)
maxCols: 5 // Set max col count (default: 9999)
}
};
// Set default isotope
$('#projectContainer').isotope(opt).smartresize();
$('#projectFilter a').click(function(){
var selector = $(this).attr('data-filter');
$('#projectContainer').isotope({ filter: selector });
return false;
});
});
</script>
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-GOOGLES-1', 'chimpchomp.us');
ga('send', 'pageview');
</script>
</head>
<!DOCTYPE html>
<!--[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]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<title>
Chimp Chomp Design | Design and Research Lab based in Surabaya, Indonesia
</title>
<meta name="description" content="Chimp Chomp is a design and research lab based in Surabaya, Indonesia. Powered by a troupe of hyper monkeys honed in multidisciplinary areas from design, computer science, photography, social science and cultural studies, our clients and collaborators range from independent initiatives to multi-national corporations and organisations.">
<meta name="generator" content="Bolt">
<link rel="canonical" href="http://chimpchomp.us/">
<link rel="stylesheet" href="http://chimpchomp.us//app/extensions/SimpleForms/assets/simpleforms.css" media="screen">
<link href='http://fonts.googleapis.com/css?family=Playfair+Display:400,700,400italic' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,300,600' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="http://chimpchomp.us/theme/chimpchomp/stylesheets/foundation.css">
<link rel="stylesheet" href="http://chimpchomp.us/theme/chimpchomp/stylesheets/app.css">
<script src="http://chimpchomp.us/theme/chimpchomp/javascripts/modernizr.foundation.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="http://chimpchomp.us/theme/chimpchomp/javascripts/jquery.foundation.topbar.js"></script>
<script src="http://chimpchomp.us/theme/chimpchomp/javascripts/jquery.flexslider-min.js"></script>
<script src="http://chimpchomp.us/theme/chimpchomp/javascripts/modernizr.custom.js"></script>
<script src="http://chimpchomp.us/theme/chimpchomp/javascripts/app.js"></script>
<script src="http://chimpchomp.us/theme/chimpchomp/javascripts/swipe.js"></script>
<script src="http://chimpchomp.us/theme/chimpchomp/javascripts/jquery.isotope.min.js"></script>
<script src="http://chimpchomp.us/theme/chimpchomp/javascripts/jquery.isotope.perfectmasonry.js"></script>
<script>
$(document).ready(function() {
var opt = {
layoutMode: 'perfectMasonry',
perfectMasonry: {
layout: 'vertical',
liquid: true, // Set layout as liquid (default: false)
columnWidth: 250,
rowHeight: 250,
minCols: 2, // Set min col count (default: 1)
maxCols: 5 // Set max col count (default: 9999)
}
};
// Set default isotope
$('#projectContainer').isotope(opt).smartresize();
$('#projectFilter a').click(function(){
var selector = $(this).attr('data-filter');
$('#projectContainer').isotope({ filter: selector });
return false;
});
});
</script>
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-GOOGLES-1', 'chimpchomp.us');
ga('send', 'pageview');
</script>
</head>
<body>
<div class="container">
<!-- Positioning the Top Bar -->
<div id="logo">
<a href="/">
<img src="http://chimpchomp.us/theme/chimpchomp/images/chimpchomplogo.jpg">
</a>
</div>
<nav class="top-bar">
<ul>
<li class="toggle-topbar"><a href="#"><span>Menu</span></a></li>
<li class="index-1 first active">
<a href="/" class='first'>
Home
</a>
</li>
<li class="index-2">
<a href="/projects" class=''>
Projects
</a>
</li>
<li class="index-3">
<a href="/oddsends" class=''>
Odds &amp; Ends
</a>
</li>
<li class="index-4">
<a href="/about" class=''>
About
</a>
</li>
<li class="index-5 last">
<a href="/contact" class='last'>
Contact
</a>
</li>
</ul>
</nav>
<!-- Header bar -->
<!-- End header -->
<!-- Main Page Content and Sidebar -->
<div class="row">
<!-- Main Blog Content -->
<div role="content">
<section class="home-projects">
<h3 class="home-header" id="latestprojects"><a href="/projects">Featured Projects</a></h3>
<article class="homeProjectThumb " id="projectThumb-1">
<div imageholder">
<a href="/project/korea">
<img src="http://chimpchomp.us/thumbs/350x350crop/korea/Korea-33.jpg">
</a>
</div>
<h3><a href="/project/korea">Korea</a></h3>
<p>All things pretty during our hedonist trip to Seoul, Korea</p>
</article>
<article class="homeProjectThumb " id="projectThumb-2">
<div imageholder">
<a href="/project/ayorek">
<img src="http://chimpchomp.us/thumbs/350x350crop/2013-08ayorek/ayorek-responsive.jpg">
</a>
</div>
<h3><a href="/project/ayorek">Ayorek</a></h3>
<p>Ayorek is a platform to record, connect, and enable the city and the people of Surabaya (Indonesia).</p>
</article>
<article class="homeProjectThumb " id="projectThumb-3">
<div imageholder">
<a href="/project/ha-giang">
<img src="http://chimpchomp.us/thumbs/350x350crop/hagiang/Ha%20Giang%20-10.jpg">
</a>
</div>
<h3><a href="/project/ha-giang">Ha Giang</a></h3>
<p>It is an interesting time in Ha Giang, a transition where a long standing solitude way of living is slowly adapting to modern convenience.</p>
</article>
<article class="homeProjectThumb col-last" id="projectThumb-4">
<div imageholder">
<a href="/project/c2o-library">
<img src="http://chimpchomp.us/thumbs/350x350crop/2013-08/RecordSaturday-1.jpg">
</a>
</div>
<h3><a href="/project/c2o-library">c2o library</a></h3>
<p>Founded in 2008 in Surabaya, C2O library & collabtive is an independent library and a collaborative space to learn, connect and create.</p>
</article>
</section>
<hr>
<section class="home-oddsends">
<h3 class="home-header"><a href="/oddsends">Odds & Ends</a></h3>
<article>
<h3 id="oddsendsTitle"><a href="/oddend/house-cleaning">House Cleaning</a></h3>
<a href="/categories/news">news</a> | 3.09.2013
</article>
<hr class="dotted">
</section>
<section class="home-snapshot">
<div id="snapshot-navigation">
<div id="snapshot-left-arrow">prev</div>/
<div id="snapshot-right-arrow">next</div>
</div>
<h3 class="home-header">Snapshot</h3>
<div id='slider' class='swipe'>
<div class='swipe-wrap'>
<div class="first ">
<a href="/project/korea"><img src="http://chimpchomp.us/thumbs/753x502crop/korea/Korea-8.jpg"></a>
</div>
<div class="">
<a href="/project/ha-giang"><img src="/thumbs/753x502crop/hagiang/Ha%20Giang%20-14.jpg"></a>
</div>
<div class="">
<a href="/project/turkey"><img src="/thumbs/753x502crop/Turkey%20Small/Turkey-23.jpg"></a>
</div>
<div class="">
<a href="/project/singapore"><img src="/thumbs/753x502crop/Singapore%20Small/Singapore-16.jpg"></a>
</div>
<div class="">
<a href="/project/ludruk"><img src="/thumbs/753x502crop/Ludruk%20Small/Ludruk-18.jpg"></a>
</div>
<div class="">
<a href="/project/2013-hasil-calendar"><img src="/thumbs/753x502crop/2012-11hasilcalendar/hasilcalendar-2012110612.jpg"></a>
</div>
<div class="">
<a href="/project/glass-meets-glass"><img src="/thumbs/753x502crop/MuseumWeb/Museum-17.jpg"></a>
</div>
<div class="">
<a href="/project/hanoi"><img src="/thumbs/753x502crop/HanoiWeb/Hanoi-8.jpg"></a>
</div>
<div class="">
<a href="/project/kiwi-new-zealand"><img src="/thumbs/753x502crop/KiwiWeb/Kiwi-11.jpg"></a>
</div>
<div class="">
<a href="/project/nuts-and-bolts"><img src="/thumbs/753x502crop/2011-11tokohasil/2012-07.jpg"></a>
</div>
<div class="">
<a href="/project/new-york"><img src="/thumbs/753x502crop/newyork/New%20York-17.jpg"></a>
</div>
<div class="">
<a href="/project/otik"><img src="/thumbs/753x502crop/2011-08otik/otik-05_coloured.jpg"></a>
</div>
<div class="last ">
<a href="/project/book-bake-sale"><img src="http://chimpchomp.us/thumbs/753x502crop/2011-04bookbake/Cookies-4.jpg"></a>
</div>
</div>
</div>
<script>
var elem = document.getElementById('slider');
var currentSlide, totalSlides;
window.mySwipe = new Swipe(elem, {
startSlide: 0,
speed: 400,
continuous: true,
disableScroll: false,
stopPropagation: false,
});
$('#snapshot-left-arrow').on('click', function() {
window.mySwipe.prev();
});
$('#snapshot-right-arrow').on('click', function() {
window.mySwipe.next();
});
</script>
</section>
<hr>
<section class="home-sideprojects">
<h3 class="home-header">Bananas Elsewhere</h3>
<div id="sideProjectContainer">
<div class="sideProjectThumb " id="sideProjectThumb-1">
<img src="http://chimpchomp.us/thumbs/450x450crop/2013-08ayorek/ayorek-responsive.jpg">
<a href="http://ayorek.org"><div class="sideProjectDetails" id="sideProjectDetails-1">
<div class="sideProjectCaption">
<h2>Ayorek</h2>
<p>Ayorek is a platform to record, connect, and enable the city and the people of Surabaya (Indonesia).</p>
</div>
</div></a>
</div>
<div class="sideProjectThumb " id="sideProjectThumb-2">
<img src="http://chimpchomp.us/thumbs/450x450crop/2013-08/RecordSaturday-1.jpg">
<a href="http://c2o-library.net"><div class="sideProjectDetails" id="sideProjectDetails-2">
<div class="sideProjectCaption">
<h2>c2o library</h2>
<p>Founded in 2008 in Surabaya, C2O library & collabtive is an independent library and a collaborative space to learn, connect and create.</p>
</div>
</div></a>
</div>
<div class="sideProjectThumb col-last" id="sideProjectThumb-3">
<img src="http://chimpchomp.us/thumbs/450x450crop/2013-09/wanderingtoes1.jpg">
<a href=""><div class="sideProjectDetails" id="sideProjectDetails-3">
<div class="sideProjectCaption">
<h2>Wandering Toes</h2>
<p>Exploring the city. Coming soon!</p>
</div>
</div></a>
</div>
</div>
</section>
<hr>
<section class="bottom-about">
<h3 class="home-header"><a href="/about">About</a></h3>
<article>
<p>Chimp Chomp is a design and research lab based in Surabaya, Indonesia. Powered by a couple of hyper monkeys honed in multidisciplinary areas from design, computer science, photography, social science and cultural studies, our clients and collaborators range from independent initiatives to multi-national corporations and organisations.</p>
</article>
</section>
<section class="bottom-contact">
<h3 class="home-header"><a href="/contact">Contact</a></h3>
<article>
<p>Project inquiry, job application, internship application?
<a href="http://chimpchomp.us/contact">This way please</a>.</p>
<p><strong>Chimp Chomp Design</strong><br />
Jl. Dr. Cipto 20 Surabaya 60264 Indonesia</p>
<p><strong>Email:</strong> we@chimpchomp.us<br />
<strong>Phone/WhatsApp:</strong> +62-818 0304 8070</p>
</article>
</section>
</div>
<!-- End Main Content -->
</div>
<!-- End Main Content and Sidebar -->
<!-- Footer -->
<footer class="row">
<div class="col-full">
<hr class="double"/>
<div>
<ul class="link-list">
<li class="index-1 first active">
<a href="/" class='first'>
Home
</a>
</li>
<li class="index-2">
<a href="/projects" class=''>
Projects
</a>
</li>
<li class="index-3">
<a href="/oddsends" class=''>
Odds &amp; Ends
</a>
</li>
<li class="index-4">
<a href="/about" class=''>
About
</a>
</li>
<li class="index-5 last">
<a href="/contact" class='last'>
Contact
</a>
</li>
</ul>
</div>
</footer>
<!-- End Footer -->
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment