io2013 style updates

4 files changed, 87 insertions, 36 deletions

diff --git a/theme/scss/_base.scss b/theme/scss/_base.scss
index a5b99cb..50504db 100644
--- a/theme/scss/_base.scss
+++ b/theme/scss/_base.scss
@@ -11,6 +11,8 @@
 @import "compass/css3/transform";
 @import "compass/css3/transition";
 
+@import "variables";
+
 @mixin font-smoothing($val: antialiased) {
   -webkit-font-smoothing: $val;
   -moz-font-smoothing: $val;
diff --git a/theme/scss/_variables.scss b/theme/scss/_variables.scss
new file mode 100644
index 0000000..d07f907
--- /dev/null
+++ b/theme/scss/_variables.scss
@@ -0,0 +1,34 @@
+$social-tags: '';
+$brand-small-icon-size: 30px;
+
+$gray-1: #e6e6e6;
+$gray-2: #a9a9a9;
+$gray-3: #797979;
+$gray-4: #515151;
+
+$brand-blue: rgb(67, 135, 253);
+$brand-blue-secondary: #3c8ef3;
+$brand-blue-secondary2: #2a7cdf;
+
+$brand-red: rgb(244, 74, 63);
+$brand-red-secondary: #e0543e;
+$brand-red-secondary2: #d94d3a;
+
+$brand-yellow: rgb(255, 209, 77);
+$brand-yellow-secondary: #f9cc46;
+$brand-yellow-secondary2: #f6c000;
+
+$brand-green: rgb(13, 168, 97);
+$brand-green-secondary: #00a86d;
+$brand-green-secondary2: #009f5d;
+
+$slide-width: 900px;
+$slide-height: 700px;
+$slide-width-widescreen: 1100px;
+$slide-top-bottom-padding: 40px;
+$slide-left-right-padding: 60px;
+$slide-border-radius: 5px;
+
+$slide-tap-area-width: 100px;
+
+$article-content-top-padding: 45px;
diff --git a/theme/scss/default.scss b/theme/scss/default.scss
index f1e9816..b8d11b0 100644
--- a/theme/scss/default.scss
+++ b/theme/scss/default.scss
@@ -2,41 +2,6 @@
 @import "compass/css3/columns";
 @import "compass/css3/user-interface";
 
-$social-tags: '#yourhashtag';
-$brand-small-icon-size: 30px;
-
-$gray-1: #e6e6e6;
-$gray-2: #a9a9a9;
-$gray-3: #797979;
-$gray-4: #515151;
-
-$brand-blue: rgb(67, 135, 253);
-$brand-blue-secondary: #3c8ef3;
-$brand-blue-secondary2: #2a7cdf;
-
-$brand-red: rgb(244, 74, 63);
-$brand-red-secondary: #e0543e;
-$brand-red-secondary2: #d94d3a;
-
-$brand-yellow: rgb(255, 209, 77);
-$brand-yellow-secondary: #f9cc46;
-$brand-yellow-secondary2: #f6c000;
-
-$brand-green: rgb(13, 168, 97);
-$brand-green-secondary: #00a86d;
-$brand-green-secondary2: #009f5d;
-
-$slide-width: 900px;
-$slide-height: 700px;
-$slide-width-widescreen: 1100px;
-$slide-top-bottom-padding: 40px;
-$slide-left-right-padding: 60px;
-$slide-border-radius: 5px;
-
-$slide-tap-area-width: 100px;
-
-$article-content-top-padding: 45px;
-
 @mixin highlight-color($color: $brand-yellow) {
   -webkit-tap-highlight-color: $color;
   -moz-tap-highlight-color: $color;
@@ -51,7 +16,6 @@ $article-content-top-padding: 45px;
 }
 
 
-
 /**
  * Theme Styles
  */
diff --git a/theme/scss/io2013.scss b/theme/scss/io2013.scss
new file mode 100644
index 0000000..c728cfb
--- /dev/null
+++ b/theme/scss/io2013.scss
@@ -0,0 +1,51 @@
+@import "compass/css3/background-size";
+
+@import "variables";
+
+* {
+  line-height: 1.3;
+}
+
+h2 {
+  font-weight: bold;
+}
+h2, h3 {
+  color: $gray-4;
+}
+
+q, blockquote {
+  font-weight: bold;
+}
+
+slides > slide {
+  color: $gray-4;
+
+  &.title-slide {
+    &:after {
+      content: '';
+      background: url(../../images/io2013/google-io-lockup-1.png) no-repeat 100% 50%;
+      @include background-size(contain);
+      position: absolute;
+      bottom: $slide-top-bottom-padding + 40;
+      right: $slide-top-bottom-padding;
+      width: 100%;
+      height: 90px;
+    }
+
+    hgroup {
+      h1 {
+        font-weight: bold;
+        line-height: 1.1;
+      }
+      h2, p {
+        color: $gray-4;
+      }
+      h2 {
+        margin-top: 0.25em;
+      }
+      p {
+        margin-top: 3em;
+      }
+    }
+  }
+}
\ No newline at end of file