Update readme and landing page

license

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2019 Rodrigo Pombo
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

readme.md

@@ -1,11 +1,24 @@
-# [Git History](https://githistory.xyz)
-
-Browse the history of any file from GitHub with style
-
 <div align="center">
 <a href="https://github.githistory.xyz/babel/babel/blob/master/packages/babel-core/test/browserify.js">
-<img alt="demo" src="https://user-images.githubusercontent.com/1911623/52311598-4581c600-2986-11e9-8c39-f1dfb7c13937.gif" />
+<img alt="demo" src="https://user-images.githubusercontent.com/1911623/52460615-f3899d80-2b49-11e9-8c21-06af4097a527.gif" />
 </a>
 </div>
 
+# [Git History](https://githistory.xyz)
+
+Quickly browse the history of any GitHub file:
+
+1. Replace `github.com` with `github.githistory.xyz` in any file url
+2. There's no step two
+
+[Try it](https://github.githistory.xyz/babel/babel/blob/master/packages/babel-core/test/browserify.js)
+
+You can also add a `Open in Git History` button to GitHub with the [Chrome](https://chrome.google.com/webstore/detail/github-history-browser-ex/laghnmifffncfonaoffcndocllegejnf) and [Firefox](https://addons.mozilla.org/es/firefox/addon/github-history/) extensions.
+
 > Follow [@pomber](https://twitter.com/pomber) for updates
+
+## License
+
+MIT
+
+This project is not affiliated, associated, authorized, endorsed by, or in any way officially connected with GitHub, or any of its subsidiaries or its affiliates.

src/app.js

@@ -1,6 +1,9 @@
 import React, { useState, useEffect } from "react";
 import History from "./history";
 import { getHistory, auth, isLoggedIn } from "./github";
+import demo from "./demo.gif";
+
+console.log(demo);
 
 export default function AppWrapper(props) {
   if (props.repo) {
@@ -18,7 +21,8 @@ function Center({ children }) {
         flexDirection: "column",
         alignItems: "center",
         justifyContent: "center",
-        height: "100%"
+        height: "100%",
+        padding: "0 40px"
       }}
     >
       {children}
@@ -32,8 +36,35 @@ function Landing() {
   }/babel/babel/blob/master/packages/babel-core/test/browserify.js`;
   return (
     <Center>
-      <p>Try something like: </p>
-      <a href={url}>{url}</a>
+      <img src={demo} alt="demo" style={{ width: 900, maxWidth: "100%" }} />
+      <h1>Git History</h1>
+      <div>
+        <p>
+          Quickly browse the history of any GitHub file:
+          <ol>
+            <li>
+              Replace <strong>github.com</strong> with{" "}
+              <strong>github.githistory.xyz</strong> in any file url
+            </li>
+            <li>There's no step two</li>
+          </ol>
+          <a href={url}>Try it</a>
+        </p>
+
+        <p>
+          You can also add a <strong>Open in Git History</strong> button to
+          GitHub with the{" "}
+          <a href="https://chrome.google.com/webstore/detail/github-history-browser-ex/laghnmifffncfonaoffcndocllegejnf">
+            Chrome
+          </a>{" "}
+          and{" "}
+          <a href="https://addons.mozilla.org/es/firefox/addon/github-history/">
+            Firefox
+          </a>{" "}
+          extensions.
+        </p>
+      </div>
+      <div style={{ height: "20%" }} />
     </Center>
   );
 }