add /mobile

app/controllers/Main.scala

@@ -70,4 +70,10 @@ object Main extends LilaController {
       html.base.themepicker()
     }
   }
+
+  def mobile = Open { implicit ctx =>
+    fuccess {
+      html.site.mobile()
+    }
+  }
 }

app/views/site/mobile.scala.html

@@ -0,0 +1,46 @@
+@()(implicit ctx: Context)
+
+@base.layout(
+title = "Mobile",
+moreCss = cssTag("mobile.css")) {
+<div class="mobile content_box small_box">
+  <div class="right-side">
+    <img class="nexus5-playing" width="268" height="513" src="@staticUrl("images/mobile/nexus5-playing.png")" alt="Lichess mobile on nexus 5" />
+    <a class="download button" href="https://play.google.com/store/apps/details?id=org.lichess.mobileapp">
+      Download now for free
+    </a>
+  </div>
+  <div class="left-side">
+    <h1>Play chess everywhere</h1>
+    <a class="store" href="https://play.google.com/store/apps/details?id=org.lichess.mobileapp">
+      <img alt="Android app on Google Play"
+      src="https://developer.android.com/images/brand/en_app_rgb_wo_60.png" />
+    </a>
+    <h2>As good as lichess</h2>
+    <ul class="block">
+      <li>Challenge online players</li>
+      <li>Play Stockfish level 1 to 8</li>
+      <li>Login or play as Anonymous</li>
+      <li>Available in 80 languages!</li>
+    </ul>
+    <h2>As free as lichess</h2>
+    <ul class="block">
+      <li>Built for the love of chess, not money</li>
+      <li>Everybody gets <strong>all features for free</strong></li>
+      <li>Zero advertisement</li>
+      <li>Entirely <a href="https://github.com/veloce/lichobile">Open Source</a> as usual</li>
+    </ul>
+    <h2>Three modes included</h2>
+    <ul class="block">
+      <li>Real time with increment</li>
+      <li>Correspondence games</li>
+      <li>On The Board, offline</li>
+    </ul>
+    <p class="block">
+      Android 4.4 and 5+ support: <span class="good support">GOOD</span><br />
+      Android 4.1 and 4.2 support: <span class="partial support">PARTIAL</span><br />
+      The iOS app will land in early March 2015.
+    </p>
+  </div>
+</div>
+}

conf/routes

@@ -310,6 +310,7 @@ GET   /developers                      controllers.Main.developers
 GET   /embed                           controllers.Main.embed
 GET   /irc                             controllers.Main.irc
 GET   /themepicker                     controllers.Main.themepicker
+GET   /mobile                          controllers.Main.mobile
 
 # Map
 GET   /world-map                       controllers.WorldMap.index

public/stylesheets/mobile.css

@@ -0,0 +1,43 @@
+.mobile.content_box {
+  min-height: 400px;
+}
+.mobile .right-side {
+  float: right;
+  width: 264px;
+  text-align: center;
+}
+.mobile .right-side img {
+  margin: -50px 0 30px 0;
+}
+.mobile .left-side {
+  width: 245px;
+  text-align: center;
+}
+.mobile h1 {
+  font-size: 4em;
+}
+.mobile .store {
+  display: inline-block;
+  margin: 20px 0 0 20px;
+}
+.mobile .left-side h2 {
+  margin-top: 20px;
+  font-size: 1.5em;
+}
+.mobile .left-side .block {
+  text-align: left;
+  margin: 10px 0 20px 0;
+}
+.mobile .left-side li {
+  list-style: inside disc;
+}
+.mobile .support {
+  font-style: monospace;
+  font-weight: bold;
+}
+.mobile .support.good {
+  color: #759900;
+}
+.mobile .support.partial {
+  color: #dc322f;
+}