Add subtle branding to shared documents

app/scenes/Document/Document.js

@@ -23,6 +23,7 @@ import type { Revision } from 'types';
 import Document from 'models/Document';
 import Header from './components/Header';
 import DocumentMove from './components/DocumentMove';
+import Branding from './components/Branding';
 import ErrorBoundary from 'components/ErrorBoundary';
 import DocumentHistory from 'components/DocumentHistory';
 import LoadingPlaceholder from 'components/LoadingPlaceholder';
@@ -367,6 +368,7 @@ class DocumentScene extends React.Component<Props> {
         {isHistory && (
           <DocumentHistory revision={revision} document={document} />
         )}
+        {isShare && <Branding />}
       </ErrorBoundary>
     );
   }

app/scenes/Document/components/Branding.js

@@ -0,0 +1,35 @@
+// @flow
+import * as React from 'react';
+import styled from 'styled-components';
+import OutlineLogo from 'shared/components/OutlineLogo';
+
+function Branding() {
+  return (
+    <Link href={process.env.URL}>
+      <OutlineLogo />&nbsp;Outline
+    </Link>
+  );
+}
+
+const Link = styled.a`
+  position: fixed;
+  bottom: 0;
+  left: 0;
+
+  font-weight: 600;
+  font-size: 14px;
+  text-decoration: none;
+  border-top-right-radius: 2px;
+  color: ${props => props.theme.black};
+  display: flex;
+  align-items: center;
+  padding: 12px;
+  opacity: 0.8;
+
+  &:hover {
+    opacity: 1;
+    background: ${props => props.theme.smoke};
+  }
+`;
+
+export default Branding;

shared/components/OutlineLogo/index.js

@@ -0,0 +1,9 @@
+// @flow
+import * as React from 'react';
+import logo from './logo.png';
+
+function OutlineLogo() {
+  return <img src={logo} width={16} height={16} alt="Outline Logo" />;
+}
+
+export default OutlineLogo;