Adding bottom grey footer

1 files changed, 39 insertions, 0 deletions

diff --git a/theme/scss/io2013.scss b/theme/scss/io2013.scss
index c728cfb..1bab7b0 100644
--- a/theme/scss/io2013.scss
+++ b/theme/scss/io2013.scss
@@ -1,4 +1,5 @@
 @import "compass/css3/background-size";
+@import "compass/css3/box-sizing";
 
 @import "variables";
 
@@ -19,6 +20,31 @@ q, blockquote {
 
 slides > slide {
   color: $gray-4;
+  
+  $grayBarHeight: 90px;
+
+  // Grey bottom bar.
+  &:not(.nobackground) {
+    &:before {
+      background: none;
+      background-color: $gray-1;
+      height: $grayBarHeight;
+      left: 0;
+      width: 100%;
+      bottom: 0;
+    }
+    &:after {
+      background: url(../../images/google_developers_icon_128.png) no-repeat 0 0;
+      @include background-size($brand-small-icon-size);
+      background-position: $slide-left-right-padding 50%;
+      left: 0;
+      bottom: $grayBarHeight;
+      width: 100%;
+      @include box-sizing(border-box);
+      text-align: right;
+      padding-right: $slide-left-right-padding;
+    }
+  }
 
   &.title-slide {
     &:after {
@@ -48,4 +74,17 @@ slides > slide {
       }
     }
   }
+  
+  .source {
+    bottom: $grayBarHeight + 40;
+  }
+  
+  > article:only-child {
+    height: 88%
+  }
+  
+  > article:only-child > iframe {
+   height: 100%;
+  }
+  
 }
\ No newline at end of file