skeletor_backbone 0.0.3

data/app/assets/stylesheets/skeletor/globals/css3/_perspective.sass

@@ -0,0 +1,50 @@
+// =============================================================================
+//  Perspective
+//
+//  The perspective property gives an element a 3d-space by affecting the
+//  distance between the Z plane and the user.
+//
+//  http://www.w3.org/TR/css3-3d-transforms/#perspective-property
+//  http://www.w3.org/TR/css3-3d-transforms/#perspective-origin-property
+//  http://css-tricks.com/almanac/properties/p/perspective/
+//
+// =============================================================================
+
+
+
+// -----------------------------------------------------------------------------
+//  Perspective
+// -----------------------------------------------------------------------------
+=skeletor-perspective($args)
+  +skeletor-prefixer(perspective, unquote($args))
+
+
+
+// -----------------------------------------------------------------------------
+//  Perspective Origin
+// -----------------------------------------------------------------------------
+=skeletor-perspective-origin($args)
+  +skeletor-prefixer(perspective-origin, unquote($args))
+
+
+
+// -----------------------------------------------------------------------------
+//  Alias for perspective classes
+// -----------------------------------------------------------------------------
+=s-perspective($args)
+  +skeletor-perspective($args)
+
+=s-perspective-origin($args)
+  +skeletor-perspective-origin($args)
+
+
+
+// -----------------------------------------------------------------------------
+//  If no-conflict set to allow shorter mixin names
+// -----------------------------------------------------------------------------
+// @if $no-conflict
+//   =perspective($args)
+//     +skeletor-perspective($args)
+
+//   =perspective-origin($args)
+//     +skeletor-perspective-origin($args)

data/app/assets/stylesheets/skeletor/globals/css3/_prefixer.sass

@@ -0,0 +1,76 @@
+// =============================================================================
+//  Prefixer Classes
+//
+//  The prefixer mixin is used primarily by css3 mixins to easily generate
+//  browser property and value prefixes when needed.
+//
+//  Available As:
+//    +skeletor-prefixer()
+//    +s-prefixer()
+//    +skeletor-prefixer-value()
+//    +s-prefixer-value()
+//
+// =============================================================================
+
+
+
+// -----------------------------------------------------------------------------
+//  Prefix Property with vendor 'prefixes'
+// -----------------------------------------------------------------------------
+=skeletor-prefixer($property, $value, $supportWebkit: $webkitSupport, $supportFirefox: $firefoxSupport, $supportExplorer: $explorerSupport, $supportOpera: $operaSupport)
+  @if $supportWebkit
+    -webkit-#{$property}: $value
+
+  @if $supportFirefox
+    -moz-#{$property}: $value
+
+  @if $supportExplorer
+    -ms-#{$property}: $value
+
+  @if $supportOpera
+    -o-#{$property}: $value
+
+  #{$property}: $value
+
+
+
+// -----------------------------------------------------------------------------
+//  Prefix Property with values 'prefixes'
+// -----------------------------------------------------------------------------
+=skeletor-prefixer-value($property, $value, $supportWebkit: $webkitSupport, $supportFirefox: $firefoxSupport, $supportExplorer: $explorerSupport, $supportOpera: $operaSupport)
+  @if $supportWebkit
+    #{$property}: -webkit-#{$value}
+
+  @if $supportFirefox
+    #{$property}: -moz-#{$value}
+
+  @if $supportExplorer
+    #{$property}: -ms-#{$value}
+
+  @if $supportOpera
+    #{$property}: -o-#{$value}
+
+  #{$property}: $value
+
+
+
+// -----------------------------------------------------------------------------
+//  Alias for prefixer classes
+// -----------------------------------------------------------------------------
+=s-prefixer($property, $value, $supportWebkit: $webkitSupport, $supportFirefox: $firefoxSupport, $supportExplorer: $explorerSupport, $supportOpera: $operaSupport)
+  +skeletor-prefixer($property, $value, $supportWebkit, $supportFirefox, $supportExplorer, $supportOpera)
+
+=s-prefixer-value($property, $value, $supportWebkit: $webkitSupport, $supportFirefox: $firefoxSupport, $supportExplorer: $explorerSupport, $supportOpera: $operaSupport)
+  +skeletor-prefixer-value($property, $value, $supportWebkit, $supportFirefox, $supportExplorer, $supportOpera)
+
+
+
+// -----------------------------------------------------------------------------
+//  If no-conflict set to allow shorter mixin names
+// -----------------------------------------------------------------------------
+// @if $no-conflict
+//   =prefixer($property, $value, $supportWebkit: $webkitSupport, $supportFirefox: $firefoxSupport, $supportExplorer: $explorerSupport, $supportOpera: $operaSupport)
+//     +skeletor-prefixer($property, $value, $supportWebkit, $supportFirefox, $supportExplorer, $supportOpera)
+
+//   =prefixer-value($property, $value, $supportWebkit: $webkitSupport, $supportFirefox: $firefoxSupport, $supportExplorer: $explorerSupport, $supportOpera: $operaSupport)
+//     +skeletor-prefixer-value($property, $value, $supportWebkit, $supportFirefox, $supportExplorer, $supportOpera)

