Permalink
Browse files

Add Easy to Use and Made for YUI to landing page.

Includes more CSS fixups for mobile devices.
  • Loading branch information...
reid committed Aug 26, 2012
1 parent c2789fa commit cd8f1d1bfa5e9d92be96b1f07cf8fc6a9f438e85
Showing with 77 additions and 8 deletions.
  1. +22 −4 doc/yeti/assets/landing.css
  2. +54 −3 doc/yeti/index.mustache
  3. +1 −1 doc/yeti/partials/footer.mustache
@@ -33,7 +33,7 @@ h3 {
margin-top: 3%;
}
p {
- margin: 15px;
+ margin: 0 0 15px;
}
.yui3-button {
color: #444;
@@ -84,7 +84,7 @@ ul {
}
.divider {
- margin: 3.5em 0 1em;
+ padding: 1em 0 0;
position: relative;
text-align: center;
}
@@ -111,14 +111,32 @@ ul {
height: 1px;
}
+.left {
+ text-align: left;
+}
+
+.demo {
+ font-size: 60%;
+ background: #111;
+ color: #eee;
+ padding: 1em;
+ border: 1px solid #000;
+ overflow: scroll;
+}
+
@media all and (max-width: 899px) {
- .yui3-u-1-3 {
+ .yui3-u-1-3, .yui3-u-2-3 {
width: auto;
+ display: block;
}
- .yui3-u-1-3 div {
+ .yui3-u-1-3 div,
+ .yui3-u-2-3 div {
margin-left: auto;
margin-right: auto;
}
+ .demo {
+ display: none;
+ }
.cmd {
font-size: 100%;
}
View
@@ -21,6 +21,60 @@ Start using Yeti by example.
<div class="yui3-g">
+<div class="yui3-u-2-3">
+<div class="column-left left">
+
+<div class="divider">
+ <hr>
+ <h2>Easy to Use</h2>
+</div>
+
+<p>
+<strong>Yeti brings browser testing to the command line.</strong>
+One command gives you automated testing.</p>
+
+<pre class="demo"><code>$ npm install -g yeti
+$ yeti test/*.html
+Connected to http://localhost:9000
+ Agent connected: Chrome (22.0.1221.0) / Mac OS
+ Agent connected: Safari (6.0) / Mac OS
+✔ Testing started on Chrome (22.0.1221.0) / Mac OS, Safari (6.0) / Mac OS
+Testing... / 68% complete (15/22) 98.84 tests/sec 89% line coverage ✔ Agent completed: Chrome (22.0.1221.0) / Mac OS
+Testing... | 95% complete (21/22) 91.65 tests/sec 90% line coverage ✔ Agent completed: Safari (6.0) / Mac OS
+Testing... \ 100% complete (22/22) 91.60 tests/sec 90% line coverage
+504 tests passed! (11529ms)
+$</code></pre>
+
+</div>
+</div>
+
+<div class="yui3-u-1-3">
+<div class="column-right left">
+
+<div class="divider">
+ <hr>
+ <h2>Made for YUI</h2>
+</div>
+
+<p>Yeti is made to run <a href="http://yuilibrary.com/yuitest/">YUI Test</a> based test files.</p>
+
+<p>
+Built at Yahoo! by <a href="http://twitter.com/reid">@reid</a>,
+Yeti leverages <a href="http://nodejs.org">Node.js</a> and
+<a href="http://yuilibrary.com/">YUI</a> to make testing easier than ever before.
+</p>
+
+<p>Yeti was made to test the YUI project on its
+<a href="http://yuilibrary.com/yui/environments/">wide collection of Target Environments</a>.
+Adding the latest new device to your testing
+setup is as easy as visiting a web page.</p>
+</div>
+</div>
+
+</div>
+
+<div class="yui3-g">
+
<div class="yui3-u-1-3">
<div class="column-left">
@@ -31,7 +85,6 @@ Start using Yeti by example.
<p class="cmd"><code>npm install -g yeti</code></p>
<p><small>
-Requires <a href="http://nodejs.org">Node.js</a> v0.6.
<a href="quick-start/index.html#Installation">Other installation options.</a>
</small></p>
@@ -46,14 +99,12 @@ Requires <a href="http://nodejs.org">Node.js</a> v0.6.
<h2>Get Involved</h2>
</div>
-<p>
<ul>
<li><a href="http://yeti.cx/blog/">Yeti Blog</a></li>
<li><a href="http://github.com/yui/yeti">Yeti on GitHub</a></li>
<li><a href="http://yuilibrary.com/projects/yeti/newticket">Submit an issue</a></li>
<li><a href="quick-start/index.html#Develop-Yeti">Develop &amp; Contribute</a></li>
</ul>
-</p>
</div>
</div>
@@ -1,6 +1,6 @@
<style>
.ft {
- margin: 100px;
+ margin: 100px 10px;
font-size: 13px;
}
#doc .ft {

0 comments on commit cd8f1d1

Please sign in to comment.