1 files changed, 73 insertions, 67 deletions
diff --git a/docs/index.html b/docs/index.html
index 4e796f5..bffaa88 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -9,72 +9,78 @@
   <body>
   <h1>GNU Taler documentation</h1>
   This page is an overview of all documentation resources for GNU Taler.
-  <ul> 
-    <li>
-      <h3>RESTful API</h3>
-      <ul>
-        <li>
-          <a href="https://docs.taler.net/api/index.html">html</a>
-        </li>
-      </ul>
-    </li>
-    <li>
-      <h3>Exchange</h3>
-      <ul>
-        <li><a href="https://docs.taler.net/exchange/html/index.html">html</a></li>
-        <li><a href="https://docs.taler.net/exchange/pdf/taler-exchange.pdf">pdf</a></li>
-      </ul>
-    </li>
-    <li>
-      <h3>Merchant backend</h3>
-      <ul>
-        <li><a href="https://docs.taler.net/merchant/backend/html/manual.html">html</a></li>
-        <li><a href="https://docs.taler.net/merchant/backend/pdf/manual.pdf">pdf</a></li>
-      </ul>
-    </li>
-    <li>
-      <h3>Merchant frontend</h3>
-      <ul>
-        <li>
-          <h4>Python</h4>
-          <ul>
-            <li><a href="https://docs.taler.net/merchant/frontend/python/html/tutorial.html">html</a></li>
-            <li><a href="https://docs.taler.net/merchant/frontend/python/pdf/tutorial.pdf">pdf</a></li>
-          </ul>
-        </li>
-        <li>
-          <h4>PHP</h4>
-          <ul>
-            <li><a href="https://docs.taler.net/merchant/frontend/php/html/tutorial.html">html</a></li>
-            <li><a href="https://docs.taler.net/merchant/frontend/php/pdf/tutorial.pdf">pdf</a></li>
-          </ul>
-        </li>
-      </ul>
-    </li>
-    <li>
-      <h3>Onboarding</h3>
-      <ul>
-        <li><a href="https://docs.taler.net/onboarding/html/onboarding.html">html</a></li>
-        <li><a href="https://docs.taler.net/onboarding/pdf/onboarding.pdf">pdf</a></li>
-      </ul>
-    </li>
-    <li>
-      <h3>Doxygen</h3>
-      <ul>
-        <li>
-          <h3>Exchange</h3>
-          <ul>
-            <li><a href="https://docs.taler.net/code/exchange/index.html">html</a></li>
-          </ul>
-        </li>
-        <li>
-          <h3>Merchant backend</h3>
-          <ul>
-            <li><a href="https://docs.taler.net/code/merchant/index.html">html</a></li>
-          </ul>
-        </li>
-      </ul>
-    </li>
-  </ul> 
+
+  <div class="pure-g linkrow">
+    <div class="pure-u-1-3">
+    <a href="https://docs.taler.net/code/merchant/index.html">
+    <img src="icon-backend.svg" height=60>
+    <h3>Merchant backend</h3>
+    </a>
+    Tutorial and manual for operating a merchant.
+    Also available as <a href="https://docs.taler.net/merchant/backend/pdf/manual.pdf">PDF</a>.
+    </div>
+
+    <div class="pure-u-1-3">
+    <a href="https://docs.taler.net/merchant/frontend/python/html/tutorial.html">
+    <img src="icon-market.svg" height=60>
+    <h3>Merchant frontend (Python)</h3>
+    </a>
+    Tutorial for building a merchant frontend in Python.
+    </div>
+
+    <div class="pure-u-1-3">
+    <a href="https://docs.taler.net/merchant/frontend/php/html/tutorial.html">
+    <img src="icon-market.svg" height=60>
+    <h3>Merchant frontend (PHP)</h3>
+    </a>
+    Tutorial for building a merchant frontend in PHP.
+    </div>
+  </div>
+
+  <div class="pure-g linkrow">
+    <div class="pure-u-1-3">
+    <a href="https://docs.taler.net/exchange/html/index.html">
+    <img src="icon-exchange.svg" height=60>
+    <h3>Exchange</h3>
+    </a>
+    Operator's manual for the GNU Taler exchange.
+    </div>
+    <div class="pure-u-1-3">
+    <a href="https://docs.taler.net/api/index.html">
+    <img src="icon-api.svg" height=60>
+    <h3>HTTP API</h3>
+    </a>
+    Reference for the HTTP-based API for Taler components.
+    </div>
+    <div class="pure-u-1-3">
+    <a href="https://docs.taler.net/onboarding/html/onboarding.html">
+    <img src="icon-developers.svg" height=60>
+    <h3>Onboarding</h3>
+    </a>
+    Description of our taler.net setup and how to contribute.
+    </div>
+  </div>
+
+  <div class="pure-g linkrow">
+    <div class="pure-u-1-3">
+    <a href="https://docs.taler.net/api/index.html">
+    <img src="icon-code.svg" height=60>
+    <h3>Code (Exchange)</h3>
+    </a>
+    Documented source code for the exchange.
+    </div>
+
+    <div class="pure-u-1-3">
+    <a href="https://docs.taler.net/api/index.html">
+    <img src="icon-code.svg" height=60>
+    <h3>Code (Merchant backend)</h3>
+    </a>
+    Documented source code for the exchange.
+    </div>
+  </div>
+
+
+  <hr />
+  <a href="icons-credit.html">Icons by The Noun Project.</a>
   </body>
 </html>