sassblueprint 0.0.3

data/lib/stylesheets/base_components/content_modules/_colorbox.sass

@@ -0,0 +1,208 @@
+// Colorbox Core Styles:
+
+%color-box-core
+  #colorbox, #cboxOverlay, #cboxWrapper 
+    position: absolute
+    top: 0
+    left: 0
+    z-index: 9999
+    overflow: hidden
+
+  #cboxOverlay 
+    position: fixed
+    width: 100%
+    height: 100%
+    +opacity(0.9)
+
+  #cboxMiddleLeft, #cboxBottomLeft 
+    clear: left
+
+  #cboxContent 
+    position: relative
+
+  #cboxLoadedContent 
+    overflow: auto
+    -webkit-overflow-scrolling: touch
+
+  #cboxTitle 
+    margin: 0
+
+  #cboxLoadingOverlay, #cboxLoadingGraphic 
+    position: absolute
+    top: 0
+    left: 0
+    width: 100%
+    height: 100%
+
+
+  // These elements are buttons, and may need to have additional
+  // styles reset to avoid unwanted base styles.
+
+  #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow 
+    border: 0
+    padding: 0
+    margin: 0
+    overflow: visible
+    width: auto
+    background: none
+    cursor: pointer
+
+
+  // Avoid outlines on :active (mouseclick),
+  // but preserve outlines on :focus (tabbed navigating)
+
+  #cboxPrevious:active, #cboxNext:active, #cboxClose:active, #cboxSlideshow:active 
+    outline: 0
+
+  .cboxPhoto 
+    float: left
+    margin: auto
+    border: 0
+    display: block
+    max-width: none
+
+  .cboxIframe 
+    width: 100%
+    height: 100%
+    display: block
+    border: 0
+
+  // Reset box sizing to content-box if theme is using border-box.
+
+  #colorbox, #cboxContent, #cboxLoadedContent 
+    +box-sizing(content-box)
+
+
+
+//// Colorbox module default style:
+//// The styles are ordered & tabbed in a way that represents
+//// the nesting of the generated HTML.
+%colorbox-styles
+  #cboxOverlay 
+    background: #000
+
+  #colorbox 
+    outline: 0
+
+    #cboxWrapper 
+    
+      #cboxTopLeft 
+        width: 15px
+        height: 15px
+      
+      #cboxTopCenter 
+        height: 15px
+      
+      #cboxTopRight 
+        width: 15px
+        height: 15px
+      
+      #cboxBottomLeft 
+        width: 15px
+        height: 10px
+      
+      #cboxBottomCenter 
+        height: 10px
+      
+      #cboxBottomRight 
+        width: 15px
+        height: 10px
+      
+      #cboxMiddleLeft 
+        width: 15px
+      
+      #cboxMiddleRight 
+        width: 15px
+      
+      #cboxContent 
+        overflow: hidden
+      
+        #cboxError 
+          padding: 50px
+          border: 1px solid #ccc
+        
+        #cboxLoadedContent 
+          margin-bottom: 28px
+        
+        #cboxTitle 
+          position: absolute
+          +text-style($size: 14px, $color: white, $lh: 16px)
+          bottom: 28px
+          left: 0
+          color: white
+          width: 100%
+          padding: 25px 10px 15px
+
+        
+        #cboxCurrent 
+          display: none
+          //position: absolute
+          //bottom: 4px
+          //left: 60px
+          //color: #949494
+        
+        .cboxSlideshow_on #cboxSlideshow 
+          position: absolute
+          bottom: 0px
+          right: 30px
+          background: url('images/controls.png') no-repeat -75px -50px
+          width: 25px
+          height: 25px
+          text-indent: -9999px
+        
+        .cboxSlideshow_on #cboxSlideshow:hover 
+          background-position: -101px -50px
+        
+        .cboxSlideshow_off #cboxSlideshow 
+          position: absolute
+          bottom: 0px
+          right: 30px
+          background: url('images/controls.png') no-repeat -25px -50px
+          width: 25px
+          height: 25px
+          text-indent: -9999px
+        
+        .cboxSlideshow_off #cboxSlideshow:hover 
+          background-position: -49px -50px
+        
+        #cboxPrevious 
+          position: absolute
+          bottom: 0
+          left: 0
+          background: url('images/controls.png') no-repeat -75px 0px
+          width: 25px
+          height: 25px
+          text-indent: -9999px
+        
+        #cboxPrevious:hover 
+          background-position: -75px -25px
+        
+        #cboxNext 
+          position: absolute
+          bottom: 0
+          left: 27px
+          background: url('images/controls.png') no-repeat -50px 0px
+          width: 25px
+          height: 25px
+          text-indent: -9999px
+        
+        #cboxNext:hover 
+          background-position: -50px -25px
+        
+        #cboxLoadingOverlay 
+        
+        #cboxLoadingGraphic 
+          background: url('images/loading_animation.gif') no-repeat center center
+        
+        #cboxClose 
+          position: absolute
+          bottom: 0
+          right: 0
+          background: url('images/controls.png') no-repeat -25px 0px
+          width: 25px
+          height: 25px
+          text-indent: -9999px
+        
+        #cboxClose:hover 
+          background-position: -25px -25px
+        

