RubyGems - survivalkit - Versions diffs - 0.2.1 → 0.3 - Mend

survivalkit 0.2.1 → 0.3

Files changed (159) hide show

data/lib/survivalkit.rb CHANGED Viewed

@@ -3,7 +3,7 @@ Compass::Frameworks.register("survivalkit", :path => "#{File.dirname(__FILE__)}/
 module SurvivalKit
-  VERSION = "0.2.1"
-  DATE = "2012-03-03"
+  VERSION = "0.3"
+  DATE = "2012-05-22"
 end

data/stylesheets/survivalkit/extend/_helpers.sass CHANGED Viewed

@@ -1,28 +1,32 @@
 @import ../mixins/helpers
-.clearfix
+%clearfix
   +kit-clearfix
+.clearfix
+  @extend %clearfix
-.hidden
+%hidden
   +hidden
+.hidden
+  @extend %hidden
-.visuallyhidden
+%visuallyhidden
   +visuallyhidden
-.visuallyhidden.focusable
+%visuallyhidden.focusable
   +visuallyhidden(true)
-.invisible
+%invisible
   +invisible
-.constrain-to-parent
+%constrain-to-parent
   max-width: 100%
-.italic
+%italic
   font-style: italic
-.bold
+%bold
   font-weight: bold
-.wireframe
+%wireframe
   outline: 1px dashed $red

data/stylesheets/survivalkit/extend/_sticky-footer.sass CHANGED Viewed

@@ -2,17 +2,17 @@
 // FLEXIBLE STICKY FOOTERS
 // http://pixelsvsbytes.com/blog/2011/09/sticky-css-footers-the-flexible-way/
 ////////////////////////////
-.html-frame
+%html-frame
   // apply to <html> and <body>
   height: 100%
   margin: 0pt
-.frame
+%frame
   // aplly to <body>
   display: table
   height: 100%
   width: 100%
-.row
+%row
   display: table-row
-.row-expand
+%row-expand
   @extend .row
   height: 100%

data/stylesheets/survivalkit/mixins/_all.sass CHANGED Viewed

@@ -1,5 +1,6 @@
 @import helpers
 @import typography
 @import layout
+@import breakpoint
 @import ui
 @import pseudo

data/stylesheets/survivalkit/mixins/_breakpoint.sass ADDED Viewed

@@ -0,0 +1,68 @@
+// experimental - depends on Sass 3.2 or higher
+  define your own breakpoints
+  styles nested in the mixin will pass thru in @content
+  resist the urge to settle on common device sizes
+  http://marcdrummond.com/responsive-web-design/2011/12/29/default-breakpoints-are-dead
+////////////////////////////
+// SURVIVAL KIT - BREAKPOINT
+// breakpoint($breakpoint, $media: 'screen')
+//
+// // create $breakpoint variables like so
+// // assume $breakpoint-default-feature if only a number
+// $breakpoint1: 500px
+// $breakpoint2: 30em
+// // set min-width/max-width if both values are numbers
+// $breakpoint3: 500px 700px
+// // if one value is a string, assume a feature/value pair
+// $breakpoint4: min-width 700px
+// $breakpoint5: max-width 700px
+// // for multidimensional lists, assume each item is a feature/value pair
+// $breakpoint6: max-width 700px, orientation portrait
+// // handle one-sided features (ie. monochrome)
+// $breakpoint7: max-width 700px, orientation portrait, monochrome
+// $breakpoint8: monochrome
+////////////////////////////
+$breakpoint-default-feature: min-width !default
+@function breakpoint-concatenate($query-string, $new-value, $feature: $breakpoint-default-feature)
+  $new-string: ''
+  @if $feature != false
+    $new-string: #{$query-string}unquote("and (#{$feature}:  #{$new-value}) ")
+  @else
+    $new-string: #{$query-string}unquote("and (#{$new-value}) ")
+  @return $new-string
+=breakpoint($breakpoint, $media: 'screen')
+  // initialize string
+  $query-string: '#{$media} '
+  @if type-of($breakpoint) == number
+    // assume max-width if only a number
+    $query-string: breakpoint-concatenate($query-string, $breakpoint)
+  @if type-of($breakpoint) == string
+    // handle one-sided features (ie. monochrome)
+    $query-string: breakpoint-concatenate($query-string, $breakpoint, false)
+  @else if type-of($breakpoint) == list
+    @if (type-of(nth($breakpoint, 1)) == number) and (type-of(nth($breakpoint, 2)) == number)
+      // set min/max if both values are numbers
+      @if $modular-scale-loaded == true
+        $breakpoint: sort-list($breakpoint)
+      $query-string: breakpoint-concatenate($query-string, nth($breakpoint, 1), 'min-width')
+      $query-string: breakpoint-concatenate($query-string, nth($breakpoint, 2), 'max-width')
+    @else if (type-of(nth($breakpoint, 1)) == string)
+      // if one value is a string, assume a feature/value pair
+      $query-string: breakpoint-concatenate($query-string, nth($breakpoint, 2), nth($breakpoint, 1))
+    @else if (type-of(nth($breakpoint, 1)) == list)
+      // for multidimensional lists, assume each item is a feature value pair
+      @each $item in $breakpoint
+        @if type-of($item) == list
+          // $query-string: #{$query-string}unquote("and (#{nth($item, 1)}:  #{nth($item, 2)}) ")
+          $query-string: breakpoint-concatenate($query-string, nth($item, 2), nth($item, 1))
+        @else
+          // handle one-sided features (ie. monochrome)
+          $query-string: breakpoint-concatenate($query-string, $item, false)
+  // write out the media query
+  @media #{$query-string}
+    @content

data/stylesheets/survivalkit/mixins/_helpers.sass CHANGED Viewed

@@ -44,3 +44,16 @@
   +no-bullets
   margin-left: 0
   padding-left: 0
+=susy-grid-backgrounds
+  @if $show-grid and $show-baseline
+    +susy-grid-background-baseline
+  @else if $show-grid
+    +susy-grid-background
+  @else if $show-baseline
+    +baseline-grid-background
+=susy-grid-background-baseline()
+  +grid-background($total-columns, $column-width, $gutter-width, $base-line-height, $column-width*0, $grid-background-column-color, $grid-background-gutter-color, $grid-background-baseline-color, $force-fluid: true)
+  +background-origin(content-box)
+  +background-clip(content-box)

data/stylesheets/survivalkit/mixins/_pseudo.sass CHANGED Viewed

@@ -2,7 +2,6 @@
 // ABSOLUTE PSEUDO ELEMENTS
 ////////////////////////////
 // $side: can be 'before', 'after', or 'both'
 =pseudo($side: 'before')
   position: relative

data/stylesheets/survivalkit/mixins/_typography.sass CHANGED Viewed

@@ -1,6 +1,6 @@
 // Links --------------------------------------------------------------
 // replace underlines on links with bottom borders
-=better-links($normal, $hover: false, $active: false, $visited: false, $focus: false)
+=underline-links($normal, $hover: false, $active: false, $visited: false, $focus: false)
   &
     text-decoration: none
     border-bottom: 1px solid $normal
@@ -17,7 +17,7 @@
       &:active
         border-bottom-color: $active
-=undo-better-links
+=undo-underline-links
   &
     text-decoration: none
     // border-bottom: inherit

data/stylesheets/survivalkit/reset/_normalize.scss ADDED Viewed

@@ -0,0 +1,506 @@
+@mixin normalize {
+  /*! normalize.css 2012-03-11T12:53 UTC - http://github.com/necolas/normalize.css */
+  /* =============================================================================
+     HTML5 display definitions
+     ========================================================================== */
+  /*
+   * Corrects block display not defined in IE6/7/8/9 & FF3
+   */
+  article,
+  aside,
+  details,
+  figcaption,
+  figure,
+  footer,
+  header,
+  hgroup,
+  nav,
+  section,
+  summary {
+      display: block;
+  }
+  /*
+   * 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 styling for 'hidden' attribute not present in IE7/8/9, FF3, S4
+   * Known issue: no IE6 support
+   */
+  [hidden] {
+      display: none;
+  }
+  /* =============================================================================
+     Base
+     ========================================================================== */
+  /*
+   * 1. Corrects text resizing oddly in IE6/7 when body font-size is set using em units
+   *    http://clagnut.com/blog/348/#c790
+   * 2. Prevents iOS text size adjust after orientation change, without disabling user zoom
+   *    www.456bereastreet.com/archive/201012/controlling_text_size_in_safari_for_ios_without_disabling_user_zoom/
+   */
+  html {
+      font-size: 100%; /* 1 */
+      -webkit-text-size-adjust: 100%; /* 2 */
+      -ms-text-size-adjust: 100%; /* 2 */
+  }
+  /*
+   * Addresses font-family inconsistency between 'textarea' and other form elements.
+   */
+  html,
+  button,
+  input,
+  select,
+  textarea {
+      font-family: sans-serif;
+  }
+  /*
+   * Addresses margins handled incorrectly in IE6/7
+   */
+  body {
+      margin: 0;
+  }
+  /* =============================================================================
+     Links
+     ========================================================================== */
+  /*
+   * Addresses outline displayed oddly in Chrome
+   */
+  a:focus {
+      outline: thin dotted;
+  }
+  /*
+   * Improves readability when focused and also mouse hovered in all browsers
+   * people.opera.com/patrickl/experiments/keyboard/test
+   */
+  a:hover,
+  a:active {
+      outline: 0;
+  }
+  /* =============================================================================
+     Typography
+     ========================================================================== */
+  /*
+   * Addresses font sizes and margins set differently in IE6/7
+   * Addresses font sizes within 'section' and 'article' in FF4+, Chrome, S5
+   */
+  h1 {
+      font-size: 2em;
+      margin: 0.67em 0;
+  }
+  h2 {
+      font-size: 1.5em;
+      margin: 0.83em 0;
+  }
+  h3 {
+      font-size: 1.17em;
+      margin: 1em 0;
+  }
+  h4 {
+      font-size: 1em;
+      margin: 1.33em 0;
+  }
+  h5 {
+      font-size: 0.83em;
+      margin: 1.67em 0;
+  }
+  h6 {
+      font-size: 0.75em;
+      margin: 2.33em 0;
+  }
+  /*
+   * Addresses styling not present in IE7/8/9, S5, Chrome
+   */
+  abbr[title] {
+      border-bottom: 1px dotted;
+  }
+  /*
+   * Addresses style set to 'bolder' in FF3+, S4/5, Chrome
+  */
+  b,
+  strong {
+      font-weight: bold;
+  }
+  blockquote {
+      margin: 1em 40px;
+  }
+  /*
+   * Addresses styling not present in S5, Chrome
+   */
+  dfn {
+      font-style: italic;
+  }
+  /*
+   * Addresses styling not present in IE6/7/8/9
+   */
+  mark {
+      background: #ff0;
+      color: #000;
+  }
+  /*
+   * Addresses margins set differently in IE6/7
+   */
+  p,
+  pre {
+      margin: 1em 0;
+  }
+  /*
+   * Corrects font family set oddly in IE6, S4/5, Chrome
+   * en.wikipedia.org/wiki/User:Davidgothberg/Test59
+   */
+  pre,
+  code,
+  kbd,
+  samp {
+      font-family: monospace, serif;
+      _font-family: 'courier new', monospace;
+      font-size: 1em;
+  }
+  /*
+   * Improves readability of pre-formatted text in all browsers
+   */
+  pre {
+      white-space: pre;
+      white-space: pre-wrap;
+      word-wrap: break-word;
+  }
+  /*
+   * 1. Addresses CSS quotes not supported in IE6/7
+   * 2. Addresses quote property not supported in S4
+   */
+  /* 1 */
+  q {
+      quotes: none;
+  }
+  /* 2 */
+  q:before,
+  q:after {
+      content: '';
+      content: none;
+  }
+  small {
+      font-size: 75%;
+  }
+  /*
+   * Prevents sub and sup affecting line-height in all browsers
+   * gist.github.com/413930
+   */
+  sub,
+  sup {
+      font-size: 75%;
+      line-height: 0;
+      position: relative;
+      vertical-align: baseline;
+  }
+  sup {
+      top: -0.5em;
+  }
+  sub {
+      bottom: -0.25em;
+  }
+  /* =============================================================================
+     Lists
+     ========================================================================== */
+  /*
+   * Addresses margins set differently in IE6/7
+   */
+  dl,
+  menu,
+  ol,
+  ul {
+      margin: 1em 0;
+  }
+  dd {
+      margin: 0 0 0 40px;
+  }
+  /*
+   * Addresses paddings set differently in IE6/7
+   */
+  menu,
+  ol,
+  ul {
+      padding: 0 0 0 40px;
+  }
+  /*
+   * Corrects list images handled incorrectly in IE7
+   */
+  nav ul,
+  nav ol {
+      list-style: none;
+      list-style-image: none;
+  }
+  /* =============================================================================
+     Embedded content
+     ========================================================================== */
+  /*
+   * 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;
+  }
+  /* =============================================================================
+     Figures
+     ========================================================================== */
+  /*
+   * Addresses margin not present in IE6/7/8/9, S5, O11
+   */
+  figure {
+      margin: 0;
+  }
+  /* =============================================================================
+     Forms
+     ========================================================================== */
+  /*
+   * Corrects margin displayed oddly in IE6/7
+   */
+  form {
+      margin: 0;
+  }
+  /*
+   * Define consistent border, margin, and padding
+   */
+  fieldset {
+      border: 1px solid #c0c0c0;
+      margin: 0 2px;
+      padding: 0.35em 0.625em 0.75em;
+  }
+  /*
+   * 1. Corrects color not being inherited in IE6/7/8/9
+   * 2. Corrects text not wrapping in FF3
+   * 3. Corrects alignment displayed oddly in IE6/7
+   */
+  legend {
+      border: 0; /* 1 */
+      padding: 0;
+      white-space: normal; /* 2 */
+      *margin-left: -7px; /* 3 */
+  }
+  /*
+   * 1. Corrects font size not being inherited in all browsers
+   * 2. Addresses margins set differently in IE6/7, FF3+, S5, Chrome
+   * 3. Improves appearance and consistency in all browsers
+   */
+  button,
+  input,
+  select,
+  textarea {
+      font-size: 100%; /* 1 */
+      margin: 0; /* 2 */
+      vertical-align: baseline; /* 3 */
+      *vertical-align: middle; /* 3 */
+  }
+  /*
+   * Addresses FF3/4 setting line-height on 'input' using !important in the UA stylesheet
+   */
+  button,
+  input {
+      line-height: normal; /* 1 */
+  }
+  /*
+   * 1. Improves usability and consistency of cursor style between image-type 'input' and others
+   * 2. Corrects inability to style clickable 'input' types in iOS
+   * 3. Removes inner spacing in IE7 without affecting normal text inputs
+   *    Known issue: inner spacing remains in IE6
+   */
+  button,
+  input[type="button"],
+  input[type="reset"],
+  input[type="submit"] {
+      cursor: pointer; /* 1 */
+      -webkit-appearance: button; /* 2 */
+      *overflow: visible;  /* 3 */
+  }
+  /*
+   * Re-set default cursor for disabled elements
+   */
+  button[disabled],
+  input[disabled] {
+      cursor: default;
+  }
+  /*
+   * 1. Addresses box sizing set to content-box in IE8/9
+   * 2. Removes excess padding in IE8/9
+   * 3. Removes excess padding in IE7
+        Known issue: excess padding remains in IE6
+   */
+  input[type="checkbox"],
+  input[type="radio"] {
+      box-sizing: border-box; /* 1 */
+      padding: 0; /* 2 */
+      *height: 13px; /* 3 */
+      *width: 13px; /* 3 */
+  }
+  /*
+   * 1. Addresses appearance set to searchfield in S5, Chrome
+   * 2. Addresses box-sizing set to border-box in S5, Chrome (include -moz to future-proof)
+   */
+  input[type="search"] {
+      -webkit-appearance: textfield; /* 1 */
+      -moz-box-sizing: content-box;
+      -webkit-box-sizing: content-box; /* 2 */
+      box-sizing: content-box;
+  }
+  /*
+   * Removes inner padding and search cancel button in S5, Chrome on OS X
+   */
+  input[type="search"]::-webkit-search-decoration,
+  input[type="search"]::-webkit-search-cancel-button {
+      -webkit-appearance: none;
+  }
+  /*
+   * Removes inner padding and border in FF3+
+   * www.sitepen.com/blog/2008/05/14/the-devils-in-the-details-fixing-dojos-toolbar-buttons/
+   */
+  button::-moz-focus-inner,
+  input::-moz-focus-inner {
+      border: 0;
+      padding: 0;
+  }
+  /*
+   * 1. Removes default vertical scrollbar in IE6/7/8/9
+   * 2. Improves readability and alignment in all browsers
+   */
+  textarea {
+      overflow: auto; /* 1 */
+      vertical-align: top; /* 2 */
+  }
+  /* =============================================================================
+     Tables
+     ========================================================================== */
+  /*
+   * Remove most spacing between table cells
+   */
+  table {
+      border-collapse: collapse;
+      border-spacing: 0;
+  }
+}

data/stylesheets/survivalkit/style-tile/_all.sass ADDED Viewed

	@@ -0,0 +1 @@
1	+ @import tile-layout