seasons 0.9.3.beta9 → 0.9.3.beta10

data/seasons.gemspec

@@ -2,7 +2,7 @@
 
 Gem::Specification.new do |s|
   s.name = %q{seasons}
-  s.version = "0.9.3.beta9"
+  s.version = "0.9.3.beta10"
 
   s.required_rubygems_version = Gem::Requirement.new(">= 1.3.5")
   s.authors = ["Scott Kellum"]
@@ -16,10 +16,11 @@ Gem::Specification.new do |s|
     "stylesheets/seasons/_core.sass",
     "stylesheets/seasons/_tools.sass",
     "stylesheets/seasons/tools/_basic-functions.sass",
+    "stylesheets/seasons/tools/_color-schemer.sass",
     "stylesheets/seasons/tools/_css3.sass",
+    "stylesheets/seasons/tools/_flexbox.sass",
     "stylesheets/seasons/tools/_grid-tools.sass",
     "stylesheets/seasons/tools/_modular-scale.sass",
-    "stylesheets/seasons/tools/_color-schemer.sass",
     "stylesheets/seasons/tools/_reset.sass",
     "stylesheets/seasons/plugin/_ad.sass",
     "stylesheets/seasons/plugin/_ipad.sass",

data/stylesheets/seasons/_core.sass

@@ -26,6 +26,9 @@ $height-prefix: h !default
 $ratio-prefix: r !default
 $scale: 1
 
+$blur-radius: 2px !default
+$blur-lightbox: true !default
+
 =ratio($width, $height, $cols: $columns)
   @for $i from 1 through $cols
     .#{$ratio-prefix+$width}x#{$height}.#{$width-prefix+$i}, .container.#{$width-prefix+$i} [ratio="#{$width}x#{$height}"] img // Grid ratio, figure ratio.
@@ -65,20 +68,6 @@ $scale: 1
       .#{$height-prefix+$i}
         height: grid($i, $module-h) * $scale
   
-  // Lightbox sizes
-  .lightbox .container
-    &[class*="single"]
-      width: grid($text-column-span) * $scale
-    &[class*="double"]
-      width: grid($text-column-span * 2) * $scale
-    &[class*="triple"]
-      width: grid($text-column-span * 3) * $scale
-    &[class*="quad"]
-      width: grid($text-column-span * 4) * $scale
-    img
-      width: 100%
-      height: auto
-  
   // COLUMN WIDTHS
   .column
     width: grid($text-column-span) * $scale
@@ -90,7 +79,6 @@ $scale: 1
 .grid
   position: absolute
   overflow: hidden
-  z-index: 1
   // Helps reduce flickr when paging
   -webkit-backface-visibility: hidden
   // Sometimes Safari forgets this one
@@ -293,6 +281,15 @@ $fullbleed: true !default
     width: auto
 
 
+// BLUR LIGHTBOX BACKGROUND
+// New browsers only.
+@if $blur-lightbox
+  #chromeContainer .chrome:first-child
+    +prefix(filter, blur($blur-radius))
+  #chromeContainer .chrome:last-child
+    +prefix(filter, blur(0))
+
+
 // MOBILE OPTIMIZATIONS
 // Tweaks to make things run more smoothly on mobile devices
 .os-ipad, .os-iphone

data/stylesheets/seasons/plugin/_tablet-7-normalize.sass

@@ -1,18 +1,20 @@
 // Normalize 7" tablets.
 
 // Default is halfway between both resolutions. I find the default 3/2 on the tab to be too much.
-$tab7-virtual-resolution: (6/5) !default
+$tab7-pixel-ratio: (6/5) !default
 
 @if unit($module-w) != "em"
   @warn "Your grid MUST be based on ems to scale to 7 inch tablets."
 @else
-  // Standard 7" 1024x600 tablet
-  @media screen and (-webkit-device-pixel-ratio: 1) and (device-width: 1024px) and (max-device-height: 600px) and (orientation: landscape), all and (-webkit-device-pixel-ratio: 1) and (device-width: 600px) and (max-device-height: 1024px) and (orientation: portrait)
+  
+  // Standard 7" 1024x600 tablet (Kindle Fire)
+  @media screen and (-webkit-device-pixel-ratio: 1) and (device-width: 1024px) and (orientation: landscape), screen and (-webkit-device-pixel-ratio: 1) and (device-width: 600px) and (orientation: portrait)
     html
