Permalink
Browse files

top bar almost there

  • Loading branch information...
1 parent d7cae0e commit bb8f535377ed08ff4399955a8f72bf067d1aab78 @alexbaldwin committed Mar 5, 2012
Showing with 113 additions and 78 deletions.
  1. +57 −19 css/site-style.css
  2. BIN img/screenshot.png
  3. +56 −59 index.html
View
@@ -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;
}
View
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
@@ -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">
@@ -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>

0 comments on commit bb8f535

Please sign in to comment.