skyframe 0.0.1.beta

data/templates/project/partials/_debug.scss

@@ -0,0 +1,114 @@
+/*
+------------------------------------------------------------------------------
+888888 Yb  dP 888888 888888 88b 88 8888b.  
+88__    YbdP    88   88__   88Yb88  8I  Yb 
+88""    dPYb    88   88""   88 Y88  8I  dY 
+888888 dP  Yb   88   888888 88  Y8 8888Y"  
+------------------------------------------------------------------------------
+  Extend classes. These are classes should not in your HTML markup. 
+  These class should be reused in this module for neatness.  
+------------------------------------------------------------------------------
+*/
+
+/* =============================================================================
+   Comment
+   ========================================================================== */
+
+
+/*
+------------------------------------------------------------------------------
+8888b.  888888 888888    db    88   88 88     888888     .dP"Y8 888888 Yb  dP 88     888888 .dP"Y8 
+ 8I  Yb 88__   88__     dPYb   88   88 88       88       `Ybo."   88    YbdP  88     88__   `Ybo." 
+ 8I  dY 88""   88""    dP__Yb  Y8   8P 88  .o   88       o.`Y8b   88     8P   88  .o 88""   o.`Y8b 
+8888Y"  888888 88     dP""""Yb `YbodP' 88ood8   88       8bodP'   88    dP    88ood8 888888 8bodP' 
+------------------------------------------------------------------------------
+  Default style
+------------------------------------------------------------------------------
+*/
+
+
+
+/*
+------------------------------------------------------------------------------
+8b    d8 888888 8888b.  88    db         dP"Yb  88   88 888888 88""Yb Yb  dP                  8b    d8  dP"Yb  88""Yb 88 88     888888 
+88b  d88 88__    8I  Yb 88   dPYb       dP   Yb 88   88 88__   88__dP  YbdP      ________     88b  d88 dP   Yb 88__dP 88 88     88__   
+88YbdP88 88""    8I  dY 88  dP__Yb      Yb b dP Y8   8P 88""   88"Yb    8P       """"""""     88YbdP88 Yb   dP 88""Yb 88 88  .o 88""   
+88 YY 88 888888 8888Y"  88 dP""""Yb      `"YoYo `YbodP' 888888 88  Yb  dP                     88 YY 88  YbodP  88oodP 88 88ood8 888888 
+------------------------------------------------------------------------------
+  Mobile
+------------------------------------------------------------------------------
+*/
+@media only screen and (min-width: $mq-mob-min) and (max-width: $mq-mob-max){  
+
+  body{
+    @if($DEBUG == true){
+      @include debug-mq("MOBILE", rgba(255,0,0,0.3));    
+    }
+  }
+
+}// /@media mob
+
+
+/*
+------------------------------------------------------------------------------
+8b    d8 888888 8888b.  88    db         dP"Yb  88   88 888888 88""Yb Yb  dP                  888888    db    88""Yb 88     888888 888888 
+88b  d88 88__    8I  Yb 88   dPYb       dP   Yb 88   88 88__   88__dP  YbdP      ________       88     dPYb   88__dP 88     88__     88   
+88YbdP88 88""    8I  dY 88  dP__Yb      Yb b dP Y8   8P 88""   88"Yb    8P       """"""""       88    dP__Yb  88""Yb 88  .o 88""     88   
+88 YY 88 888888 8888Y"  88 dP""""Yb      `"YoYo `YbodP' 888888 88  Yb  dP                       88   dP""""Yb 88oodP 88ood8 888888   88   
+------------------------------------------------------------------------------
+  Tablet
+------------------------------------------------------------------------------
+*/
+@media only screen and (min-width: $mq-tab-min) and (max-width: $mq-tab-max){  
+
+  body{
+    @if($DEBUG == true){
+      @include debug-mq("TABLET", rgba(0,255,0,0.3));    
+    }
+  }
+
+}// /@media tab
+
+/*
+------------------------------------------------------------------------------
+8b    d8 888888 8888b.  88    db         dP"Yb  88   88 888888 88""Yb Yb  dP                  8888b.  888888 .dP"Y8 88  dP 888888  dP"Yb  88""Yb 
+88b  d88 88__    8I  Yb 88   dPYb       dP   Yb 88   88 88__   88__dP  YbdP      ________      8I  Yb 88__   `Ybo." 88odP    88   dP   Yb 88__dP 
+88YbdP88 88""    8I  dY 88  dP__Yb      Yb b dP Y8   8P 88""   88"Yb    8P       """"""""      8I  dY 88""   o.`Y8b 88"Yb    88   Yb   dP 88"""  
+88 YY 88 888888 8888Y"  88 dP""""Yb      `"YoYo `YbodP' 888888 88  Yb  dP                     8888Y"  888888 8bodP' 88  Yb   88    YbodP  88     
+------------------------------------------------------------------------------
+  Desktop
+------------------------------------------------------------------------------
+*/
+@media only screen and (min-width: $mq-dsk-min){
+
+  body{
+    @if($DEBUG == true){
+      @include debug-mq("DESKTOP", rgba(0,0,255,0.3));    
+    }
+  }
+
+}// /@media dsk
+
+
+
+/*
+------------------------------------------------------------------------------
+88""Yb 888888 888888 88 88b 88    db    
+88__dP 88__     88   88 88Yb88   dPYb   
+88"Yb  88""     88   88 88 Y88  dP__Yb  
+88  Yb 888888   88   88 88  Y8 dP""""Yb 
+------------------------------------------------------------------------------
+  Retina
+------------------------------------------------------------------------------
+*/
+
+@media only screen and (-webkit-min-device-pixel-ratio: $pixel-ratio-min), 
+       only screen and (min-device-pixel-ratio: $pixel-ratio-min)  {
+
+  body{
+    @if($DEBUG == true){
+      @include debug-mq("RETINA", rgba(255,0,255,0.3) );    
+    }
+  }
+
+}

