sass-rails-bootstrap 2.0.2

data/vendor/assets/stylesheets/twitter/bootstrap/_mixins.sass

@@ -0,0 +1,517 @@
+// Snippets of reusable CSS to develop faster and keep code readable
+// -----------------------------------------------------------------
+
+
+// UTILITY MIXINS
+// --------------------------------------------------
+
+// Clearfix
+// --------
+// For clearing floats like a boss h5bp.com/q
+=clearfix
+  *zoom: 1
+  &:before, &:after
+    display: table
+    content: ""
+  &:after
+    clear: both
+
+// Webkit-style focus
+// ------------------
+=tab-focus
+  // Default
+  outline: thin dotted #333
+  // Webkit
+  outline: 5px auto -webkit-focus-ring-color
+  outline-offset: -2px
+
+// Center-align a block level element
+// ----------------------------------
+=center-block
+  display: block
+  margin-left: auto
+  margin-right: auto
+
+// IE7 inline-block
+// ----------------
+=ie7-inline-block
+  *display: inline  /* IE7 inline-block hack */
+  *zoom: 1
+
+// IE7 likes to collapse whitespace on either side of the inline-block elements.
+// Ems because we're attempting to match the width of a space character. Left
+// version is for form buttons, which typically come after other elements, and
+// right version is for icons, which come before. Applying both is ok, but it will
+// mean that space between those elements will be .6em (~2 space characters) in IE7,
+// instead of the 1 space in other browsers.
+=ie7-restore-left-whitespace
+  *margin-left: .3em
+  &:first-child
+    *margin-left: 0
+
+=ie7-restore-right-whitespace
+  *margin-right: .3em
+  &:last-child
+    *margin-left: 0
+
+// Sizing shortcuts
+// -------------------------
+=size($height: 5px, $width: 5px)
+  width: $width
+  height: $height
+=square($size: 5px)
+  +size($size, $size)
+
+// Placeholder text
+// -------------------------
+=placeholder($color: $placeholderText)
+  \:-moz-placeholder
+    color: $color
+  ::-webkit-input-placeholder
+    color: $color
+
+// Text overflow
+// -------------------------
+// Requires inline-block or block for proper styling
+=text-overflow
+  overflow: hidden
+  text-overflow: ellipsis
+  white-space: nowrap
+
+// New image replacement
+// -------------------------
+// Source: http://www.zeldman.com/2012/03/01/replacing-the-9999px-hack-new-image-replacement/
+=hide-text
+  overflow: hidden
+  text-indent: 100%
+  white-space: nowrap
+
+// FONTS
+// --------------------------------------------------
+
+=font-family-serif
+  font-family: Georgia, "Times New Roman", Times, serif
+=font-family-sans-serif
+  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif
+=font-family-monospace
+  font-family: Menlo, Monaco, "Courier New", monospace
+  
+=font-shorthand($size: $baseFontSize, $weight: normal, $lineHeight: $baseLineHeight)
+  font-size: $size
+  font-weight: $weight
+  line-height: $lineHeight
+  
+=font-serif($size: $baseFontSize, $weight: normal, $lineHeight: $baseLineHeight)
+  +font-family-serif
+  +font-shorthand($size, $weight, $lineHeight)
+=font-sans-serif($size: $baseFontSize, $weight: normal, $lineHeight: $baseLineHeight)
+  +font-family-sans-serif
+  +font-shorthand($size, $weight, $lineHeight)
+=font-monospace($size: $baseFontSize, $weight: normal, $lineHeight: $baseLineHeight)
+  +font-family-monospace
+  +font-shorthand($size, $weight, $lineHeight)
+
+
+
+  
+
+// FORMS
+// --------------------------------------------------
+
+// Block level inputs
+=input-block-level
+  display: block
+  width: 100%
+  min-height: 28px  // Make inputs at least the height of their button counterpart
+  // Makes inputs behave like true block-level elements
+  +box-sizing(border-box)
+
+// Mixin for form field states
+=form-field-state($textColor: #555, $borderColor: #ccc, $backgroundColor: #f5f5f5)
+  // Set the text color
+  > label,
+  .help-block,
+  .help-inline
+    color: $textColor
+  // Style inputs accordingly
+  input,
+  select,
+  textarea
+    color: $textColor
+    border-color: $borderColor
+    &:focus
+      border-color: darken($borderColor, 10%)
+      +box-shadow(0 0 6px lighten($borderColor, 20%))
+  // Give a small background color for input-prepend/-append
+  .input-prepend .add-on,
+  .input-append .add-on
+    color: $textColor
+    background-color: $backgroundColor
+    border-color: $textColor
+    
+
+
+// CSS3 PROPERTIES
+// --------------------------------------------------
+
+// Border Radius
+=border-radius($radius: 5px)
+  -webkit-border-radius: $radius
+  -moz-border-radius: $radius
+  border-radius: $radius
+
+// Drop shadows
+=box-shadow($shadow: 0 1px 3px rgba(0,0,0,.25))
+  -webkit-box-shadow: $shadow
+  -moz-box-shadow: $shadow
+  box-shadow: $shadow
+
+// Transitions
+=transition($transition)
+  -webkit-transition: $transition
+  -moz-transition: $transition
+  -ms-transition: $transition
+  -o-transition: $transition
+  transition: $transition
+
+// Transformations
+=rotate($degrees)
+  -webkit-transform: rotate($degrees)
+  -moz-transform: rotate($degrees)
+  -ms-transform: rotate($degrees)
+  -o-transform: rotate($degrees)
+  transform: rotate($degrees)
+  
+=scale($ratio)
+  -webkit-transform: scale($ratio)
+  -moz-transform: scale($ratio)
+  -ms-transform: scale($ratio)
+  -o-transform: scale($ratio)
+  transform: scale($ratio)
+          
+=translate($x: 0, $y: 0)
+  -webkit-transform: translate($x, $y)
+  -moz-transform: translate($x, $y)
+  -ms-transform: translate($x, $y)
+  -o-transform: translate($x, $y)
+  transform: translate($x, $y)
+  
+=skew($x: 0, $y: 0)
+  -webkit-transform: skew($x, $y)
+  -moz-transform: skew($x, $y)
+  -ms-transform: skew($x, $y)
+  -o-transform: skew($x, $y)
+  transform: skew($x, $y)
+  
+=translate3d($x: 0, $y: 0, $z: 0)
+  -webkit-transform: translate($x, $y, $z)
+  -moz-transform: translate($x, $y, $z)
+  -ms-transform: translate($x, $y, $z)
+  -o-transform: translate($x, $y, $z)
+  transform: translate($x, $y, $z)
+
+
+
+// Background clipping
+// Heads up: FF 3.6 and under need "padding" instead of "padding-box"
+=background-clip($clip)
+  -webkit-background-clip: $clip
+  -moz-background-clip: $clip
+  background-clip: $clip
+
+// Background sizing
+=background-size($size)
+  -webkit-background-size: $size
+  -moz-background-size: $size
+  -o-background-size: $size
+  background-size: $size
+
+
+// Box sizing
+=box-sizing($boxmodel)
+  -webkit-box-sizing: $boxmodel
+  -moz-box-sizing: $boxmodel
+  -ms-box-sizing: $boxmodel
+  box-sizing: $boxmodel
+
+// User select
+// For selecting text on the page
+=user-select($select)
+  -webkit-user-select: $select
+  -moz-user-select: $select
+  -o-user-select: $select
+  user-select: $select
+
+// Resize anything
+=resizable($direction: both)
+  resize: $direction  // Options: horizontal, vertical, both
+  overflow: auto  // Safari fix
+
+// CSS3 Content Columns
+=content-columns($columnCount, $columnGap: $gridColumnGutter)
+  -webkit-column-count: $columnCount
+  -moz-column-count: $columnCount
+  column-count: $columnCount
+  -webkit-column-gap: $columnGap
+  -moz-column-gap: $columnGap
+  column-gap: $columnGap
+
+// Opacity
+=opacity($opacity: 100)
+  opacity: $opacity / 100
+  filter: alpha(opacity=#{$opacity})
+
+
+
+// BACKGROUNDS
+// --------------------------------------------------
+
+// Add an alphatransparency value to any background or border color (via Elyse Holladay)
+=translucent-background($color: $white, $alpha: 1)
+  background-color: hsla(hue($color), saturation($color), lightness($color), $alpha)
+=translucent-border($color: $white, $alpha: 1)
+  +border-color(hsla(hue($color), saturation($color), lightness($color), $alpha))
+  +background-clip(padding-box)
+  
+// Gradient Bar Colors for buttons and alerts
+=gradient-bar($primaryColor, $secondaryColor)
+  +gradient-vertical($primaryColor, $secondaryColor)
+  border-color: $secondaryColor $secondaryColor darken($secondaryColor, 15%)
+  border-color: rgba(0, 0, 0, .1) rgba(0, 0, 0, .1) fadein(rgba(0, 0, 0, .1), 15%)
+
+// Gradients
+=gradient-horizontal($startColor: #555, $endColor: #333)
+  background-color: $endColor
+  background-image: -moz-linear-gradient(left, $startColor, $endColor)  // FF 3.6+
+  background-image: -ms-linear-gradient(left, $startColor, $endColor)  // IE10
+  background-image: -webkit-gradient(linear, 0 0, 100% 0, from($startColor), to($endColor))  // Safari 4+, Chrome 2+
+  background-image: -webkit-linear-gradient(left, $startColor, $endColor)  // Safari 5.1+, Chrome 10+
+  background-image: -o-linear-gradient(left, $startColor, $endColor)  // Opera 11.10
+  background-image: linear-gradient(left, $startColor, $endColor)  // Le standard
+  background-repeat: repeat-x
+  $ieStartColor: rgb(red($startColor), green($startColor), blue($startColor))
+  $ieEndColor: rgb(red($endColor), green($endColor), blue($endColor))
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{$ieStartColor}', endColorstr='#{$ieEndColor}', GradientType=1)  // IE9 and down
+=gradient-vertical($startColor: #555, $endColor: #333)
+  background-color: mix($startColor, $endColor, 60%)
+  background-image: -moz-linear-gradient(top, $startColor, $endColor)  // FF 3.6+
+  background-image: -ms-linear-gradient(top, $startColor, $endColor)  // IE10
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from($startColor), to($endColor))  // Safari 4+, Chrome 2+
+  background-image: -webkit-linear-gradient(top, $startColor, $endColor)  // Safari 5.1+, Chrome 10+
+  background-image: -o-linear-gradient(top, $startColor, $endColor)  // Opera 11.10
+  background-image: linear-gradient(top, $startColor, $endColor)  // The standard
+  background-repeat: repeat-x
+  $ieStartColor: rgb(red($startColor), green($startColor), blue($startColor))
+  $ieEndColor: rgb(red($endColor), green($endColor), blue($endColor))
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{$ieStartColor}', endColorstr='#{$ieEndColor}', GradientType=0)  // IE9 and down
+=gradient-directional($startColor: #555, $endColor: #333, $deg: 45deg)
+  background-color: $endColor
+  background-repeat: repeat-x
+  background-image: -moz-linear-gradient($deg, $startColor, $endColor)  // FF 3.6+
+  background-image: -ms-linear-gradient($deg, $startColor, $endColor)  // IE10
+  background-image: -webkit-linear-gradient($deg, $startColor, $endColor)  // Safari 5.1+, Chrome 10+
+  background-image: -o-linear-gradient($deg, $startColor, $endColor)  // Opera 11.10
+  background-image: linear-gradient($deg, $startColor, $endColor)  // The standard
+=gradient-vertical-three-colors($startColor: #00b3ee, $midColor: #7a43b6, $colorStop: 50%, $endColor: #c3325f)
+  background-color: mix($midColor, $endColor, 80%)
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from($startColor), color-stop($colorStop, $midColor), to($endColor))
+  background-image: -webkit-linear-gradient($startColor, $midColor $colorStop, $endColor)
+  background-image: -moz-linear-gradient(top, $startColor, $midColor $colorStop, $endColor)
+  background-image: -ms-linear-gradient($startColor, $midColor $colorStop, $endColor)
+  background-image: -o-linear-gradient($startColor, $midColor $colorStop, $endColor)
+  background-image: linear-gradient($startColor, $midColor $colorStop, $endColor)
+  background-repeat: no-repeat
+  $ieStartColor: rgb(red($startColor), green($startColor), blue($startColor))
+  $ieEndColor: rgb(red($endColor), green($endColor), blue($endColor))
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{$ieStartColor}', endColorstr='#{$ieEndColor}', GradientType=0)  // IE9 and down
+=gradient-radial($innerColor: #555, $outerColor: #333)
+  background-color: $outerColor
+  background-image: -webkit-gradient(radial, center center, 0, center center, 460, from($innerColor), to($outerColor))
+  background-image: -webkit-radial-gradient(circle, $innerColor, $outerColor)
+  background-image: -moz-radial-gradient(circle, $innerColor, $outerColor)
+  background-image: -ms-radial-gradient(circle, $innerColor, $outerColor)
+  background-image: -o-radial-gradient(circle, $innerColor, $outerColor)
+  background-repeat: no-repeat
+=gradient-striped($color, $angle: -45deg)
+  background-color: $color
+  background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(.25, rgba(255,255,255,.15)), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, rgba(255,255,255,.15)), color-stop(.75, rgba(255,255,255,.15)), color-stop(.75, transparent), to(transparent))
+  background-image: -webkit-linear-gradient($angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent)
+  background-image: -moz-linear-gradient($angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent)
+  background-image: -ms-linear-gradient($angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent)
+  background-image: -o-linear-gradient($angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent)
+  background-image: \linear-gradient($angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent)
+
+// Reset filters for IE
+=reset-filter
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false)
+
+
+// COMPONENT MIXINS
+// --------------------------------------------------
+
+// Horizontal dividers
+// -------------------------
+// Dividers (basically an hr) within dropdowns and nav lists
+=nav-divider
+  height: 1px
+  margin: 5px 1px
+  overflow: hidden
+  background-color: #e5e5e5
+  border-bottom: 1px solid $white
+  
+  // IE7 needs a set width since we gave a height. Restricting just
+  // to IE7 to keep the 1px left/right space in other browsers.
+  // It is unclear where IE is getting the extra space that we need
+  // to negative-margin away, but so it goes.
+  *width: 100%
+  *margin: -5px 0 5px
+
+// Button backgrounds
+// ---------------------------------------
+=button-background($startColor, $endColor)
+  // gradient-bar will set the background to a pleasing blend of these, to support IE<=9
+  +gradient-bar($startColor, $endColor)
+  +reset-filter
+
+  // In these cases the gradient won't cover the background, so we override
+  &:hover, &:active, &.active, &.disabled, &[disabled]
+    background-color: $endColor
+
+  // IE 7 + 8 can't handle box-shadow to show active, so we darken a bit ourselves
+  &:active,
+  &.active
+    background-color: darken($endColor, 10%) #{"\9"}
+    
+// Navbar vertical align
+// -------------------------
+// Vertically center elements in the navbar.
+// Example: an element has a height of 30px, so write out `.navbarVerticalAlign(30px);` to calculate the appropriate top margin.
+=navbar-vertical-align($elementHeight)
+  margin-top: ($navbarHeight - $elementHeight) / 2
+    
+// Popover arrows
+// -------------------------
+// For tipsies and popovers
+=popover-arrow-top($arrowWidth: 5px, $color: $black)
+  bottom: 0
+  left: 50%
+  margin-left: -$arrowWidth
+  border-left: $arrowWidth solid transparent
+  border-right: $arrowWidth solid transparent
+  border-top: $arrowWidth solid $color
+=popover-arrow-left($arrowWidth: 5px, $color: $black)
+  top: 50%
+  right: 0
+  margin-top: -$arrowWidth
+  border-top: $arrowWidth solid transparent
+  border-bottom: $arrowWidth solid transparent
+  border-left: $arrowWidth solid $color
+=popover-arrow-bottom($arrowWidth: 5px, $color: $black)
+  top: 0
+  left: 50%
+  margin-left: -$arrowWidth
+  border-left: $arrowWidth solid transparent
+  border-right: $arrowWidth solid transparent
+  border-bottom: $arrowWidth solid $color
+=popover-arrow-right($arrowWidth: 5px, $color: $black)
+  top: 50%
+  left: 0
+  margin-top: -$arrowWidth
+  border-top: $arrowWidth solid transparent
+  border-bottom: $arrowWidth solid transparent
+  border-right: $arrowWidth solid $color
+  
+
+// Grid System
+// -----------
+
+// Centered container element
+=container-fixed
+  margin-left: auto
+  margin-right: auto
+  +clearfix
+  
+      
+// Table columns
+=table-columns($columnSpan: 1)
+  float: none  // undo default grid column styles
+  width: (($gridColumnWidth) * $columnSpan) + ($gridGutterWidth * ($columnSpan - 1)) - 16  // 16 is total padding on left and right of table cells
+  margin-left: 0  // undo default grid column styles
+  
+
+// Make a Grid
+// Use +make-row and +make-column to assign semantic layouts grid system behavior
+=make-row
+  margin-left: $gridGutterWidth * -1
+  +clearfix
+  
+=make-column($columns: 1)
+  float: left
+  margin-left: $gridGutterWidth
+  width: ($gridColumnWidth * $columns) + ($gridGutterWidth * ($columns - 1))
+  
+
+// The Grid
+=core-grid-span($columns, $gridColumnWidth, $gridGutterWidth)
+  width: $gridColumnWidth * $columns + $gridGutterWidth * ($columns - 1)
+  
+=core-grid-offset($columns, $gridColumnWidth, $gridGutterWidth)
+  margin-left: $gridColumnWidth * $columns + $gridGutterWidth * ($columns - 1) + $gridGutterWidth * 2
+  
+=core-grid-generate($gridColumnWidth, $gridGutterWidth)
+  .row
+    margin-left: $gridGutterWidth * -1
+    +clearfix
+    
+  [class*="span"]
+    float: left
+    margin-left: $gridGutterWidth
+    
+  // Set the container width, and override it for fixed navbars in media queries
+  .container,
+  .navbar-fixed-top .container,
+  .navbar-fixed-bottom .container
+    +core-grid-span($gridColumns, $gridColumnWidth, $gridGutterWidth)
+    
+  @for $i from 1 through $gridColumns
+    .span#{$i}
+      +core-grid-span($i, $gridColumnWidth, $gridGutterWidth)
+  
+  @for $i from 1 to $gridColumns
+    .offset#{$i}
+      +core-grid-offset($i, $gridColumnWidth, $gridGutterWidth)
+  
+  
+=fluid-grid-span($columns, $fluidGridColumnWidth, $fluidGridGutterWidth)
+  width: $fluidGridColumnWidth * $columns + $fluidGridGutterWidth * ($columns - 1)
+  
+=fluid-grid-generate($fluidGridColumnWidth, $fluidGridGutterWidth)
+  .row-fluid
+    width: 100%
+    +clearfix
+    
+    > [class*="span"]
+      float: left
+      margin-left: $fluidGridGutterWidth
+      
+    > [class*="span"]:first-child
+      margin-left: 0
+      
+    @for $i from 1 through $gridColumns
+      > .span#{$i}
+        +fluid-grid-span($i, $fluidGridColumnWidth, $fluidGridGutterWidth)
+
+  
+=input-grid-span($columns, $gridColumnWidth, $gridGutterWidth)
+  width: $gridColumnWidth * $columns + $gridGutterWidth * ($columns - 1) - 10
+  
+=input-grid-generate($gridColumnWidth, $gridGutterWidth)
+  input,
+  textarea,
+  .uneditable-input
+    margin-left: 0  // override margin-left from core grid system
+    @for $i from 1 through $gridColumns
+      &.span#{$i}
+        +input-grid-span($i, $gridColumnWidth, $gridGutterWidth)
+      
+  

data/vendor/assets/stylesheets/twitter/bootstrap/_modals.sass

@@ -0,0 +1,87 @@
+// MODALS
+// ------
+
+// Recalculate z-index where appropriate
+.modal-open
+  .dropdown-menu
+    z-index: $zindexDropdown + $zindexModal
+  .dropdown.open
+    *z-index: $zindexDropdown + $zindexModal
+  .popover
+    z-index: $zindexPopover + $zindexModal
+  .tooltip
+    z-index: $zindexTooltip + $zindexModal
+
+// Background
+.modal-backdrop
+  position: fixed
+  top: 0
+  right: 0
+  bottom: 0
+  left: 0
+  z-index: $zindexModalBackdrop
+  background-color: $black
+  // Fade for backdrop
+  &.fade
+    +opacity(0)
+
+.modal-backdrop,
+.modal-backdrop.fade.in
+  +opacity(80)
+
+// Base modal
+.modal
+  position: fixed
+  top: 50%
+  left: 50%
+  z-index: $zindexModal
+  overflow: auto
+  width: 560px
+  margin: -250px 0 0 -280px
+  background-color: $white
+  border: 1px solid #999
+  border: 1px solid rgba(0,0,0,.3)
+  *border: 1px solid #999  /* IE6-7 */
+  +border-radius(6px)
+  +box-shadow(0 3px 7px rgba(0,0,0,0.3))
+  +background-clip(padding-box)
+  &.fade
+    +transition(#{'opacity .3s linear, top .3s ease-out'})
+    top: -25%
+    &.in
+      top: 50%
+      
+.modal-header
+  padding: 9px 15px
+  border-bottom: 1px solid #eee
+  // Close icon
+  .close
+    margin-top: 2px
+
+// Body (where all modal content resides)
+.modal-body
+  overflow-y: auto
+  max-height: 400px
+  padding: 15px
+  
+// Remove bottom margin if need be
+.modal-form
+  margin-bottom: 0
+
+// Footer (for actions)
+.modal-footer
+  padding: 14px 15px 15px
+  margin-bottom: 0
+  text-align: right  // right align buttons
+  background-color: #f5f5f5
+  border-top: 1px solid #ddd
+  +border-radius(0 0 6px 6px)
+  +box-shadow(inset 0 1px 0 $white)
+  +clearfix  // clear it in case folks use .pull-* classes on buttons
+  // Properly space out buttons
+  .btn + .btn
+    margin-left: 5px
+    margin-bottom: 0  // account for input[type="submit"] which gets the bottom margin like all other inputs
+  // but override that for button groups
+  .btn-group .btn + .btn
+    margin-left: -1px