data/app/assets/stylesheets/skeletor/globals/css3/_tab_size.sass

@@ -0,0 +1,39 @@
+// =============================================================================
+//  Tab Size Mixin
+//
+//  The tab-size property in CSS is used to adjust the amount of spaces that
+//  display for the tab character.
+//
+//  Available As:
+//    +skeletor-tab-size()
+//    +s-tab-size()
+//
+//  https://developer.mozilla.org/en-US/docs/Web/CSS/tab-size
+//  http://css-tricks.com/almanac/properties/t/tab-size/
+//
+// =============================================================================
+
+
+
+// -----------------------------------------------------------------------------
+//  Tab Size
+// -----------------------------------------------------------------------------
+=skeletor-tab-size($args)
+  +skeletor-prefixer(tab-size, unquote($args), false, true, false, true)
+
+
+
+// -----------------------------------------------------------------------------
+//  Alias for tab size classes
+// -----------------------------------------------------------------------------
+=s-tab-size($args)
+  +skeletor-tab-size($args)
+
+
+
+// -----------------------------------------------------------------------------
+//  If no-conflict set to allow shorter mixin names
+// -----------------------------------------------------------------------------
+// @if $no-conflict
+//   =tab-size($args)
+//     +skeletor-tab-size($args)

data/app/assets/stylesheets/skeletor/globals/css3/_text_shadow.sass

@@ -0,0 +1,38 @@
+// =============================================================================
+//  Text Shadow
+//
+//  The text-shadow property is used to attach a shadow to text.
+//
+//  Additional As:
+//    +skeletor-text-shadow()
+//    +s-text-shadow()
+//
+//  http://www.w3.org/TR/css3-text/#text-shadow
+//  http://css-tricks.com/almanac/properties/a/appearance/
+//
+// =============================================================================
+
+
+
+// -----------------------------------------------------------------------------
+//  Text Shadow
+// -----------------------------------------------------------------------------
+=skeletor-text-shadow($args)
+  +skeletor-prefixer(text-shadow, unquote($args))
+
+
+
+// -----------------------------------------------------------------------------
+//  Alias for text-shadow classes
+// -----------------------------------------------------------------------------
+=s-text-shadow($args)
+  +skeletor-text-shadow($args)
+
+
+
+// -----------------------------------------------------------------------------
+//  If no-conflict set to allow shorter mixin names
+// -----------------------------------------------------------------------------
+// @if $no-conflict
+//   =text-shadow($args)
+//     +skeletor-text-shadow($args)

data/app/assets/stylesheets/skeletor/globals/css3/_transform.sass

@@ -0,0 +1,112 @@
+// =============================================================================
+//  Transform
+//
+//  The transform property allows you to visually manipulate elements,
+//  transforming their appearance.
+//
+//  http://www.w3.org/TR/css3-2d-transforms/
+//  http://www.w3.org/TR/css3-3d-transforms/#transform-origin-property
+//  http://www.w3.org/TR/css3-3d-transforms/#transform-style-property
+//  http://www.w3.org/TR/css3-3d-transforms/#transform-functions
+//  http://css-tricks.com/almanac/properties/t/transform/
+//
+// =============================================================================
+
+
+
+// -----------------------------------------------------------------------------
+//  Transform
+// -----------------------------------------------------------------------------
+=skeletor-transform($args)
+  +skeletor-prefixer(transform, unquote($args))
+
+// Shorthand transform mixins
+=skeletor-matrix($args)
+  +skeletor-transform(matrix(unquote($args)))
+
+=skeletor-translate($args)
+  +skeletor-transform(translate(unquote($args)))
+
+=skeletor-scale($args)
+  +skeletor-transform(scale(unquote($args)))
+
+=skeletor-rotate($args)
+  +skeletor-transform(rotate(unquote($args)))
+
+=skeletor-skew($args)
+  +skeletor-transform(skew(unquote($args)))
+
+
+
+// -----------------------------------------------------------------------------
+//  Transform Origin
+// -----------------------------------------------------------------------------
+=skeletor-transform-origin($args)
+  +skeletor-prefixer(transform-origin, unquote($args))
+
+
+
+// -----------------------------------------------------------------------------
+//  Transform Style
+// -----------------------------------------------------------------------------
+=skeletor-transform-style($args)
+  +skeletor-prefixer(transform-style, unquote($args))
+
+
+
+// -----------------------------------------------------------------------------
+//  Alias for transform classes
+// -----------------------------------------------------------------------------
+=s-transform($args)
+  +skeletor-transform($args)
+
+=s-transform-origin($args)
+  +skeletor-transform-origin($args)
+
+=s-transform-style($args)
+  +skeletor-transform-style($args)
+
+=s-matrix($args)
+  +skeletor-matrix($args)
+
+=s-translate($args)
+  +skeletor-translate($args)
+
+=s-scale($args)
+  +skeletor-scale($args)
+
+=s-rotate($args)
+  +skeletor-rotate($args)
+
+=s-skew($args)
+  +skeletor-skew($args)
+
+
+
+// -----------------------------------------------------------------------------
+//  If no-conflict set to allow shorter mixin names
+// -----------------------------------------------------------------------------
+// @if $no-conflict
+//   =transform($args)
+//     +skeletor-transform($args)
+
+//   =transform-origin($args)
+//     +skeletor-transform-origin($args)
+
+//   =transform-style($args)
+//     +skeletor-transform-style($args)
+
+//   =matrix($args)
+//     +skeletor-matrix($args)
+
+//   =translate($args)
+//     +skeletor-translate($args)
+
+//   =scale($args)
+//     +skeletor-scale($args)
+
+//   =rotate($args)
+//     +skeletor-rotate($args)
+
+//   =skew($args)
+//     +skeletor-skew($args)