data/templates/project/partials/_functions.scss

@@ -0,0 +1,10 @@
+/*
+------------------------------------------------------------------------------
+888888 88   88 88b 88  dP""b8 888888 88  dP"Yb  88b 88 .dP"Y8 
+88__   88   88 88Yb88 dP   `"   88   88 dP   Yb 88Yb88 `Ybo." 
+88""   Y8   8P 88 Y88 Yb        88   88 Yb   dP 88 Y88 o.`Y8b 
+88     `YbodP' 88  Y8  YboodP   88   88  YbodP  88  Y8 8bodP' 
+------------------------------------------------------------------------------
+	Functions
+------------------------------------------------------------------------------
+*/

data/templates/project/partials/_helpers.scss

@@ -0,0 +1,86 @@
+/* ==========================================================================
+   H5BP Helper classes
+   ========================================================================== */
+
+/*
+ * Image replacement
+ */
+
+.ir {
+    border: 0;
+    font: 0/0 a;
+    text-shadow: none;
+    color: transparent;
+    background-color: transparent;
+}
+
+/*
+ * Hide from both screenreaders and browsers: h5bp.com/u
+ */
+
+.hidden {
+    display: none !important;
+    visibility: hidden;
+}
+
+/*
+ * Hide only visually, but have it available for screenreaders: h5bp.com/v
+ */
+
+.visuallyhidden {
+    border: 0;
+    clip: rect(0 0 0 0);
+    height: 1px;
+    margin: -1px;
+    overflow: hidden;
+    padding: 0;
+    position: absolute;
+    width: 1px;
+}
+
+/*
+ * Extends the .visuallyhidden class to allow the element to be focusable
+ * when navigated to via the keyboard: h5bp.com/p
+ */
+
+.visuallyhidden.focusable:active,
+.visuallyhidden.focusable:focus {
+    clip: auto;
+    height: auto;
+    margin: 0;
+    overflow: visible;
+    position: static;
+    width: auto;
+}
+
+/*
+ * Hide visually and from screenreaders, but maintain layout
+ */
+
+.invisible {
+    visibility: hidden;
+}
+
+/**
+ * Clearfix helper
+ * Used to contain floats: h5bp.com/q
+ */
+
+.clearfix:before,
+.clearfix:after {
+    content: "";
+    display: table;
+}
+
+.clearfix:after {
+    clear: both;
+}
+
+/*
+ * For IE 6/7 only
+ * Include this rule to trigger hasLayout and contain floats.
+ */
+
+.clearfix {
+    *zoom: 1;
+}

data/templates/project/partials/_layout.scss

