From abfc903c3fecc54485367879c9d78d5d9441d475 Mon Sep 17 00:00:00 2001
From: Dominic Masters <dominic@domsplace.com>
Date: Fri, 11 May 2018 20:47:30 +1000
Subject: [PATCH] Added page specific styles, adjusted typography slightly

---
 public/page/Page.jsx                |  6 +++++-
 public/page/home/Homepage.jsx       |  6 +++---
 public/styles/index.scss            |  3 +++
 public/styles/objects/title.scss    | 14 +++++++-------
 public/styles/pages/_home-page.scss | 17 +++++++++++++++++
 5 files changed, 35 insertions(+), 11 deletions(-)
 create mode 100644 public/styles/pages/_home-page.scss

diff --git a/public/page/Page.jsx b/public/page/Page.jsx
index d7dc4c3..f96f95c 100644
--- a/public/page/Page.jsx
+++ b/public/page/Page.jsx
@@ -30,8 +30,12 @@ export default class Page extends React.Component {
   }
 
   render() {
+    let clazzes = "c-page";
+
+    if(this.props.className) clazzes += " " + this.props.className;
+
     return (
-      <div className="c-page">
+      <div className={clazzes}>
         { this.props.children }
       </div>
     );
diff --git a/public/page/home/Homepage.jsx b/public/page/home/Homepage.jsx
index 64b393b..5084f73 100644
--- a/public/page/home/Homepage.jsx
+++ b/public/page/home/Homepage.jsx
@@ -30,10 +30,10 @@ import { Title, Subtitle } from './../../typography/Typography';
 
 export default function() {
   return (
-    <Page style="home-page">
-      <VideoSection full>
+    <Page style="home-page" className="p-home-page">
+      <VideoSection full mp4={require('./../../videos/about/programming/programming.mp4')} >
         <PageBoundary>
-          <FloatingContentBox position="middle right" size="medium" className="u-text-center">
+          <FloatingContentBox position="middle right" size="medium" className="u-text-center p-home-page__video-content">
             <Title>My Cool Page</Title>
             <Subtitle>Lorem ipsum dolor</Subtitle>
             <Button>Hello</Button>
diff --git a/public/styles/index.scss b/public/styles/index.scss
index 21e9acc..081b05b 100644
--- a/public/styles/index.scss
+++ b/public/styles/index.scss
@@ -68,6 +68,9 @@
 @import './components/_section.scss';
 @import './components/_video-section.scss';
 
+//Pages
+@import './pages/_home-page.scss';
+
 //Utilities
 @import './utilities/text-align.scss';
 
diff --git a/public/styles/objects/title.scss b/public/styles/objects/title.scss
index b58cb35..efdfdde 100644
--- a/public/styles/objects/title.scss
+++ b/public/styles/objects/title.scss
@@ -5,15 +5,15 @@
  *  Version:
  *    1.0.0 - 2018/05/11
  */
-.o-title {
-  font-size: 3em;
-  margin-bottom: 0.25em;
+$o-title--size: 3em;
+$o-subtitle--size: 1.25em;
 
-  + .o-subtitle {
-    margin-top: 0em;
-  }
+.o-title {
+  font-size: $o-title--size;
+  margin: 0.25em 0;
 }
 
 .o-subtitle {
-  font-size: 1.2em;
+  font-size: $o-subtitle--size;
+  margin: 0 0 0.5em 0;
 }
diff --git a/public/styles/pages/_home-page.scss b/public/styles/pages/_home-page.scss
new file mode 100644
index 0000000..99748fc
--- /dev/null
+++ b/public/styles/pages/_home-page.scss
@@ -0,0 +1,17 @@
+/*
+ *  Home Page
+ *    Styles that are homepage specific.
+ *
+ *  Dependencies:
+ *
+ *
+ *  Version:
+ *    1.0.0 - 2018/05/11
+ */
+
+.p-home-page {
+
+  &__video-content {
+    background: white;
+  }
+}