From 556a903afa660e1a7a629e1c2bef533108e06e92 Mon Sep 17 00:00:00 2001
From: Dominic Masters <dominic@domsplace.com>
Date: Sat, 12 May 2018 20:57:09 +1000
Subject: [PATCH] Adjusted styles a bit more, fixed a scroll overflow bug

---
 public/page/PageBoundary.jsx        |  2 +-
 public/page/contact/ContactPage.jsx |  0
 public/page/home/Homepage.jsx       | 23 ++++++-----------------
 public/styles/components/_page.scss |  5 +++++
 public/styles/objects/_app.scss     |  2 +-
 5 files changed, 13 insertions(+), 19 deletions(-)
 create mode 100644 public/page/contact/ContactPage.jsx

diff --git a/public/page/PageBoundary.jsx b/public/page/PageBoundary.jsx
index 690f947..1fee1f6 100644
--- a/public/page/PageBoundary.jsx
+++ b/public/page/PageBoundary.jsx
@@ -25,7 +25,7 @@ import React from 'react';
 
 export default function(props) {
   return (
-    <div className="c-page__boundary">
+    <div className={"c-page__boundary" + (props.full ? " is-full" : "") }>
       { props.children }
     </div>
   );
diff --git a/public/page/contact/ContactPage.jsx b/public/page/contact/ContactPage.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/public/page/home/Homepage.jsx b/public/page/home/Homepage.jsx
index fac00ea..250deee 100644
--- a/public/page/home/Homepage.jsx
+++ b/public/page/home/Homepage.jsx
@@ -32,25 +32,14 @@ import { Title, Subtitle } from './../../typography/Typography';
 export default function() {
   return (
     <Page style="home-page" className="p-home-page">
-      <ImageSection
-        full
-        src={ require('./../../images/test/img_red.png') }
-        sources={[
-          { src: require('./../../images/test/320x320.png'), size: 320 },
-          { src: require('./../../images/test/320x320x2.png'), size: 320, scale: 2 },
-          { src: require('./../../images/test/640x640.png'), size: 640 },
-          { src: require('./../../images/test/1280x1280.png'), size: 640, scale: 2 },
-          { src: require('./../../images/test/1280x1280.png'), size: 1280 }
-        ]}
-      >
-        <PageBoundary fill>
-          <FloatingContentBox position="middle right" size="small" className="u-text-center p-home-page__video-content">
-            <Title>My Cool Page</Title>
-            <Subtitle>Lorem ipsum dolor</Subtitle>
-            <Button>Hello</Button>
+      <Section full>
+        <PageBoundary full>
+          <FloatingContentBox position="middle right" size="small" className="u-text-center ">
+            <Title>Development & Design</Title>
+            <Subtitle>I'm not good at either.</Subtitle>
           </FloatingContentBox>
         </PageBoundary>
-      </ImageSection>
+      </Section>
 
       <Section full>
         Lorem
diff --git a/public/styles/components/_page.scss b/public/styles/components/_page.scss
index 5dc7977..170de23 100644
--- a/public/styles/components/_page.scss
+++ b/public/styles/components/_page.scss
@@ -14,5 +14,10 @@
   &__boundary {
     max-width: $s-screen-boundary;
     margin: 0 auto;
+
+    &.is-full {
+      position: relative;
+      height: 100%;
+    }
   }
 }
diff --git a/public/styles/objects/_app.scss b/public/styles/objects/_app.scss
index 3f242eb..dcc220a 100644
--- a/public/styles/objects/_app.scss
+++ b/public/styles/objects/_app.scss
@@ -8,7 +8,7 @@
  *    1.0.0 - 2018/05/03
  */
 .o-app {
-  display: inline-block;//Fixes collapsing margins on children.
+  //display: inline-block;//Fixes collapsing margins on children.
   min-height: 100vh;
   width: 100%;