skia.og: Update the home page to have a showcase of Skia capabilities.

BUG=skia:
NOTRY=true
DOCS_PREVIEW= https://skia.org/?cl=1353473007

Review URL: https://codereview.chromium.org/1353473007

diff --git a/site/index.md b/site/index.md
index 3d7e88d849aa9887e69747033712d94b960be793..bc69c569f256328654e83ebf091b55605285feb3 100644 (file)
--- a/site/index.md
+++ b/site/index.md
@@ -1,12 +1,5 @@
-Overview
-========
-
-<a href="https://fiddle.skia.org/c/40bca23ae5625f7812b30316f879ced1"><img style="margin: 0" src="https://fiddle.skia.org/i/40bca23ae5625f7812b30316f879ced1_raster.png"></a>
-
-> *Click the above image to see the code that generated it.*
-
-<br>
-<br>
+Skia Graphics Library
+=====================
 
 Skia is an open source 2D graphics library which provides common APIs that work
 across a variety of hardware and software platforms.  It serves as the graphics
@@ -18,6 +11,51 @@ under the BSD Free Software License.  While engineering of the core components
 is done by the Skia development team, we consider contributions from any
 source.
 
+Showcase
+--------
+
+Click on any image below to see the source code that generated the image.
+<table>
+  <tr><th>Shapes</th><th>Bézier Curves</th></tr>
+  <tr>
+    <td>
+      <a href="https://fiddle.skia.org/c/95552fd2a4b8acacc05a63825cca854e"><img src="https://fiddle.skia.org/i/95552fd2a4b8acacc05a63825cca854e_raster.png"></a>
+    </td>
+    <td>
+      <a href="https://fiddle.skia.org/c/79928f82141e6f76ae1ea30c41d80a17"><img src="https://fiddle.skia.org/i/79928f82141e6f76ae1ea30c41d80a17_raster.png"></a>
+    </td>
+  </tr>
+
+  <tr><th>Translations and Rotations</th><th>Text Rendering</th></tr>
+  <tr>
+    <td>
+      <a href="https://fiddle.skia.org/c/c6ba5c36dc535655a66c05f3149a54c3"><img src="https://fiddle.skia.org/i/c6ba5c36dc535655a66c05f3149a54c3_raster.png"></a>
+    </td>
+    <td>
+      <a href="https://fiddle.skia.org/c/ec367821b22171bdc66f36a2e73ee92b"><img src="https://fiddle.skia.org/i/ec367821b22171bdc66f36a2e73ee92b_raster.png"></a>
+    </td>
+  </tr>
+
+  <tr><th>Discrete Path Effects</th><th>Composed Path Effects</th></tr>
+  <tr>
+    <td>
+      <a href="https://fiddle.skia.org/c/297da5f57b71c91b5a3bab4db9673cc4"><img src="https://fiddle.skia.org/i/297da5f57b71c91b5a3bab4db9673cc4_raster.png" alt=""></a>
+    </td>
+    <td>
+      <a href="https://fiddle.skia.org/c/df5928f1f3173878e5f647a2dbb2d250"><img src="https://fiddle.skia.org/i/df5928f1f3173878e5f647a2dbb2d250_raster.png" alt=""></a>
+    </td>
+  </tr>
+  <tr><th>Sum Path Effects</th><th>Shaders</th></tr>
+  <tr>
+    <td>
+      <a href="https://fiddle.skia.org/c/2cc23c611102ba01616c775ebc4308d6"><img src="https://fiddle.skia.org/i/2cc23c611102ba01616c775ebc4308d6_raster.png" alt=""></a>
+    </td>
+    <td>
+      <a href="https://fiddle.skia.org/c/0261e010db41116bc1e1c045900e0dc3"> <img src="https://fiddle.skia.org/i/0261e010db41116bc1e1c045900e0dc3_raster.png"></a>
+    </td>
+  </tr>
+</table>
+
 Roadmap
 -------
 For a look at high level items we have on tap the next 6-12 months, view our