added fluent conf video to homepage

Author: ROYA TOCCHINI

assets/images/fluent-video-cover.jpg

@@ -35,14 +35,13 @@
     "index.html",
     ".travis.yml"
   ],
-  "_release": "51d9f7ea9f",
+  "_release": "a4d3b4eb01",
   "_resolution": {
     "type": "branch",
     "branch": "master",
-    "commit": "51d9f7ea9f5eca3de2c877fd5c855f6101879fd3"
+    "commit": "a4d3b4eb01a9c29b18fdfed2afba776de9a9ad64"
   },
   "_source": "git://github.com/the-gss/engine.git",
   "_target": "*",
-  "_originalSource": "gss",
-  "_direct": true
+  "_originalSource": "git://github.com/the-gss/engine.git"
 }

assets/images/oreilly-fluent-cover.jpg

@@ -1,6 +1,14 @@
 GSS Engine ChangeLog
 ====================
 
+## 1.0.2-beta (April 14th 2014)
+
+- VGL: `@grid-template` empty zones can be defined with `.`
+- VGL: added `in()` to `@grid-template`
+- VGL: added `h/v/top/right/bottom/left-gap()` to `@grid-template`
+
+VGL is still undocumented & under heavy dev.
+
 ## 1.0.1-beta (April 7th 2014)
 
 - VFL: **Point** support

bower_components/gss/.bower.json

@@ -1,4 +1,4 @@
-/* gss-engine - version 1.0.1-beta (2014-04-07) - http://gridstylesheets.org */
+/* gss-engine - version 1.0.2-beta (2014-04-16) - http://gridstylesheets.org */
 /**
  * Parts Copyright (C) 2011-2012, Alex Russell (slightlyoff@chromium.org)
  * Parts Copyright (C) Copyright (C) 1998-2000 Greg J. Badros

bower_components/gss/CHANGES.md

@@ -17,11 +17,8 @@
     bottom: == ::parent[bottom] - [bottom-margin] !require;
   }
 
-  /* center the buttons */  
-  #top-button1[right] == ::window[center-x] - [baseline] / 2;
-
-  @horizontal [#top-button1]-[#top-button2] 
-    gap([baseline])
+  @horizontal [#top-button1]-<::window[center-x]>-[#top-button2] 
+    gap([baseline] / 2)
     chain-top;
 
   [top-image-gap] == [baseline];
@@ -132,6 +129,49 @@ <h1><a name="features">Features</a></h1>
   </div>
 </section>
 
+
+<section id="fluent-section" class="section color-a">
+  
+  <style type="text/gss">
+  
+  #fluent-section {
+    height: <= ::window[height] - [top-margin];
+    #fluent-img {
+      height: ==  ::[width] * 9 / 16 !require;
+    }
+    [top-margin] <= ::[h-gap] <= 2 * [top-margin] !strong;
+    [top-margin] * 1.5 <= ::[v-gap] <= 2 * [top-margin] !strong;
+    @h |-[#fluent-img(>= [max-p-width] !strong, >= 600 !require)]-| in(::) gap(::[h-gap]) !strong;
+    @v |-[#fluent-img]-| in(::) gap(::[v-gap]);    
+    
+    #fluent-play {
+      padding: 0 !important;
+      height: == 96;
+      width: == ::[height] * 1.6;      
+      center-x: == #fluent-section[center-x];
+      center-y: == #fluent-section[center-y];
+    }
+    
+    #fluent-play-tri {
+      width: == 51;
+      height: == 59;
+      center-x: == #fluent-section[center-x] + 5;
+      center-y: == #fluent-section[center-y] - 5;
+    }
+  }
+  </style>
+  
+  <a href="http://vimeo.com/91393694" target="_blank">    
+    <img id="fluent-img" src="assets/images/fluent-video-cover.jpg" alt="Kid">    
+    <button id="fluent-play" class="button-play">
+      <svg class="icon" id="fluent-play-tri" width="51px" height="59px" version="1.1" xmlns="http://www.w3.org/2000/svg" baseProfile="full" >
+        <path d="M51,29.5L0,59V0L51,29.5z"/>
+      </svg>
+    </button>
+  </a>
+  
+</section>
+
 {% for post in site.categories.home %}
   <section class="section color-{{post.color}}" id="{{ post.uid }}">
     {% if post.title %}

bower_components/gss/dist/gss.js

@@ -11,7 +11,7 @@
 
   GSS.once "display", ->
     console?.timeEnd? "display"
-    setupWayPoints()
+    #setupWayPoints()
     app.menu.init()
 
 

bower_components/gss/dist/gss.min.js

@@ -13,7 +13,6 @@
         console.timeEnd("display");
       }
     }
-    setupWayPoints();
     return app.menu.init();
   });
   app.mobilecheck = mobilecheck = function() {

bower_components/gss/dist/worker.js

@@ -182,7 +182,10 @@ button {
 button.transparent {
   background-color: transparent;
 }
-button:hover, button.transparent:hover, .button:hover {
+button:hover, a:hover button, 
+.button:hover, a:hover .button,
+button.transparent:hover
+ {
   border-color: hsl(282, 99%, 31%);
   background-color: hsl(282, 99%, 31%) !important;
   color: hsl(58, 100%, 84%);  
@@ -199,6 +202,24 @@ button.inverse:hover {
   background-color: hsl(58, 100%, 84%) !important; 
 }
 
+.button-play {
+  opacity: .7;
+  background-color: transparent;
+}
+.button-play .icon {
+  fill: hsl(282, 99%, 31%);
+}
+.button-play:hover .icon {
+  opacity: 1;
+  fill: hsl(58, 100%, 84%);
+}
+
+a:hover .button-play .icon {
+  opacity: 1;
+  fill: hsl(58, 100%, 84%);
+}
+
+
 .badge g {
   fill: #6f019e;
 }
@@ -246,9 +267,12 @@ hr {
 .color-c {
   background-color: #d692f3;
   color: black;
-} .color-c 
+} .color-c blockquote {
+  color: white;
+}
 
-blockquote {
+.color-d {
+  background-color: hsl(282, 99%, 31%);
   color: white;
 }