update docs and README

README.md

@@ -1,14 +1,20 @@
 <p align="center">
-<img src="https://cdn.rawgit.com/jenil/chota/gh-pages/logo.svg" />
+<img src="https://jenil.github.io/chota/logo.svg" />
-<br>
+<br><br>
 A really small CSS framework
 </p>
 
+<br>
+
+
 - ⚡️&nbsp; Super light-weight. Just 3kb (minified + gzipped).
-- ✅&nbsp; Good Semantics
+- ⛔️&nbsp; No preprocessor, just plug-n-play
 - 📐&nbsp; Magical 12 column grid
 - 🌈&nbsp; Easy to extended with CSS variables
 - 🎲&nbsp; Comes with a handful of components &amp; utilities
+- ✅&nbsp; Good Semantics
+
+<br>
 
 ### Get started
 
@@ -17,7 +23,7 @@ CDN:
 <link rel="stylesheet" href="https://unpkg.com/chota">
 ```
 
-npm:
+npm or yarn:
 ```bash
 npm install chota
 ```

docs/doc-styles.css

@@ -3,17 +3,6 @@
     flex-direction: column;
 }
 
-code {
-  background-color: #f7f7f7;
-  color: #c62424;
-  white-space: pre-wrap;
-  padding: 0.2em 0.4em;
-}
-
-pre code {
-  background: none;
-}
-
 .logo {
     flex: 1;
     flex-direction: column;
@@ -38,6 +27,13 @@ section {
     margin: 5rem auto;
 }
 
+#features ul {
+  list-style-type: none;
+  padding: 0;
+  font-size: 1.2em;
+  font-weight: 200;
+}
+
 .highlight, code { background-color: #f1f5f5; }
 .highlight .c { color: #93a1a1 } /* Comment */
 .highlight .err { color: #586e75 } /* Error */

docs/index.html

@@ -65,9 +65,10 @@
     --lightGrey-color: #ddd;
     --grid-maxWidth: 120rem;
     --grid-gutter: 1.5rem;
-    --font-family: -apple-system, BlinkMacSystemFont, Avenir, "Avenir Next", "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+    --font-family: "Helvetica Neue", sans-serif;
 }
 {% endhighlight %}
+<br>
     <p>To override the variables, just add them to your <code>:root</code> selector after importing <code>chota.css</code></p>
 {% highlight css %}
 @import url(chota.css)