-      font-size: $base-size * $tab7-virtual-resolution
+      font-size: $base-size * $tab7-pixel-ratio
+  
   // 1024x600 tablet with virtual resolution (Original Galaxy Tab)
-  @media screen and (-webkit-device-pixel-ratio: 1.5) and (device-width: 683px) and (max-device-height: 400px) and (orientation: landscape), all and (-webkit-device-pixel-ratio: 1.5) and (device-width: 400px) and (max-device-height: 683px) and (orientation: portrait)
+  @media screen and (-webkit-device-pixel-ratio: 1.5) and (device-width: 683px) and (orientation: landscape), screen and (-webkit-device-pixel-ratio: 1.5) and (device-width: 400px) and (orientation: portrait)
     html
-      font-size: $base-size * (2/3) * $tab7-virtual-resolution
+      font-size: $base-size * (2/3) * $tab7-pixel-ratio
 
 $seasons-tablet-7-normalize-loaded: true

data/stylesheets/seasons/plugin/_tablet-7-template.sass

@@ -11,8 +11,8 @@ $tablet-7-margin: $margin !default
 =ratio($width, $height, $cols: $columns)
   // Force resize images
   .seven.grid .container [ratio="#{$width}x#{$height}"] img
-    width: 600 / ( $base-size * $tab7-virtual-resolution / 1px ) - $tablet-7-margin * 2
-    height: ( 600 / ( $base-size * $tab7-virtual-resolution / 1px ) - $tablet-7-margin * 2 ) * ( $height / $width )
+    width: 600 / ( $base-size * $tab7-pixel-ratio / 1px ) - $tablet-7-margin * 2
+    height: ( 600 / ( $base-size * $tab7-pixel-ratio / 1px ) - $tablet-7-margin * 2 ) * ( $height / $width )
 
 @if $seasons-tablet-7-normalize-loaded
   // Make sure seven grids don't show up for desktop users.
@@ -32,10 +32,10 @@ $tablet-7-margin: $margin !default
       .grid
         opacity: 1 !important
       .column, .container
-        width: 600 / ( $base-size * $tab7-virtual-resolution / 1px ) - $tablet-7-margin * 2
+        width: 600 / ( $base-size * $tab7-pixel-ratio / 1px ) - $tablet-7-margin * 2
       .grid.seven
-        width: 600 / ( $base-size * $tab7-virtual-resolution / 1px ) - $tablet-7-margin * 2
-        min-width: 600 / ( $base-size * $tab7-virtual-resolution / 1px ) - $tablet-7-margin * 2
+        width: 600 / ( $base-size * $tab7-pixel-ratio / 1px ) - $tablet-7-margin * 2
+        min-width: 600 / ( $base-size * $tab7-pixel-ratio / 1px ) - $tablet-7-margin * 2
         margin: 0
         padding: 0 $margin
       

data/stylesheets/seasons/tools/_flexbox.sass

@@ -0,0 +1,65 @@
+// Original gist https://gist.github.com/280797
+
+$prefixes: -webkit- -moz- -ms- -o- !default
+
+=prefix($property, $value, $prefixes)
+  @each $prefix in $prefixes
+    #{$prefix}#{$property}: $value
+  #{$property}: $value
+
+=prefix-value($property, $value, $prefixes)
+  @each $prefix in $prefixes
+    #{$property}: #{$prefix}$value
+  #{$property}: $value
+
+=display-box($property: display-box, $value: box)
+  +prefix-value($property, $value)
+
+//  Value:    horizontal | vertical | inline-axis | block-axis | inherit
+//  Initial:  inline-axis
+//  Default:  horizontal
+=box-orient($property: box-orient, $value: horizontal)
+  +prefix($property, $value)
+
+//  Value:    normal | reverse | inherit
+//  Initial:  normal
+//  Default:  reverse
+=box-direction($property: box-direction, $value: reverse)
+  +prefix($property, $value)
+
+//  Value:    <integer>
+//  Initial:  1
+//  Default:  2
+=box-ordinal-group($property: box-ordinal-group, $value: 2)
+  +prefix($property, $value)
+
+//  Value:    start | end | center | baseline | stretch
+//  Initial:  stretch
+//  Default:  start
+=box-align($property: box-align, $value: start)
+  +prefix($property, $value)
+
+//  Value:    <number>
+//  Initial:  0.0
+//  Default:  1
+=box-flex($property: box-flex, $value: 1)
+  +prefix($property, $value)
+
+//  Value:    <integer>
+//  Initial:  1
+//  Default:  2
+=box-flex-group($property: box-flex-group, $value: 2)
+  +prefix($property, $value)
+
+//  Value:    start | end | center | justify
+//  Initial:  start
+//  Default:  center
+=box-pack($property: box-pack, $value: center)
+  +prefix($property, $value)
+
+//  I don't see this working in any browser currently...
+//  Value:    single | multiple
+//  Initial:  single
+//  Default:  multiple
+=box-lines($property: box-lines, $value: multiple)
+  +prefix($property, $value)

