Skip to content

Instantly share code, notes, and snippets.

@jpetto
Created May 1, 2014 21:15
Show Gist options
  • Select an option

  • Save jpetto/9303b6350f0f228d26a1 to your computer and use it in GitHub Desktop.

Select an option

Save jpetto/9303b6350f0f228d26a1 to your computer and use it in GitHub Desktop.
ASWM SP2014: Final starter
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>NY Times API Demo</title>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/pure/0.4.2/pure-min.css">
<style type="text/css">
html, body {
background: #94bbd4;
}
#page-wrapper {
width: 1000px;
margin: 20px auto;
padding: 20px;
background: #fff;
border-radius: 6px;
}
.api-data-list {
list-style-type: none;
padding: 0;
}
.api-data-list li {
padding: 20px;
}
.api-data-list li:nth-child(even) {
background: #f1f1f1;
}
.api-data-list a {
color: #d4597d;
}
</style>
</head>
<body>
<main role="main" id="page-wrapper" class="pure-g">
<header class="pure-u-5-5">
<h1>New York Times API Demo</h1>
</header>
<div id="articles-wrapper" class="pure-u-2-5">
<form action="" id="articles-form">
<input type="search" id="articles-search" name="articles-search">
<button type="submit" class="pure-button pure-button-primary">Find Articles</button>
</form>
<ul id="articles" class="api-data-list"></ul>
</div>
<div class="pure-u-1-5"></div>
<div id="movie-reviews-wrapper" class="pure-u-2-5">
<form action="" id="movie-reviews-form">
<input type="search" id="movie-reviews-search" name="movie-reviews-search">
<button type="submit" class="pure-button pure-button-primary">Find Movie Reviews</button>
</form>
<ul id="movie-reviews" class="api-data-list"></ul>
</div>
</main>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment