Home landing page (#4178)

* Home entry point (basics)

* WIP store for web

* Add DappUrlInput component

* Updated tests

* WIP store update

* Adjust styling

* Add home tab

* Collapse first/last without extra divs

* Navigation actually navigates

* styling

* Encoding of ethlink.io URLs

* encodedUrl setup

* base58 encoded URLs

* Added decoding, updated tests to Parity-compliant

* Base32 (synced with Rust implementation via tests)

* Split URL into 63 character chunks

* Fix store test

* Cleanups

* s/ethlink/dapplink/

* Display app navigation & histroy

* Start on /accounts (for now, until expanded fully)

* Update tests

* ethlink.io -> web3.site

* Basic list layout

* Store history on navigation

* Show Accounts & Dapps

* Add skeleton for DappIcon (WIP)

* DappIcon WIP

* DappIcon in place

* Split into maneable sub-components

* WIP

* Tests for views/Home

* Swap default entry-point to /home

* Expose registry.get via lookupMeta

* Add getEntry interface, fix instance retrieval (with tests)

* Add news display component

* Add tests for added contracts/registry methods

* Fix GHH test refactoring

* render news via SectionList

* News items store directly

* Images

* News & Urls has new layout

* Convert remainder

* First run-through of MVP for SectionList

* Update tests

* Deploycontract should not override global p styles

* Allow styles overrides for head & body

* Adjust layout styling

* revert Container>flex

* Adjust sizes of history items

* Cleanups

* HistoryStore for tracking relevant routes

* Default route is still /accounts

* Fix tests

* Update 2015-2017

* Add lookupMeta & tests

* Add getEntry & tests

* Split Dapp icon into ui/DappIcon

* Update copyright dates

* Encoding for *.web3.site urls

* Dapp history retrieval

* Grow to only 40% on hover

* Update description

* Add DappUrlInput component

* Update Web views with store

* Update spec description

* Update spec description

* edited url does not allow in-place store edits

* Use /web/<hash> urls for iframe

* Removed (now) unused _list.css

* Mistamtched merge fixed

* Tab split (WIP)

* Split Tab component

* Update tests after merge

* typo

* Remove background !important

* Set item width to parent

* Set width, remove overflow-x: hidden

* Align hover overlays

* Container defaults to some opacity

* Display history from listRecentDapps

* Override styles for a tags

* Open URLs in new window when extension is available

* Fix tests after update

* AccountCard width 100%

* Re-add opening correct url in tab

* Cleanup link rendering

* Remove hardcoded news URL

* pre-merge

* Extra padding at Home bottom (Pr grumble)

* Match js-vaults stretch

* s/Web Apps via URL/Web Apps/ (PR grumble)

* Store recent wallets (PR grumble)

* Simplify inline style matching (PR comment)

* Add store for new retrieval

* Add missing observer

* Auto-link based on account type

* Fix UI overlaps

* Extra spacing

* Only show account when accountInfo is available

* Align timestamp line-heights

* Fix tests

* Update tests

* Really fix failing test (check for Connect(Account))

js/src/ui/SectionList/sectionList.css

@@ -16,8 +16,8 @@
 */
 
 .section {
-  overflow-x: hidden;
   position: relative;
+  width: 100%;
 
   .overlay {
     background: rgba(0, 0, 0, 0.85);
@@ -33,7 +33,6 @@
   .row {
     display: flex;
     justify-content: center;
-    overflow-x: hidden;
 
     /* TODO: As per JS comments, the flex-base could be adjusted in the future to allow for */
     /* case where <> 3 columns are required should the need arrise from a UI pov. */
@@ -42,38 +41,28 @@
       cursor: pointer;
       display: flex;
       flex: 0 1 33.33%;
-      opacity: 0.75;
-      overflow-x: hidden;
+      max-width: 33.33%;
+      opacity: 0.85;
       padding: 0.25em;
       transition: all 0.75s cubic-bezier(0.23, 1, 0.32, 1);
 
-      /* TODO: The hover and no-hover states can be improved to not "just appear" */
-      &:not(:hover) {
-        & [data-hover="hide"] {
-        }
-
-        & [data-hover="show"] {
-          display: none;
-        }
-      }
-
       &:hover {
         opacity: 1;
         z-index: 100;
-
-        & [data-hover="hide"] {
-          display: none;
-        }
-
-        & [data-hover="show"] {
-        }
       }
+    }
 
-      &.stretch-on:hover {
-        flex: 0 0 50%;
-      }
+    &:hover {
+      .item {
+        &.stretchOn {
+          flex: 0 1 29%;
+          max-width: 29%;
 
-      &.stretch-off:hover {
+          &:hover {
+            flex: 0 0 42%;
+            max-width: 42%;
+          }
+        }
       }
     }
   }