data/templates/project/_config.sass

@@ -17,13 +17,13 @@ $line-height: ms(1, 1em)
 
 // GRID MEASUREMENTS
 // Grid module measurements. See Mark Boulton’s write up on grids http://www.markboulton.co.uk/journal/comments/rethinking-css-grids
-$module-w: ms(5) // module width
-$module-h: ms(4) // module height
-$gutter: ms(1) // gutters
+$module-w: ms(5, 1em) // module width
+$module-h: ms(4, 1em) // module height
+$gutter: ms(1, 1em) // gutters
 // grid margins:
-$margin: ms(1) // side margins
-$top: ms(2) // default top margin (for text and containers)
-$bottom: ms(3) // default bottom margin (for text and containers)
+$margin: ms(1, 1em) // side margins
+$top: ms(2, 1em) // default top margin (for text and containers)
+$bottom: ms(3, 1em) // default bottom margin (for text and containers)
 // number of modules across to calculate:
 $columns: 12 // # of columns you want to calculate for
 

data/templates/project/_pages.scss

@@ -16,6 +16,9 @@ p {
     }
   &.caption {
     text-align: left;
+    .lightbox & {
+      color: #fff;
+      }
     }
   }
 

data/templates/project/resources.html

@@ -22,7 +22,7 @@
           <!--A CLASS OF SCROLL ADDS TOUCH BASED SCROLLING SUPPORT-->
           <div class="content scroll" data-ts-template="publication">
             {{#contents}}
-                <a href="{{url}}">
+                <a data-href="{{url}}">
                   <span class="title">{{title}}</span>
                 </a>
             {{/contents}}

data/templates/project/style.sass

@@ -6,6 +6,10 @@
 
 // This is a styling framework to be used with Treesaver
 //  It creates a flexable yet solid foundation for building templates.
+//
+// ** To run you need to have SASS installed: http://sass-lang.com/ **
+//  The, just watch the "sass" folder from the project directory.
+//  sass --watch sass:html/_/css
 
 // IMPORT TOOLS AND RESET:
 $reset: true // set to false if you don’t want the bundled reset

metadata

@@ -6,8 +6,8 @@ version: !ruby/object:Gem::Version
   - 0
   - 9
   - 3
-  - beta9
-  version: 0.9.3.beta9
+  - beta10
+  version: 0.9.3.beta10
 platform: ruby
 authors: 
 - Scott Kellum
@@ -46,10 +46,11 @@ files:
 - stylesheets/seasons/_core.sass
 - stylesheets/seasons/_tools.sass
 - stylesheets/seasons/tools/_basic-functions.sass
+- stylesheets/seasons/tools/_color-schemer.sass
 - stylesheets/seasons/tools/_css3.sass
+- stylesheets/seasons/tools/_flexbox.sass
 - stylesheets/seasons/tools/_grid-tools.sass
 - stylesheets/seasons/tools/_modular-scale.sass
-- stylesheets/seasons/tools/_color-schemer.sass
 - stylesheets/seasons/tools/_reset.sass
 - stylesheets/seasons/plugin/_ad.sass
 - stylesheets/seasons/plugin/_ipad.sass