From 3085ec7a9bb6057e7e5df7ba7106c4fd33b1274c Mon Sep 17 00:00:00 2001
From: Jonathan Reinink <jonathan@reinink.ca>
Date: Mon, 21 Aug 2017 11:49:17 -0400
Subject: [PATCH] Rough in key benefits list on documentation home page.

---
 docs/source/_assets/less/markdown.less | 18 ++++++++++++++++++
 docs/source/index.md                   |  9 +++++++++
 2 files changed, 27 insertions(+)

diff --git a/docs/source/_assets/less/markdown.less b/docs/source/_assets/less/markdown.less
index c7a558b2c..12c0d3b55 100644
--- a/docs/source/_assets/less/markdown.less
+++ b/docs/source/_assets/less/markdown.less
@@ -67,4 +67,22 @@
     .mb-3;
     line-height: 1.75;
   }
+
+  ul, ol {
+    margin: 0 0 2em;
+    .text-dark-soft;
+  }
+
+  ul {
+    list-style: disc inside;
+  }
+
+  ol {
+    list-style: decimal inside;
+  }
+
+  li {
+    .my-2;
+    .text-dark-soft;
+  }
 }
diff --git a/docs/source/index.md b/docs/source/index.md
index d0bbcf9b2..a31ad3699 100644
--- a/docs/source/index.md
+++ b/docs/source/index.md
@@ -6,6 +6,15 @@ extends: _layouts.markdown
 
 Welcome to Tailwind CSS! Tailwind is a utility-first CSS framework designed for rapid UI development. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
 
+## Key benefits
+
+- Rapidly build beautiful front-end interfaces using ready-to-go utilty classes.
+- Developing in the browser has never been easier. Stop waiting for your build process.
+- Drastically reduce the amount of CSS you have to write.
+- Implement any design without it feeling like you've used a CSS framework.
+- Dynamically generate your own utilities. Tailwind has been designed for customization.
+- Generate comparible (if not smaller) CSS files.
+
 ## Quick example
 
 <div class="inline-block p-2 pb-4 bg-light border rounded box-shadow text-center">