data/lib/stylesheets/base_components/content_modules/_flexslider.sass

@@ -0,0 +1,93 @@
+%flexslider-reset
+  +box-shadow(transparent 0 0 0)
+  +border-radius(0)
+  background: transparent
+  margin: 0
+  border: 0
+
+
+%flexslider
+  margin: 0
+  background: #fff
+  border: 0px solid #fff
+  +border-radius(0)
+  +box-shadow(0)
+  width: 100%
+  .slides
+    padding-left: 0em
+    li
+      float: left
+      display: block
+      width: 100%
+    .flex-caption
+      position: absolute
+      left: 0
+      right: 0
+      bottom: 0px
+      padding: 10px 16px 0 16px
+
+      div[class*="additional-links"]
+        display: inline-block
+        float: left
+        margin-right: 1em
+        &:after
+          content: "|"
+          margin-left: 1em
+          color: $link
+        &:last-child
+          &:after
+            content: " "
+
+%flex-control-nav
+  position: relative
+  bottom: 30px
+  right: 0px
+  text-align: right
+  z-index: 3
+  float: right
+
+
+%flex-direction-nav
+  .flex-direction-nav
+    //position: relative
+    a, .flex-disabled a
+      margin-top: -20px
+      line-height: 1
+      font-size: 0
+      color: white
+      +border-radius(3px)
+      +breakpoint($desktop)
+        margin-top: -20px
+      &:before,
+      &:after
+        content: ""
+        width: 32px
+        height: 40px
+        background-repeat: no-repeat
+        background-size: 35%
+        background-color: $primary
+        background-position: 50%
+    a.flex-prev
+      left: 5px
+      &:before
+        +svg-bg-simple("arrow-left")
+      
+    a.flex-next
+      right: 5px
+      &:before
+        +svg-bg-simple("arrow-right")
+
+
+
+%flexslider-buttons
+  +hide-text
+  display: block
+  width: 20px
+  height: 20px
+  position: absolute
+  top: 10px
+  z-index: map-get($zindex, content)
+
+
+
+

data/lib/stylesheets/base_components/content_modules/_sticky_menu.sass

@@ -0,0 +1,40 @@
+%sticky-wrapper
+  z-index: map-get($zindex, header)
+  position: relative
+  clear: both
+  +breakpoint($mobile-device)
+    z-index: map-get($zindex, content) !important
+    .panel-region-sticky-menu
+      position: relative !important
+      top: inherit !important
+      
+%sticky-menu
+  float: left !important
+  clear: both !important
+  clear: both !important
+  height: 40px
+  z-index: map-get($zindex, header)
+  width: 100%
+  max-width: 1020px
+  margin: 0 0 0 -20px
+  +breakpoint($mobile-device)
+    margin: 20px 0 0 0
+  .menu .leaf
+    list-style: none
+    display: inline-block
+  .menu
+    padding-top: 9px
+    li
+      margin: 0 6px
+      a
+        padding: 0 5px 4px 7px
+
+
+
+%sticky-menu-anchor
+  display: block
+  position: relative
+  top: -50px
+  visibility: hidden
+  +breakpoint($desktop)
+    top: -170px

data/lib/stylesheets/base_utilities/README.md

@@ -0,0 +1,16 @@
+# Variables
+Sass allows you to define variables that can be used throughout your Sass files.
+Using variables makes it much easier to ensure consistency throughout your
+stylesheets for values such as colors and numeric values. Variables are also
+used for configuration by many Sass extensions. Some examples of values that
+should be defined as variables are:
+
+* Colors scheme.
+* Spacing units, for example vertical and horizontal spacing units.
+* Font sizes and related metrics such as line height.
+* Font stacks.
+* Grid sizing
+* Legacy browser support.
+
+
+This folder can also contain abstractions such as contains Sass mixins, extends and functions for use throughout your stylesheets and help to promote code reuse.

data/lib/stylesheets/base_utilities/_admin.sass

@@ -0,0 +1,9 @@
+@mixin mobile-admin-menu-positioning($admin-nav: 0)
+  position: fixed
+  top: (0 + $admin-nav)
+  .navbar-administration &
+    top: (40px + $admin-nav)
+  .navbar-tray-open.navbar-horizontal &
+    top: (80px + $admin-nav)
+  .responsive-preview-frame &
+    top: (0 + $admin-nav) !important