data/app/assets/stylesheets/skeletor/globals/css3/_transition.sass

@@ -0,0 +1,35 @@
+// =============================================================================
+//  Transition
+//
+//  The transition property is a shorthand property used to represent up to four
+//  transition-related longhand properties.
+//
+//  http://www.w3.org/TR/css3-transitions/
+//  http://css-tricks.com/almanac/properties/t/transition/
+//
+// =============================================================================
+
+
+
+// -----------------------------------------------------------------------------
+//  Transition
+// -----------------------------------------------------------------------------
+=skeletor-transition($args)
+  +skeletor-prefixer(transition, unquote($args))
+
+
+
+// -----------------------------------------------------------------------------
+//  Alias for transition classes
+// -----------------------------------------------------------------------------
+=s-transition($args)
+  +skeletor-transition($args)
+
+
+
+// -----------------------------------------------------------------------------
+//  If no-conflict set to allow shorter mixin names
+// -----------------------------------------------------------------------------
+// @if $no-conflict
+//   =transition($args)
+//     +skeletor-transition($args)

data/app/assets/stylesheets/skeletor/globals/css3/_user_select.sass

@@ -0,0 +1,39 @@
+// =============================================================================
+//  User Select Mixins
+//
+//  This is useful in situations where you want to provide an easier/cleaner
+//  copy-paste experience for users
+//
+//  Available As:
+//    +skeletor-user-select()
+//    +s-user-select()
+//
+//  https://developer.mozilla.org/en-US/docs/Web/CSS/user-select
+//  http://css-tricks.com/almanac/properties/u/user-select/
+//
+// =============================================================================
+
+
+
+// -----------------------------------------------------------------------------
+//  User Select
+// -----------------------------------------------------------------------------
+=skeletor-user-select($args)
+  +skeletor-prefixer(user-select, unquote($args))
+
+
+
+// -----------------------------------------------------------------------------
+//  Alias for user select classes
+// -----------------------------------------------------------------------------
+=s-user-select($args)
+  +skeletor-user-select($args)
+
+
+
+// -----------------------------------------------------------------------------
+//  If no-conflict set to allow shorter mixin names
+// -----------------------------------------------------------------------------
+// @if $no-conflict
+//   =user-select($args)
+//     +skeletor-user-select($args)

data/app/assets/stylesheets/skeletor/globals/functions/_calculate_em.sass

@@ -0,0 +1,43 @@
+// =============================================================================
+//  Calculate EM
+//
+//  This function is used to return the calculated results of EM based on the
+//  provided pixel values.
+//
+// Available as:
+//    skeletor-calculate-em()
+//    s-calculate-em()
+//    s-ce()
+//
+// =============================================================================
+
+
+
+// -----------------------------------------------------------------------------
+//  Calculate EM
+// -----------------------------------------------------------------------------
+@function skeletor-calculate-em($target, $context: $base-font-size)
+  //@if not unitless($target)
+  $target: skeletor-strip-units($target)
+  $context: skeletor-strip-units($context)
+
+  @return ($target / $context) * 1em
+
+
+
+// -----------------------------------------------------------------------------
+//  Alias for calculate em function
+// -----------------------------------------------------------------------------
+@function s-calculate-em($target, $context: $base-font-size)
+  @return skeletor-calculate-em($target, $context)
+
+@function s-ce($target, $context: $base-font-size)
+  @return skeletor-calculate-em($target, $context)
+
+
+// -----------------------------------------------------------------------------
+//  If no-conflict set to allow shorter function names
+// -----------------------------------------------------------------------------
+// @if $no-conflict
+//   @function calculate-em($target, $context: $base-font-size)
+//     @return skeletor-calculate-em($target, $context)

