styling again

js/components/whitelabel/prize/app.js

@@ -15,15 +15,18 @@ let PrizeApp = React.createClass({
 
     render() {
         let header = null;
-        if (this.isActive('pieces')) {
-            header = null;
+        if (this.isActive('landing') || this.isActive('login') || this.isActive('signup')) {
+            header = <Hero />;
+        } else {
+            header = <Header />;
         }
 
         return (
-            <div className="wp">
-                <Hero />
+            <div className="ascribe-prize-app">
                 {header}
-                <RouteHandler />
+                <div className="wp">
+                    <RouteHandler />
+                </div>
                 <GlobalNotification />
                 <div id="modal" className="container"></div>
             </div>

js/components/whitelabel/prize/routes.js

@@ -11,6 +11,7 @@ import PrizeRegisterPiece from './components/register_piece';
 import PrizePieceList from './components/piece_list';
 import PieceContainer from '../../ascribe_detail/piece_container';
 import EditionContainer from '../../ascribe_detail/edition_container';
+import SettingsContainer from '../../../components/settings_container';
 
 import App from './app';
 import AppConstants from '../../../constants/application_constants';
@@ -30,6 +31,7 @@ function getRoutes(commonRoutes) {
             <Route name="pieces" path="collection" handler={PrizePieceList} />
             <Route name="piece" path="pieces/:pieceId" handler={PieceContainer} />
             <Route name="edition" path="editions/:editionId" handler={EditionContainer} />
+            <Route name="settings" path="settings" handler={SettingsContainer} />
         </Route>
     );
 }

sass/whitelabel/prize/index.scss

@@ -1 +1,6 @@
-@import 'landing'
+@import 'landing';
+
+.ascribe-prize-app {
+    border-radius: 0;
+    padding-top: 70px;
+}

sass/whitelabel/prize/landing.scss

@@ -2,25 +2,28 @@
     background-color: #FDFDFD;
 
     height: 100%;
-    width: 100%;
 
+    /* We need this, otherwise piece list will have a scrollbar */
+    overflow-y: hidden;
+}
+
+.hero {
     font-family: 'Nunito', sans-serif;
     font-weight: 300;
 
-    > .hero {
+    overflow: hidden;
+    text-align: center;
 
-        overflow: hidden;
-        text-align: center;
-
-        > img {
-            margin-top: 5em;
-            margin-bottom: 5em;
-        }
+    > img {
+        margin-top: 5em;
+        margin-bottom: 5em;
     }
 }
 
 .wp-landing-wrapper {
     text-align: center;
+    font-family: 'Nunito', sans-serif;
+    font-weight: 300;
 
     > .enter {
         margin-top: 2em;