Skip to content

Commit

Permalink
top bar almost there
Browse files Browse the repository at this point in the history
  • Loading branch information
alexbaldwin committed Mar 5, 2012
1 parent d7cae0e commit bb8f535
Show file tree
Hide file tree
Showing 3 changed files with 113 additions and 78 deletions.
76 changes: 57 additions & 19 deletions css/site-style.css
Expand Up @@ -52,28 +52,66 @@ p {
color:rgba(0,0,0,.6);
}

.hero {
background: url("../img/wood_pattern.png") repeat;
box-shadow: 0 1px 6px #888;
margin-bottom:40px;

.pitch {
background:#24322a;
margin-top:20px;
border-radius:4px 4px 0 0;
}

.hero .container {
background: url("../img/iphone.png") no-repeat;
background-position: top center;
min-height:200px;

.early {
border-radius:0 0 4px 4px;
background:#445c49;
border-top:1px solid black;
}

.early a {
margin:20px;
line-height:20px;
}

.early h3 {
margin:20px 0 20px 0;
line-height:40px;
color:#efefef;
font-weight:normal;
}



.pitch h1 {
margin-top:40px;
font-size:4.5em;
line-height:1.2em;
color:#efefef;
}
.hero h1 {
text-align:center;
margin-top:60px;
color:#fff;
text-shadow: 0 1px 2px #222;
font-size:62px;
line-height:72px;

.pitch p {
color: #749e7d;
margin:1em 0;
font-size:1.2em ;
line-height:1.6em;
}

.pitch img {
margin-top:20px;
}

.supplement {
background:#fff;
margin-top:20px;
}

.features img {
opacity:.3;
}

.features {
border-radius:4px 4px 0 0;
}

.supplement img {
margin:10px;
opacity:.5;
.cta {
border-top:1px solid black;
background:Red;
border-radius:0 0 4px 4px;
}
Binary file added img/screenshot.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
115 changes: 56 additions & 59 deletions index.html
Expand Up @@ -13,7 +13,6 @@

<!-- Le styles -->
<link href="css/bootstrap.css" rel="stylesheet">
<link href="css/bootstrap-responsive.css" rel="stylesheet">
<link href='http://fonts.googleapis.com/css?family=PT+Sans:400,700' rel='stylesheet' type='text/css'>
<link href="css/site-style.css" rel="stylesheet">
<link href="js/google-code-prettify/prettify.css" rel="stylesheet">
Expand Down Expand Up @@ -41,76 +40,74 @@
<img src="img/keen_logo.png" alt="Keen.io">
</div>
</header>

<div class="hero">
<div class="container">
<!-- Main hero unit for a primary marketing message or call to action -->
<div class="row">
<div class="span12">
<h1>Record every action your users take.</h1>
<div class="row pitch">
<div class="span6">
<h1>Record your user's actions.</h1>
<p>Put that data to work in the tools you already use, even Excel.</p>
<p>We give you the ability to collect and store all the event data generated by your users and get that data into any existing analysis tool. Analyze and optimize your app easily.</p>
</div>
<div class="span6">
<img src="img/screenshot.png" alt="Hero">
</div>


</div>
<div class="row early">
<div class="span12">
<h3 class="pull-left">Make your developer and data analyst's lives easier.</h3>
<a href="#cta" class="pull-right btn btn-large">Join Our Early Access Program</a>
</div>
</div>
</div>
</div>

<div class="container">
<div class="row">
<div class="span8 offset2">
<h2>Integrate your iOS application with ease.</h2>
<pre class="prettyprint linenums lang-cpp">
#import "KeenClient.h"
// Create your client.
KeenClient *client = [KeenClient clientForProject:@"projectId" withAuthToken:@"auth"];
// Build your event properties as a dictionary.
NSDictionary *event = [NSDictionary dictionaryWithObject:@"gold_coins" forKey:@"item_name"];
//Add your event to a collection.
[client addEvent:event toCollection:@"purchases"];
// Send us your tracked events.
[client upload];</pre>
</div>
</div>
<div class="row">
<div class="span8 offset2 cta">

<div class="container supplement">


<div class="row features">
<div class="span1"><img src="img/phone.png"></div>
<div class="span3">
<h3>Easy Integration</h3>
<p>Our iOS client library minimizes both battery and network usage for minimal impact on your
application users. We also recognize that every team and application is unique, so our system
inherits the vocabulary of your product team rather than forcing you and your team to start
using ours. </p>
<p><!--a class="btn" href="#">View details &raquo;</a--></p>
</div>
<div class="span1"><img src="img/database.png"></div>
<div class="span3">
<h3>Record everything</h3>
<p>Our hosted metrics system is capable of handling billions of your users' actions per month.
Finding usage patterns that drive revenue and optimizing your
application means you need to record and analyze all of your users' behavior.
We make that possible and affordable.</p>
<p><!--a class="btn" href="#">View details &raquo;</a--></p>
</div>
<div class="span1"><img src="img/search.png"></div>
<div class="span3">
<h3>Get the data you need</h3>
<p>Getting the right data you need to answer the questions you have today about your user
behavior is crucial to iterating on your application. Our user interface allows anyone to get
the deeply segmented data they want without using developer time to write queries.</p>
<p><!--a class="btn" href="#">View details &raquo;</a--></p>
</div>
</div>

<div class="row">
<div class="span12 cta">
<h2>Start collecting your data now.</h2>
<p>We are looking for iOS developers that want intimate knowledge about how their users use their application.</p>

<form action="/signup" method=post id="signup_form">
<input type="text" placeholder="E-mail" id="email" name="email"/><a class="btn btn-success btn-large" onclick="$('#signup_form').submit()">Sign up for early access &raquo;</a>
<div class="alert alert-error" style="margin-top:10px; width:350px;">Oops! Invalid email address. Please enter a valid one!</div>
<input type="text" placeholder="E-mail" id="email" class="span6" name="email"/><a class="btn btn-success btn-large" onclick="$('#signup_form').submit()">Sign up for early access &raquo;</a>
<br>
<br>
<p>We are looking for iOS developers that want intimate knowledge about how their users use their application.</p>
</form>
</div>
</div>

<hr />

<!-- Example row of columns -->
<div class="row supplement">
<div class="span1"><img src="img/phone.png"></div>
<div class="span3">
<h2>Easy Integration</h2>
<p>Our iOS client library minimizes both battery and network usage for minimal impact on your
application users. We also recognize that every team and application is unique, so our system
inherits the vocabulary of your product team rather than forcing you and your team to start
using ours. </p>
<p><!--a class="btn" href="#">View details &raquo;</a--></p>
</div>
<div class="span1"><img src="img/database.png"></div>
<div class="span3">
<h2>Record everything</h2>
<p>Our hosted metrics system is capable of handling billions of your users' actions per month.
Finding usage patterns that drive revenue and optimizing your
application means you need to record and analyze all of your users' behavior.
We make that possible and affordable.</p>
<p><!--a class="btn" href="#">View details &raquo;</a--></p>
</div>
<div class="span1"><img src="img/search.png"></div>
<div class="span3">
<h2>Get the data you need</h2>
<p>Getting the right data you need to answer the questions you have today about your user
behavior is crucial to iterating on your application. Our user interface allows anyone to get
the deeply segmented data they want without using developer time to write queries.</p>
<p><!--a class="btn" href="#">View details &raquo;</a--></p>
</div>
</div>
<!-- /container -->
</div>

Expand Down

0 comments on commit bb8f535

Please sign in to comment.