survivalkit 0.1

data/templates/project/partials/03-defaults/markup/_tables.sass

@@ -0,0 +1,48 @@
+/* Tables --------------------------------------------------------------
+/* tables still need 'cellspacing="0"' in the markup
+
+table
+  // +trailer
+  // width: 100%
+  max-width: 100%
+
+table, td, th
+  // vertical-align: top
+
+th, thead th
+  // @extend .bold
+
+th, td, caption
+  // padding: $base-rhythm-unit * 0.5
+  // text-align: left
+
+table, th
+  // +trailing-border(1px, 0.5)
+  // border-color: $gray
+  // border-style: dotted
+
+tr.even
+  td
+    // background-color: $gray
+
+tfoot
+  // @extend .bold
+
+caption
+  // @extend .allcaps
+
+colgroup
+
+col
+
+tbody
+
+thead
+
+tfoot
+
+tr
+
+td
+
+th

data/templates/project/partials/03-defaults/markup/forms/_form-defaults.sass

@@ -0,0 +1,67 @@
+/* Forms --------------------------------------------------------------
+
+// USE FORMALIZE TO EVEN FORMS ACROSS BROWSERS
+@import _formalize
+
+// aditional form styles
+
+fieldset
+  +trailer
+  +rhythm-borders(1px)
+  border-color: $base-color
+  border-style: dotted
+
+legend
+  padding: 0 0.25em
+
+label, input[type=button], input[type=submit], button
+  cursor: pointer
+
+label
+  font-weight: bold
+  margin-right: 0.5em
+
+.textinput
+  @extend .sans
+  +adjust-font-size-to(ms(0), 1)
+  +rhythm-borders(1px, 0.25, ms(0))
+  border-width: 1px
+  +trailer(0.5)
+  +box-sizing(border-box)
+  width: ($kit-col-width * 2) + ($kit-gutter * 1)
+  max-width: 100%
+  margin-top: 0
+  border-color: $base-color
+  height: $base-line-height / ms(0) * 1.5em
+
+textarea
+  @extend .textinput
+  height: $base-line-height / ms(0) * 6.5
+
+input
+  &[type=text], &[type=password], &[type=email], &[type=url], &[type=tel],
+  &[type=date], &[type=datetime], &[type=datetime-local], &[type=month], &[type=week], &[type=time],
+  &[type=number], &[type=range], &[type=search], &[type=color]
+    @extend .textinput
+  // reset webkit search styles
+  &[type=search]
+    -webkit-appearance: none
+    &::-webkit-search-decoration
+      display: none
+
+button, input[type=button], input[type=submit]
+  width: auto
+  overflow: visible
+  // +fancy-button($gray, ms(2))
+
+textarea
+  +box-sizing(border-box)
+  width: ($kit-col-width * 2) + ($kit-gutter * 1)
+
+input
+  &[type="radio"], &[type="checkbox"]
+    margin-left: 0.25em
+    margin-right: 0.25em
+
+textarea, input:not([type="radio"])
+  max-width: 100%

data/templates/project/partials/03-defaults/markup/forms/_formalize.sass

@@ -0,0 +1,261 @@
+// Note: This file is dependent on Sass and Compass.
+// Sass = http://sass-lang.com
+// Compass = http://compass-style.org
+
+// `Widths
+//----------------------------------------------------------------------------------------------------
+
+.input_tiny
+  width: 50px
+
+.input_small
+  width: 100px
+
+.input_medium
+  width: 150px
+
+.input_large
+  width: 200px
+
+.input_xlarge
+  width: 250px
+
+.input_xxlarge
+  width: 300px
+
+.input_full
+  width: 100%
+
+// Added via JS to <textarea> and class="input-full".
+// Applies to IE6, IE7. Other browsers don't need it.
+.input_full_wrap
+  display: block
+  padding-right: 8px
+
+// `UI Consistency
+//----------------------------------------------------------------------------------------------------
+
+::-moz-focus-inner
+  border: 0
+
+input[type="search"]::-webkit-search-decoration
+  display: none
+
+input,
+button,
+select,
+textarea
+  -moz-background-clip: padding
+  -webkit-background-clip: padding
+  background-clip: padding-box
+  margin: 0
+  vertical-align: middle
+
+button,
+input[type="reset"],
+input[type="submit"],
+input[type="button"]
+  -webkit-appearance: none
+  +border-radius(11px)
+  background: #ddd url(../images/button.png) repeat-x
+  +background-image(linear-gradient(color-stops(#fff, #ddd)))
+  border: 1px solid
+  border-color: #ddd #bbb #999
+  cursor: pointer
+  color: #333
+  font: bold 12px/1.2 Arial, sans-serif
+  outline: 0
+  overflow: visible
+  padding: 3px 10px 4px
+  text-shadow: #fff 0 1px 1px
+  width: auto
+
+  // IE7
+  *padding-top: 2px
+  *padding-bottom: 0px
+
+button
+  // IE7
+  *padding-top: 1px
+  *padding-bottom: 1px
+
+button[disabled],
+input[type="reset"][disabled],
+input[type="submit"][disabled],
+input[type="button"][disabled]
+  color: #888
+
+textarea,
+select,
+input[type="date"],
+input[type="datetime"],
+input[type="datetime-local"],
+input[type="email"],
+input[type="month"],
+input[type="number"],
+input[type="password"],
+input[type="search"],
+input[type="tel"],
+input[type="text"],
+input[type="time"],
+input[type="url"],
+input[type="week"]
+  -webkit-appearance: none
+  +border-radius(0)
+  +box-sizing(border-box)
+  background-color: #fff
+  border: 1px solid
+  border-color: #848484 #c1c1c1 #e1e1e1
+  color: #000
+  outline: 0
+  padding: 2px 3px
+  font:
+    size: 13px
+    family: Arial, sans-serif
+  height: 1.8em
+
+  // IE7
+  *padding-top: 2px
+  *padding-bottom: 1px
+  *height: auto
+
+// Separate rule for Firefox.
+// Cannot stack with WebKit's.
+
+input.placeholder-text,
+textarea.placeholder-text
+  color: #888
+
+::-webkit-input-placeholder
+  color: #888
+
+textarea[disabled],
+select[disabled],
+input[type="date"][disabled],
+input[type="datetime"][disabled],
+input[type="datetime-local"][disabled],
+input[type="email"][disabled],
+input[type="month"][disabled],
+input[type="number"][disabled],
+input[type="password"][disabled],
+input[type="search"][disabled],
+input[type="tel"][disabled],
+input[type="text"][disabled],
+input[type="time"][disabled],
+input[type="url"][disabled],
+input[type="week"][disabled]
+  background-color: #eee
+  color: #888
+
+button:focus,
+button:active,
+input:focus,
+input:active,
+select:focus,
+select:active,
+textarea:focus,
+textarea:active
+  -moz-box-shadow: #06f 0 0 7px
+  -webkit-box-shadow: #06f 0 0 7px
+  box-shadow: #06f 0 0 7px
+
+  // for Opera
+  z-index: 1
+
+input[type="radio"]:focus,
+input[type="radio"]:active,
+input[type="checkbox"]:focus,
+input[type="checkbox"]:active
+  -moz-box-shadow: none
+  -webkit-box-shadow: none
+  box-shadow: none
+
+.is_webkit select
+  // Tweaks for Safari + Chrome.
+  background:
+    image: url(../images/select_arrow.gif)
+    repeat: no-repeat
+    position: right center
+  padding-right: 20px
+
+textarea,
+select[multiple]
+  height: auto
+
+select[multiple],
+.is_webkit select[multiple]
+  background-image: none
+  padding: 0
+
+textarea
+  min-height: 40px
+  overflow: auto
+  resize: vertical
+  width: 100%
+
+optgroup
+  color: #000
+  font-style: normal
+  font-weight: normal
+
+// `IE6
+//----------------------------------------------------------------------------------------------------
+
+// Everything below this line is for IE6.
+// Delete it if you don't support it! :)
+
+// Classes are added dynamically via JS,
+// because IE6 doesn't support attribute
+// selectors: .ie6_button, .ie6_input, etc.
+
+// Note: These style rules are somewhat
+// duplicated because IE6 bombs out when
+// it sees attribute selectors. Example:
+
+// .ie6_button {
+//   This works in IE6.
+// }
+
+// .ie6_button,
+// input[type=submit] {
+//   This doesn't work.
+// }
+
+.ie6_button,
+* html button
+  background: #ddd url(../images/button.png) repeat-x
+  border: 1px solid
+  border-color: #ddd #bbb #999
+  cursor: pointer
+  color: #333
+  font: bold 12px/1.2 Arial, sans-serif
+  padding: 2px 10px 0px
+  overflow: visible
+  width: auto
+
+* html button
+  padding-top: 1px
+  padding-bottom: 1px
+
+.ie6_input,
+* html textarea,
+* html select
+  background: #fff
+  border: 1px solid
+  border-color: #848484 #c1c1c1 #e1e1e1
+  color: #000
+  padding: 2px 3px 1px
+  font-size: 13px
+  font-family: Arial, sans-serif
+  vertical-align: top
+
+* html select
+  margin-top: 1px
+
+.placeholder_text,
+.ie6_input_disabled,
+.ie6_button_disabled
+  color: #888
+
+.ie6_input_disabled
+  background: #eee

data/templates/project/partials/04-grids/_grids-blueprint.sass

@@ -0,0 +1,20 @@
+// The number of columns in the grid.
+$blueprint-grid-columns: $kit-total-cols !default
+// The width of a column
+$blueprint-grid-width: $kit-col-width !default
+// The amount of margin between columns
+$blueprint-grid-margin: $kit-gutter-width !default
+@import blueprint/grid
+
+// Background grid variables
+$grid-background-total-columns: $kit-total-cols
+$grid-background-column-width: $kit-col-width
+$grid-background-gutter-width: $kit-gutter-width
+$grid-background-baseline-height: $kit-baseline
+// $grid-background-offset: $kit-side-gutter-width
+@import compass/layout/grid-background
+
+
+.container
+  +container
+  +column-grid-background

data/templates/project/partials/04-grids/_grids-susy.sass

@@ -0,0 +1,38 @@
+// SUSY GRID FRAMEWORK
+//**
+//  Susy: Un-obtrusive grids for designers
+//  By: Eric A. Meyer and OddBird
+//  Site: susy.oddbird.net
+//**
+
+// Font Sizes --------------------------------------------------------------
+$base-font-size: 14px !default
+$base-line-height: $kit-baseline
+// Grid Variables --------------------------------------------------------------
+$total-cols: $kit-total-cols
+$col-width: $kit-col-width
+$gutter-width: $kit-gutter-width
+$side-gutter-width: $kit-side-gutter-width
+
+@import susy
+// uncomment to output the full container width to the terminal
+// @debug columns-width()
+
+
+/* DEFINE THE GRID CONTAINER --------------------------------------------------------------
+// BUILD THE GRID FOR YOUR SITE
+// HELPER CLASSES INTENDED FOR USE IN @EXTEND
+.container
+  +container
+  // uncomment to show grid background
+  // +susy-grid-background
+
+// BUILD THE GRID BY CALLING SUSY MIXINS ON DOM ELEMENTS
+// example:
+  body
+    #container
+      @extend .container
+      >
+        header, #main, footer
+          +full
+

data/templates/project/partials/05-ui-patterns/_common.sass

@@ -0,0 +1,26 @@
+// see: elements-ui-patterns.html for markup
+
+// MESSAGES
+.messages
+  border: 1px solid $base-color
+  padding: $kit-baseline-half 0.5em
+  p:last-child
+    margin-bottom: 0
+.status, .warning, .error
+  @extend .messages
+.status
+  border-color: $green
+  color: $green
+.warning
+  border-color: $orange
+  color: $orange
+.error
+  border-color: $red
+  color: $red
+
+// PAGERS
+ul.pager
+  +horizontal-list(0.5em)
+  a
+    +remove-link-underlines
+