@@ -0,0 +1,188 @@
+/*
+------------------------------------------------------------------------------
+888888 Yb  dP 888888 888888 88b 88 8888b.  
+88__    YbdP    88   88__   88Yb88  8I  Yb 
+88""    dPYb    88   88""   88 Y88  8I  dY 
+888888 dP  Yb   88   888888 88  Y8 8888Y"  
+------------------------------------------------------------------------------
+  Extend classes. These are classes should not in your HTML markup. 
+  These class should be reused in this module for neatness.  
+------------------------------------------------------------------------------
+*/
+
+/* =============================================================================
+   Comment
+   ========================================================================== */
+
+
+
+/*
+------------------------------------------------------------------------------
+8888b.  888888 888888    db    88   88 88     888888     .dP"Y8 888888 Yb  dP 88     888888 .dP"Y8 
+ 8I  Yb 88__   88__     dPYb   88   88 88       88       `Ybo."   88    YbdP  88     88__   `Ybo." 
+ 8I  dY 88""   88""    dP__Yb  Y8   8P 88  .o   88       o.`Y8b   88     8P   88  .o 88""   o.`Y8b 
+8888Y"  888888 88     dP""""Yb `YbodP' 88ood8   88       8bodP'   88    dP    88ood8 888888 8bodP' 
+------------------------------------------------------------------------------
+  Default style
+------------------------------------------------------------------------------
+*/
+
+/* =============================================================================
+   Layouts
+   ========================================================================== */
+.container {
+  @include container;
+
+  @if $DEBUG == true{
+    @include susy-grid-background;
+  }
+}
+
+
+
+.l-main,
+.l-main-side,
+.l-side-main,
+.l-side-main-side{
+  //background:$col-light-gray;
+  //border-bottom:1px solid $col-dark-gray;
+}
+
+
+
+
+/*
+------------------------------------------------------------------------------
+8b    d8 888888 8888b.  88    db         dP"Yb  88   88 888888 88""Yb Yb  dP                  8b    d8  dP"Yb  88""Yb 88 88     888888 
+88b  d88 88__    8I  Yb 88   dPYb       dP   Yb 88   88 88__   88__dP  YbdP      ________     88b  d88 dP   Yb 88__dP 88 88     88__   
+88YbdP88 88""    8I  dY 88  dP__Yb      Yb b dP Y8   8P 88""   88"Yb    8P       """"""""     88YbdP88 Yb   dP 88""Yb 88 88  .o 88""   
+88 YY 88 888888 8888Y"  88 dP""""Yb      `"YoYo `YbodP' 888888 88  Yb  dP                     88 YY 88  YbodP  88oodP 88 88ood8 888888 
+------------------------------------------------------------------------------
+  Mobile
+------------------------------------------------------------------------------
+*/
+@media only screen and (min-width: $mq-mob-min) and (max-width: $mq-mob-max){  
+
+  /* =============================================================================
+     Comment
+     ========================================================================== */
+
+
+
+}// /@media mob
+
+
+/*
+------------------------------------------------------------------------------
+8b    d8 888888 8888b.  88    db         dP"Yb  88   88 888888 88""Yb Yb  dP                  888888    db    88""Yb 88     888888 888888 
+88b  d88 88__    8I  Yb 88   dPYb       dP   Yb 88   88 88__   88__dP  YbdP      ________       88     dPYb   88__dP 88     88__     88   
+88YbdP88 88""    8I  dY 88  dP__Yb      Yb b dP Y8   8P 88""   88"Yb    8P       """"""""       88    dP__Yb  88""Yb 88  .o 88""     88   
+88 YY 88 888888 8888Y"  88 dP""""Yb      `"YoYo `YbodP' 888888 88  Yb  dP                       88   dP""""Yb 88oodP 88ood8 888888   88   
+------------------------------------------------------------------------------
+  Tablet
+------------------------------------------------------------------------------
+*/
+@media only screen and (min-width: $mq-tab-min) and (max-width: $mq-tab-max){  
+
+  /* =============================================================================
+     Comment
+     ========================================================================== */
+
+
+}// /@media tab
+
+/*
+------------------------------------------------------------------------------
+8b    d8 888888 8888b.  88    db         dP"Yb  88   88 888888 88""Yb Yb  dP                  8888b.  888888 .dP"Y8 88  dP 888888  dP"Yb  88""Yb 
+88b  d88 88__    8I  Yb 88   dPYb       dP   Yb 88   88 88__   88__dP  YbdP      ________      8I  Yb 88__   `Ybo." 88odP    88   dP   Yb 88__dP 
+88YbdP88 88""    8I  dY 88  dP__Yb      Yb b dP Y8   8P 88""   88"Yb    8P       """"""""      8I  dY 88""   o.`Y8b 88"Yb    88   Yb   dP 88"""  
+88 YY 88 888888 8888Y"  88 dP""""Yb      `"YoYo `YbodP' 888888 88  Yb  dP                     8888Y"  888888 8bodP' 88  Yb   88    YbodP  88     
+------------------------------------------------------------------------------
+  Desktop
+------------------------------------------------------------------------------
+*/
+@media only screen and (min-width: $mq-dsk-min){
+
+
+
+  /* =============================================================================
+     Layout: Main  
+     ========================================================================== */
+  .l-main{
+    @include legacy-pie-clearfix;
+
+    .mod-content{
+      @include span-columns(12, 12);
+      
+    }// /.mod-content 
+
+  }// /.l-main
+
+
+  /* =============================================================================
+     Layout: Main Side 
+     ========================================================================== */
+  .l-main-side{
+    @include legacy-pie-clearfix;
+
+    .mod-sidebar{
+      @include span-columns(3, 12);
+
+
+      &:last-child{
+        @include omega;
+      }
+    }// /.mod-sidebar
+
+    .mod-content{
+      @include span-columns(9, 12);
+      
+    }// /.mod-content 
+
+  }// /.l-main-side
+
+
+  /* =============================================================================
+     Layout: Side Main
+     ========================================================================== */
+  .l-side-main{
+    @include legacy-pie-clearfix;
+
+    .mod-sidebar{
+      @include span-columns(3, 12);
+    }// /.mod-sidebar
+
+    .mod-content{
+      @include span-columns(9 omega, 12);
+      
+    }// /.mod-content 
+
+  }// /.l-main-side
+
+
+  /* =============================================================================
+     Layout: Side Main Side 
+     ========================================================================== */
+  .l-side-main-side{
+    @include legacy-pie-clearfix;
+
+    .mod-sidebar{
+      @include span-columns(3, 12);
+
+      &:last-child{
+        @include omega;
+      }
+    }// /.mod-sidebar
+
+    .mod-content{
+      @include span-columns(6, 12);
+      
+    }// /.mod-content 
+
+  }
+
+
+}// /@media dsk
+
+
+

