Add Logo to join flow standalone page.

Will need some css work, especially for small screens.

src/views/join/join.jsx

@@ -5,8 +5,21 @@ const ErrorBoundary = require('../../components/errorboundary/errorboundary.jsx'
 // Require this even though we don't use it because, without it, webpack runs out of memory...
 const Page = require('../../components/page/www/page.jsx'); // eslint-disable-line no-unused-vars
 
+require('./join.scss');
 const Register = () => (
     <ErrorBoundary>
+        <div className="join">
+            <a
+                aria-label="Scratch"
+                href="/"
+            >
+                <img
+                    className="logo"
+                    src="/images/logo_sm.png"
+                />
+            </a>
+
+        </div>
         <JoinModal
             isOpen
             key="scratch3registration"

src/views/join/join.scss

@@ -0,0 +1,29 @@
+@import "../../frameless";
+
+.join {
+    position: absolute;
+    z-index: 1000;
+    top: 12px;
+    left: 12px;
+    left: calc(25% - 76px);
+
+    .logo {
+      width: 76px;
+  }
+}
+
+@media #{$small} {
+    .join {
+        left: calc(50% - 38px);
+    }
+}
+@media #{$medium} {
+    .join {
+        left: calc(50% - 38px);
+    }
+}
+@media #{$intermediate} {
+    .join {
+        left: calc(50% - 38px);
+    }
+}