Align with into and links to other parts (#90)

* Align with into and links to other parts

* Bump deps

docs/.vuepress/config.js

@@ -1,16 +1,26 @@
 module.exports = {
   base: '/ui/',
   title: 'polkadot-js/ui',
-  description: 'UI libraries and utilities in-use accross @polkadot projects',
+  description: 'UI utilities, libraries and React components in use accross @polkadot projects',
   markdown: {
     lineNumbers: true
   },
   themeConfig: {
     displayAllHeaders: true,
-    lastUpdated: 'Last Updated',
     nav: [
+      { text: 'Polkadot/Substrate Apps', link: 'https://polkadot.js.org/apps/' },
+      { text: 'Project family', link: 'https://polkadot.js.org/' },
+      {
+        text: 'Documentation',
+        items: [
+          { text: 'API Reference', link: 'https://polkadot.js.org/api/' },
+          { text: 'Utility Reference', link: 'https://polkadot.js.org/common/' },
+          { text: 'UI Libs Reference (this)', link: 'https://polkadot.js.org/ui/' },
+        ]
+      },
       { text: 'GitHub', link: 'https://github.com/polkadot-js/ui' }
     ],
+    search: false,
     sidebar: [
       ['/ui-identicon/', '@polkadot/ui-identicon'],
       ['/ui-keyring/', '@polkadot/ui-keyring'],

docs/.vuepress/styles/palette.styl

@@ -1 +1,9 @@
 $accentColor = #fd8824
+$textColor = #2c3e50
+
+.home .hero .description,
+.home .feature h2,
+.home .feature p {
+  color: $textColor
+  opacity: 0.75
+}

docs/README.md

@@ -1,6 +1,37 @@
-# Polkadot Javascript UI libraries
+---
+home: true
+heroText:
+tagline:
+# Bringing JavaScript to the Polkadot world.
+# actionText: Repository Overview
+# actionLink: /REPOS.md
+features:
+- title: Identicon
+  details: A flexible identity icon generator supporting a number of display styles based on theme.
+- title: Keyring
+  details: An extension to the base keyring that allows for additions such as browser storage.
+- title: Utilities
+  details: Utilities for formatting and working with settings inside any browser-based application.
 
-This is a collection of UI (React) libraries, utlities and classes that allows for easier use of the Polkadot JS infrstaructure inside your apps.
+footer: Apache-2 Licensed | Copyright © 2017-2019 polkadot-js authors and contributors
+---
+
+## Welcome
+
+This is a collection of UI (React) libraries, utlities and classes that allows for easier use of the Polkadot JS infrastructure inside your apps.
+
+::: tip Examples
+In a rush and just want examples? [Jump right in](ui-identicon/README.md) and get a handle the libraries in your projects.
+:::
+
+## Available packages
+
+This repository split up into a number of internal packages, namely -
+
+- [identicon](ui-identicon/README.md) Display of identity icons based on theme
+- [keyring](ui-keyring/README.md) A keyring with browser-specific extensions
+- [settings](ui-settings/README.md) Setting management and defaults
+- [util](ui-util/README.md) UI-specific utility functions
 
 ## The Polkadot Project