data/app/assets/stylesheets/skeletor/globals/functions/_calculate_modular_scale.sass

@@ -0,0 +1,85 @@
+// =============================================================================
+//  Calculate Modular Scale
+//
+//  This function is responsible for making all the calculations related to the
+//  modular scale.
+//
+// Available as:
+//    skeletor-modular-scale()
+//    skeletor-ms()
+//    s-modular-scale()
+//    s-ms()
+//
+// =============================================================================
+
+
+
+@function skeletor-modular-scale($position, $base-size: $ms-base-size, $ratio: $ms-ratio, $round-pixels: $ms-round-pixels)
+  @if $position == 0
+    @return $base-size
+
+  $result: power($ratio, $position) * $base-size
+
+  @if $round-pixels == true
+    $result: round($result)
+
+  @return $result
+
+
+
+// -----------------------------------------------------------------------------
+//  Alias for modular scale function
+// -----------------------------------------------------------------------------
+@function skeletor-ms($position, $base-size: $ms-base-size, $ratio: $ms-ratio, $round-pixels: $ms-round-pixels)
+  @return skeletor-modular-scale($position, $base-size, $ratio, $round-pixels)
+
+@function s-modular-scale($position, $base-size: $ms-base-size, $ratio: $ms-ratio, $round-pixels: $ms-round-pixels)
+  @return skeletor-modular-scale($position, $base-size, $ratio, $round-pixels)
+
+@function s-ms($position, $base-size: $ms-base-size, $ratio: $ms-ratio, $round-pixels: $ms-round-pixels)
+  @return skeletor-modular-scale($position, $base-size, $ratio, $round-pixels)
+
+
+// -----------------------------------------------------------------------------
+//  If no-conflict set to allow shorter function names
+// -----------------------------------------------------------------------------
+// @if $no-conflict
+//   @function ms($position, $base-size: $ms-base-size, $ratio: $ms-ratio, $round-pixels: $ms-round-pixels)
+//     @return skeletor-modular-scale($position, $base-size, $ratio, $round-pixels)
+
+//   @function modular-scale($position, $base-size: $ms-base-size, $ratio: $ms-ratio, $round-pixels: $ms-round-pixels)
+//     @return skeletor-modular-scale($position, $base-size, $ratio, $round-pixels)
+
+
+
+
+
+// *****************************************************************************
+//  DEBUGGING
+// *****************************************************************************
+
+// Write Modular Scale List to command line
+@function skeletor-modular-scale-list($start: 0, $finish: 20, $base-size: $ms-base-size, $ratio: $ms-ratio, $round-pixels: $ms-round-pixels)
+  $ms-list: unquote("MS-LIST:")
+  @for $i from $start through $finish
+    $ms-list: append($ms-list, ms($i, $base-size, $ratio, $round-pixels))
+
+  @return $ms-list
+
+// Shortcut alias for modular-scale-list
+@function skeletor-ms-list($start: 0, $finish: 20, $base-size: $ms-base-size, $ratio: $ms-ratio, $round-pixels: $ms-round-pixels)
+  @return skeletor-modular-scale-list($start, $finish, $base-size, $ratio, $round-pixels)
+
+@function s-ms-list($start: 0, $finish: 20, $base-size: $ms-base-size, $ratio: $ms-ratio, $round-pixels: $ms-round-pixels)
+  @return skeletor-modular-scale-list($start, $finish, $base-size, $ratio, $round-pixels)
+
+
+// Modular Scale Mixin for handling debugging to command line
+=skeletor-modular-scale-list($start: 0, $finish: 20, $base-size: $ms-base-size, $ratio: $ms-ratio, $round-pixels: $ms-round-pixels)
+  @debug skeletor-modular-scale-list($start, $finish, $base-size, $ratio, $round-pixels)
+
+=s-modular-scale-list($start: 0, $finish: 20, $base-size: $ms-base-size, $ratio: $ms-ratio, $round-pixels: $ms-round-pixels)
+  @debug skeletor-modular-scale-list($start, $finish, $base-size, $ratio, $round-pixels)
+
+=s-ms-list($start: 0, $finish: 20, $base-size: $ms-base-size, $ratio: $ms-ratio, $round-pixels: $ms-round-pixels)
+  @debug skeletor-modular-scale-list($start, $finish, $base-size, $ratio, $round-pixels)