data/templates/project/partials/_media.scss

@@ -0,0 +1,191 @@
+@import "plugins/video-js";
+
+
+/* ==========================================================================
+   H5BP Normalize bits
+   Media
+   ========================================================================== */
+/*
+ * Corrects `inline-block` display not defined in IE6/7/8/9 & FF3.
+ */
+
+audio,
+canvas,
+video {
+    display: inline-block;
+    *display: inline;
+    *zoom: 1;
+}
+
+/*
+ * Prevents modern browsers from displaying `audio` without controls.
+ * Remove excess height in iOS5 devices.
+ */
+
+audio:not([controls]) {
+    display: none;
+    height: 0;
+}
+
+
+/*
+ * Addresses margin not present in IE6/7/8/9, S5, O11.
+ */
+
+figure {
+    margin: 0;
+}
+
+/*
+ * 1. Removes border when inside `a` element in IE6/7/8/9, FF3.
+ * 2. Improves image quality when scaled in IE7.
+ *    code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing/
+ */
+
+img {
+    border: 0; /* 1 */
+    -ms-interpolation-mode: bicubic; /* 2 */
+}
+
+/*
+ * Corrects overflow displayed oddly in IE9.
+ */
+
+svg:not(:root) {
+    overflow: hidden;
+}
+
+
+
+
+/*
+------------------------------------------------------------------------------
+8888b.  888888 888888    db    88   88 88     888888     .dP"Y8 888888 Yb  dP 88     888888 .dP"Y8 
+ 8I  Yb 88__   88__     dPYb   88   88 88       88       `Ybo."   88    YbdP  88     88__   `Ybo." 
+ 8I  dY 88""   88""    dP__Yb  Y8   8P 88  .o   88       o.`Y8b   88     8P   88  .o 88""   o.`Y8b 
+8888Y"  888888 88     dP""""Yb `YbodP' 88ood8   88       8bodP'   88    dP    88ood8 888888 8bodP' 
+------------------------------------------------------------------------------
+  Default style
+------------------------------------------------------------------------------
+*/
+
+
+figure{
+  img,video{
+    min-width:100%;
+    @include vr-ma;
+  } 
+}
+
+
+/* =============================================================================
+   Remove the gap between images and the bottom of their containers: h5bp.com/i/440
+   ========================================================================== */
+img {
+    vertical-align: middle;
+}
+
+img{
+  max-width:100%;
+}
+
+
+video{
+  min-width:100%;
+  max-width:100%;
+  @include vr-mb;
+  p{
+    color:#fff;
+    //background:#fff;
+  }
+}
+
+// Figure class
+.fig-left{
+  float:left;
+  margin-right:2em;
+  @include vr-mb;
+}
+.fig-right{
+  float:right;
+  margin-left:2em;
+  @include vr-mb;  
+}
+
+
+
+/*
+------------------------------------------------------------------------------
+8b    d8 888888 8888b.  88    db         dP"Yb  88   88 888888 88""Yb Yb  dP                  8b    d8  dP"Yb  88""Yb 88 88     888888 
+88b  d88 88__    8I  Yb 88   dPYb       dP   Yb 88   88 88__   88__dP  YbdP      ________     88b  d88 dP   Yb 88__dP 88 88     88__   
+88YbdP88 88""    8I  dY 88  dP__Yb      Yb b dP Y8   8P 88""   88"Yb    8P       """"""""     88YbdP88 Yb   dP 88""Yb 88 88  .o 88""   
+88 YY 88 888888 8888Y"  88 dP""""Yb      `"YoYo `YbodP' 888888 88  Yb  dP                     88 YY 88  YbodP  88oodP 88 88ood8 888888 
+------------------------------------------------------------------------------
+  Mobile
+------------------------------------------------------------------------------
+*/
+@media only screen and (min-width: $mq-mob-min) and (max-width: $mq-mob-max){  
+
+  /* =============================================================================
+     Comment
+     ========================================================================== */
+
+
+
+}// /@media mob
+
+
+/*
+------------------------------------------------------------------------------
+8b    d8 888888 8888b.  88    db         dP"Yb  88   88 888888 88""Yb Yb  dP                  888888    db    88""Yb 88     888888 888888 
+88b  d88 88__    8I  Yb 88   dPYb       dP   Yb 88   88 88__   88__dP  YbdP      ________       88     dPYb   88__dP 88     88__     88   
+88YbdP88 88""    8I  dY 88  dP__Yb      Yb b dP Y8   8P 88""   88"Yb    8P       """"""""       88    dP__Yb  88""Yb 88  .o 88""     88   
+88 YY 88 888888 8888Y"  88 dP""""Yb      `"YoYo `YbodP' 888888 88  Yb  dP                       88   dP""""Yb 88oodP 88ood8 888888   88   
+------------------------------------------------------------------------------
+  Tablet
+------------------------------------------------------------------------------
+*/
+@media only screen and (min-width: $mq-tab-min) and (max-width: $mq-tab-max){  
+
+  /* =============================================================================
+     Comment
+     ========================================================================== */
+
+
+
+}// /@media tab
+
+/*
+------------------------------------------------------------------------------
+8b    d8 888888 8888b.  88    db         dP"Yb  88   88 888888 88""Yb Yb  dP                  8888b.  888888 .dP"Y8 88  dP 888888  dP"Yb  88""Yb 
+88b  d88 88__    8I  Yb 88   dPYb       dP   Yb 88   88 88__   88__dP  YbdP      ________      8I  Yb 88__   `Ybo." 88odP    88   dP   Yb 88__dP 
+88YbdP88 88""    8I  dY 88  dP__Yb      Yb b dP Y8   8P 88""   88"Yb    8P       """"""""      8I  dY 88""   o.`Y8b 88"Yb    88   Yb   dP 88"""  
+88 YY 88 888888 8888Y"  88 dP""""Yb      `"YoYo `YbodP' 888888 88  Yb  dP                     8888Y"  888888 8bodP' 88  Yb   88    YbodP  88     
+------------------------------------------------------------------------------
+  Desktop
+------------------------------------------------------------------------------
+*/
+@media only screen and (min-width: $mq-dsk-min){
+
+  /* =============================================================================
+     Comment
+     ========================================================================== */
+
+
+}// /@media dsk
+
+
+
+/*
+------------------------------------------------------------------------------
+88""Yb 888888 888888 88 88b 88    db    
+88__dP 88__     88   88 88Yb88   dPYb   
+88"Yb  88""     88   88 88 Y88  dP__Yb  
+88  Yb 888888   88   88 88  Y8 dP""""Yb 
+------------------------------------------------------------------------------
+  Retina
+------------------------------------------------------------------------------
+*/
+@media screen and (-webkit-min-device-pixel-ratio: 2), screen and (max--moz-device-pixel-ratio: 2) {
+
+}