From d77ee2c0e2ddafb25c43c2b6f10bf5118c9d45af Mon Sep 17 00:00:00 2001
From: moklick <info@moritzklack.com>
Date: Tue, 5 May 2020 13:13:49 +0200
Subject: [PATCH] chore(readme): add section

---
 README.md                 | 17 ++++++++++++++++-
 example/src/Rich/index.js |  2 +-
 2 files changed, 17 insertions(+), 2 deletions(-)

diff --git a/README.md b/README.md
index d9fd7d2c..83cdce7a 100644
--- a/README.md
+++ b/README.md
@@ -2,8 +2,9 @@
 
 # :ocean: React Flow
 
-React Flow is a library for building node-based graphs. You can easily implement custom node types and it comes with  plugins like a MiniMap and a Controls Panel. Check out the [demo](https://react-flow.netlify.com/) graph.
+React Flow is a library for building node-based graphs. You can easily implement custom node types and it comes with plugins like a mini-map and graph controls. You can check out the [examples](https://react-flow.netlify.com/) or read the [blog post](https://webkid.io/blog/react-flow-node-based-graph-library/) to get started.
 
+- [Key Features](#key-features)
 - [Installation](#installation)
 - [Usage](#usage)
 - [Props](#props)
@@ -19,6 +20,15 @@ React Flow is a library for building node-based graphs. You can easily implement
   - [Controls](#controls)
 - [Examples](#examples)
 
+# Key Features
+
+* **Easy to use:** Seamless zooming & panning behaviour and single and multi-selections of elements
+* **Customizable:** Different [node](#node-types--custom-nodes) and [edge types](#edge-types--custom-edges) and support for custom nodes and edges
+* **Fast rendering:** only elements that are in the view port are displayed
+* **Utils:** Snap-to-grid behaviour, background styles and graph [helper functions](#helper-functions)
+* **Plugin system:** [Mini map and graph controls](#plugins)
+* **Reliable**: Written in [Typescript](https://www.typescriptlang.org/) and tested with [cypress](https://www.cypress.io/)
+
 ## Installation
 
 ```
@@ -233,3 +243,8 @@ You can find all examples in the [example](example) folder or check out the live
 - [empty](https://react-flow.netlify.app/empty)
 - [inactive](https://react-flow.netlify.app/inactive)
 - [custom node](https://react-flow.netlify.app/custom-node)
+
+
+## Thanks!
+
+Special thanks to [Andy Lindemann](https://github.com/AndyLnd) for a lot of helpful contributions!
\ No newline at end of file
diff --git a/example/src/Rich/index.js b/example/src/Rich/index.js
index e7fea13d..0767dfc9 100644
--- a/example/src/Rich/index.js
+++ b/example/src/Rich/index.js
@@ -69,7 +69,7 @@ const RichGraph = () => {
       <button
         type="button"
         onClick={addRandomNode}
-        style={{ position: 'absolute', left: 15, top: 10, zIndex: 4 }}
+        style={{ position: 'absolute', right: 10, top: 30, zIndex: 4 }}
       >
         add node
       </button>