data/lib/stylesheets/base_utilities/_animations.sass

@@ -0,0 +1,47 @@
+//**************************************
+// Animations
+
+@mixin transition
+  -webkit-transition: 1.0s
+  -moz-transition: 1.0s
+  -o-transition: 1.0s
+  transition: 1.0s
+
+// check out https://github.com/at-import/animation-studio
+// for more mixins
+
+@mixin alerted() 
+  &:before 
+    content: ''
+    position: absolute
+    top: 6px 
+    right: 6px
+    height: 8px 
+    width: 8px
+    +border-radius(10px)
+    background-color: gold
+  
+  &:after 
+    content: ''
+    position: absolute
+    top: 0 
+    right: 0
+    height: 20px 
+    width: 20px
+    +border-radius(20px)
+    background-color: transparent
+    border: solid gold
+    border-width: 2px // animates
+    +box-sizing(border-box)
+    +animation($name: alertMe)
+  
+@keyframes alertMe 
+  // -vendor prefixes omitted for brevity, but should be used in production
+  from 
+    border-width: 3px
+    border-color: gold
+  
+  to 
+    border-width: 0
+    border-color: rgba(gold, .1)
+  

data/lib/stylesheets/base_utilities/_breakpoints.sass

@@ -0,0 +1,59 @@
+// BREAKPOINTS
+$breakpoint-to-ems: true
+
+$print-media: 'print'
+$hidpi: min-resolution 143dppx
+
+// For use with max-width only:
+// +breakpoint(max-width: $tab-l)
+$phone-p: 319px
+$phone-l: 479px
+$tab-p: 639px 
+$tab-l: 769px
+$desk: 1020px
+$desk-full: 1079px
+
+// For use with min-width (default breakpoint mixin)
+// +breakpoint($desktop)
+$smartphone-portrait: 'screen' ($phone-p + 1px)
+$smartphone-landscape: 'screen' ($phone-l + 1px)
+$tablet-portrait: 'screen' ($tab-p + 1px)
+$tablet-landscape: 'screen' ($tab-l + 1px)
+$desktop: ($desk + 1px), 'no-query' '.lt-ie9' 
+
+$desktop-print: ($desk + 1px), $print-media, 'no-query' '.lt-ie9'
+// use
+//     $breakpoint-no-queries: true
+//     $breakpoint-no-query-fallbacks: '.lt-ie9' !global
+// at the top of a panel layout sass file to
+// re-render everything with .lt-ie9 for desktop media queries.
+
+
+//////////////////////////////
+// COMBINATIONS
+
+// Phones
+$max-phone-p: 'screen' (max-width $phone-p)
+$max-phone-l: 'screen' (max-width $phone-l)
+$phone-p-phone-l: 'screen' ($phone-p + 1px) $phone-l
+
+// Tablets
+$max-tab-p: 'screen' (max-width $tab-p)
+$max-tab-l: 'screen' (max-width $tab-l)
+$phone-l-tab-p: 'screen' ($phone-p + 1px) $tab-p
+$phone-l-tab-l: 'screen' ($phone-l + 1px) $tab-l
+$tab-p-tab-l: 'screen' ($tab-p + 1px) $tab-l
+$tab-p-desk: 'screen' ($tab-p + 1px) $desk
+$tab-l-desk: 'screen' ($tab-l + 1px) $desk
+
+// All Mobile
+$mobile-device: 'screen' max-width $desk
+
+// High Resolution Devices
+$mobile-hi-res: 'screen' (max-width $desk) ($hidpi)
+$desk-hi-res: 'screen' (min-width $desk) ($hidpi)
+
+
+@mixin fallback
+  .lt-ie9 &
+    @content

data/lib/stylesheets/base_utilities/_colors.sass

@@ -0,0 +1,23 @@
+//**************************************//
+// Basic Colors
+$text-primary: #333
+$text-secondary: #666
+$text-tertiary: #999
+$text-quaternary: #ccc
+
+$alert:   #cc0000
+$page-bg: white
+
+
+//**************************************//
+$contrasted-dark-default: $text-primary
+$contrasted-light-default: white
+
+@mixin color-contrasted($background-color, $dark: $contrasted-dark-default, $light: $contrasted-light-default, $threshold: $contrasted-lightness-threshold)
+  background-color: $background-color
+  color: contrast-color($background-color, $dark, $light, $threshold)
+  background: $bg
+  border: 1px solid $brdr
+  &:hover,
+  &:focus
+    background: $bg-hover