compass_twitter_bootstrap 0.1.8 → 2.0.0

data/stylesheets_sass/compass_twitter_bootstrap/_modals.sass

@@ -0,0 +1,75 @@
+// MODALS
+// ------
+
+.modal-open
+  .dropdown-menu
+    z-index: $zindexDropdown + $zindexModal
+  .dropdown.open
+    *z-index: $zindexDropdown + $zindexModal
+  .popover
+    z-index: $zindexPopover + $zindexModal
+  .tooltip
+    z-index: $zindexTooltip + $zindexModal
+
+.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(0.8)
+
+.modal
+  position: fixed
+  top: 50%
+  left: 50%
+  z-index: $zindexModal
+  max-height: 500px
+  overflow: auto
+  width: 560px
+  margin: -250px 0 0 -280px
+  background-color: $white
+  border: 1px solid #999
+  border: 1px solid rgba(0, 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(e("opacity .3s linear, top .3s ease-out"))
+    top: -25%
+  &.fade.in
+    top: 50%
+
+.modal-header
+  padding: 9px 15px
+  border-bottom: 1px solid #eee
+  // Close icon
+  .close
+    margin-top: 2px
+
+.modal-body
+  padding: 15px
+
+.modal-footer
+  padding: 14px 15px 15px
+  margin-bottom: 0
+  background-color: #f5f5f5
+  border-top: 1px solid #ddd
+  +border-radius(0 0 6px 6px)
+  +box-shadow(inset 0 1px 0 $white)
+  +clearfix
+  .btn
+    float: right
+    margin-left: 5px
+    margin-bottom: 0
+    // account for input[type="submit"] which gets the bottom margin like all other inputs

data/stylesheets_sass/compass_twitter_bootstrap/_navbar.sass

@@ -0,0 +1,258 @@
+// NAVBAR (FIXED AND STATIC)
+// -------------------------
+
+// COMMON STYLES
+// -------------
+
+.navbar
+  overflow: visible
+  margin-bottom: $baseLineHeight
+
+// Gradient is applied to it's own element because overflow visible is not honored by IE when filter is present
+.navbar-inner
+  padding-left: 20px
+  padding-right: 20px
+  +gradient-vertical($navbarBackgroundHighlight, $navbarBackground)
+  +border-radius(4px)
+  $shadow: 0 1px 3px rgba(0, 0, 0, 0.25), inset 0 -1px 0 rgba(0, 0, 0, 0.1)
+  +box-shadow($shadow)
+
+// Navbar button for toggling navbar items in responsive layouts
+.btn-navbar
+  display: none
+  float: right
+  padding: 7px 10px
+  margin-left: 5px
+  margin-right: 5px
+  +buttonBackground($navbarBackgroundHighlight, $navbarBackground)
+  $shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.075)
+  +box-shadow($shadow)
+
+.btn-navbar .icon-bar
+  display: block
+  width: 18px
+  height: 2px
+  background-color: #f5f5f5
+  +border-radius(1px)
+  +box-shadow(0 1px 0 rgba(0, 0, 0, 0.25))
+
+.btn-navbar .icon-bar + .icon-bar
+  margin-top: 3px
+
+// Override the default collapsed state
+.nav-collapse.collapse
+  height: auto
+
+// Brand, links, text, and buttons
+.navbar
+  // Hover and active states
+  .brand:hover
+    text-decoration: none
+  // Website or project name
+  .brand
+    float: left
+    display: block
+    padding: 8px 20px 12px
+    margin-left: -20px
+    // negative indent to left-align the text down the page
+    font-size: 20px
+    font-weight: 200
+    line-height: 1
+    color: $white
+  // Plain text in topbar
+  .navbar-text
+    margin-bottom: 0
+    line-height: 40px
+    color: $navbarText
+    a:hover
+      color: $white
+      background-color: transparent
+  // Buttons in navbar
+  .btn,
+  .btn-group
+    margin-top: 5px
+    // make buttons vertically centered in navbar
+  .btn-group .btn
+    margin-top: 0
+
+// Navbar forms
+.navbar-form
+  margin-bottom: 0
+  // remove default bottom margin
+  +clearfix
+  input,
+  select
+    display: inline-block
+    margin-top: 5px
+    margin-bottom: 0
+  .radio,
+  .checkbox
+    margin-top: 5px
+  input[type="image"],
+  input[type="checkbox"],
+  input[type="radio"]
+    margin-top: 3px
+
+// Navbar search
+.navbar-search
+  position: relative
+  float: left
+  margin-top: 6px
+  margin-bottom: 0
+  .search-query
+    padding: 4px 9px
+    +font-sans-serif(13px, normal, 1)
+    color: $white
+    color: rgba(255, 255, 255, 0.75)
+    background: #666
+    background: rgba(255, 255, 255, 0.3)
+    border: 1px solid #111
+    $shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 0px rgba(255, 255, 255, 0.15)
+    +box-shadow($shadow)
+    +transition(none)
+    // Placeholder text gets special styles; can't be bundled together though for some reason
+    +placeholder($grayLighter)
+    // Hover states
+    &:hover
+      color: $white
+      background-color: $grayLight
+      background-color: rgba(255, 255, 255, 0.5)
+    // Focus states (we use .focused since IE8 and down doesn't support :focus)
+    &:focus,
+    &.focused
+      padding: 5px 10px
+      color: $grayDark
+      text-shadow: 0 1px 0 $white
+      background-color: $white
+      border: 0
+      +box-shadow(0 0 3px rgba(0, 0, 0, 0.15))
+      outline: 0
+
+// FIXED NAVBAR
+// ------------
+
+.navbar-fixed-top
+  position: fixed
+  top: 0
+  right: 0
+  left: 0
+  z-index: $zindexFixedNavbar
+
+.navbar-fixed-top .navbar-inner
+  padding-left: 0
+  padding-right: 0
+  +border-radius(0)
+
+// NAVIGATION
+// ----------
+
+.navbar .nav
+  position: relative
+  left: 0
+  display: block
+  float: left
+  margin: 0 10px 0 0
+
+.navbar .nav.pull-right
+  float: right
+  // redeclare due to specificity
+
+.navbar .nav > li
+  display: block
+  float: left
+
+// Links
+.navbar .nav > li > a
+  float: none
+  padding: 10px 10px 11px
+  line-height: 19px
+  color: $navbarLinkColor
+  text-decoration: none
+  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25)
+
+// Hover
+.navbar .nav > li > a:hover
+  background-color: transparent
+  color: $navbarLinkColorHover
+  text-decoration: none
+
+// Active nav items
+
+.navbar .nav .active > a,
+.navbar .nav .active > a:hover
+  color: $navbarLinkColorHover
+  text-decoration: none
+  background-color: $navbarBackground
+  background-color: rgba(0, 0, 0, 0.5)
+
+// Dividers (basically a vertical hr)
+.navbar .divider-vertical
+  height: $navbarHeight
+  width: 1px
+  margin: 0 9px
+  overflow: hidden
+  background-color: $navbarBackground
+  border-right: 1px solid $navbarBackgroundHighlight
+
+// Secondary (floated right) nav in topbar
+.navbar .nav.pull-right
+  margin-left: 10px
+  margin-right: 0
+
+// Dropdown menus
+// --------------
+
+// Menu position and menu carets
+.navbar .dropdown-menu
+  margin-top: 1px
+  +border-radius(4px)
+  &:before
+    content: ''
+    display: inline-block
+    border-left: 7px solid transparent
+    border-right: 7px solid transparent
+    border-bottom: 7px solid #ccc
+    border-bottom-color: rgba(0, 0, 0, 0.2)
+    position: absolute
+    top: -7px
+    left: 9px
+  &:after
+    content: ''
+    display: inline-block
+    border-left: 6px solid transparent
+    border-right: 6px solid transparent
+    border-bottom: 6px solid $white
+    position: absolute
+    top: -6px
+    left: 10px
+
+// Dropdown toggle caret
+
+.navbar .nav .dropdown-toggle .caret,
+.navbar .nav .open.dropdown .caret
+  border-top-color: $white
+
+.navbar .nav .active .caret
+  +opacity(1)
+
+// Remove background color from open dropdown
+
+.navbar .nav .open > .dropdown-toggle,
+.navbar .nav .active > .dropdown-toggle,
+.navbar .nav .open.active > .dropdown-toggle
+  background-color: transparent
+
+// Dropdown link on hover
+.navbar .nav .active > .dropdown-toggle:hover
+  color: $white
+
+// Right aligned menus need alt position
+.navbar .nav.pull-right .dropdown-menu
+  left: auto
+  right: 0
+  &:before
+    left: auto
+    right: 12px
+  &:after
+    left: auto
+    right: 13px

data/stylesheets_sass/compass_twitter_bootstrap/_navs.sass

@@ -0,0 +1,316 @@
+// NAVIGATIONS
+// -----------
+
+// BASE CLASS
+// ----------
+
+.nav
+  margin-left: 0
+  margin-bottom: $baseLineHeight
+  list-style: none
+
+// Make links block level
+.nav > li > a
+  display: block
+
+.nav > li > a:hover
+  text-decoration: none
+  background-color: $grayLighter
+
+// NAV LIST
+// --------
+
+.nav-list
+  padding-left: 14px
+  padding-right: 14px
+  margin-bottom: 0
+
+.nav-list > li > a,
+.nav-list .nav-header
+  display: block
+  padding: 3px 15px
+  margin-left: -15px
+  margin-right: -15px
+  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5)
+
+.nav-list .nav-header
+  font-size: 11px
+  font-weight: bold
+  line-height: $baseLineHeight
+  color: $grayLight
+  text-transform: uppercase
+
+.nav-list > li + .nav-header
+  margin-top: 9px
+
+.nav-list .active > a,
+.nav-list .active > a:hover
+  color: $white
+  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2)
+  background-color: $linkColor
+
+.nav-list [class^="icon-"]
+  margin-right: 2px
+
+// TABS AND PILLS
+// -------------
+
+// Common styles
+
+.nav-tabs,
+.nav-pills
+  +clearfix
+
+.nav-tabs > li,
+.nav-pills > li
+  float: left
+
+.nav-tabs > li > a,
+.nav-pills > li > a
+  padding-right: 12px
+  padding-left: 12px
+  margin-right: 2px
+  line-height: 14px
+  // keeps the overall height an even number
+
+// TABS
+// ----
+
+// Give the tabs something to sit on
+.nav-tabs
+  border-bottom: 1px solid #ddd
+
+// Make the list-items overlay the bottom border
+.nav-tabs > li
+  margin-bottom: -1px
+
+// Actual tabs (as links)
+.nav-tabs > li > a
+  padding-top: 9px
+  padding-bottom: 9px
+  border: 1px solid transparent
+  +border-radius(4px 4px 0 0)
+  &:hover
+    border-color: $grayLighter $grayLighter #dddddd
+
+// Active state, and it's :hover to override normal :hover
+
+.nav-tabs > .active > a,
+.nav-tabs > .active > a:hover
+  color: $gray
+  background-color: $white
+  border: 1px solid #ddd
+  border-bottom-color: transparent
+  cursor: default
+
+// PILLS
+// -----
+
+// Links rendered as pills
+.nav-pills > li > a
+  padding-top: 8px
+  padding-bottom: 8px
+  margin-top: 2px
+  margin-bottom: 2px
+  +border-radius(5px)
+
+// Active state
+
+.nav-pills .active > a,
+.nav-pills .active > a:hover
+  color: $white
+  background-color: $linkColor
+
+// STACKED NAV
+// -----------
+
+// Stacked tabs and pills
+.nav-stacked > li
+  float: none
+
+.nav-stacked > li > a
+  margin-right: 0
+  // no need for the gap between nav items
+
+// Tabs
+.nav-tabs.nav-stacked
+  border-bottom: 0
+
+.nav-tabs.nav-stacked > li > a
+  border: 1px solid #ddd
+  +border-radius(0)
+
+.nav-tabs.nav-stacked > li:first-child > a
+  +border-radius(4px 4px 0 0)
+
+.nav-tabs.nav-stacked > li:last-child > a
+  +border-radius(0 0 4px 4px)
+
+.nav-tabs.nav-stacked > li > a:hover
+  border-color: #ddd
+  z-index: 2
+
+// Pills
+.nav-pills.nav-stacked > li > a
+  margin-bottom: 3px
+
+.nav-pills.nav-stacked > li:last-child > a
+  margin-bottom: 1px
+  // decrease margin to match sizing of stacked tabs
+
+// DROPDOWNS
+// ---------
+
+// Position the menu
+
+.nav-tabs .dropdown-menu,
+.nav-pills .dropdown-menu
+  margin-top: 1px
+  border-width: 1px
+
+.nav-pills .dropdown-menu
+  +border-radius(4px)
+
+// Default dropdown links
+// -------------------------
+// Make carets use linkColor to start
+
+.nav-tabs .dropdown-toggle .caret,
+.nav-pills .dropdown-toggle .caret
+  border-top-color: $linkColor
+  margin-top: 6px
+
+.nav-tabs .dropdown-toggle:hover .caret,
+.nav-pills .dropdown-toggle:hover .caret
+  border-top-color: $linkColorHover
+
+// Active dropdown links
+// -------------------------
+
+.nav-tabs .active .dropdown-toggle .caret,
+.nav-pills .active .dropdown-toggle .caret
+  border-top-color: $grayDark
+
+// Active:hover dropdown links
+// -------------------------
+.nav > .dropdown.active > a:hover
+  color: $black
+  cursor: pointer
+
+// Open dropdowns
+// -------------------------
+
+.nav-tabs .open .dropdown-toggle,
+.nav-pills .open .dropdown-toggle,
+.nav > .open.active > a:hover
+  color: $white
+  background-color: $grayLight
+  border-color: $grayLight
+
+.nav .open .caret,
+.nav .open.active .caret,
+.nav .open a:hover .caret
+  border-top-color: $white
+  +opacity(1)
+
+// Dropdowns in stacked tabs
+.tabs-stacked .open > a:hover
+  border-color: $grayLight
+
+// TABBABLE
+// --------
+
+// COMMON STYLES
+// -------------
+
+// Clear any floats
+.tabbable
+  +clearfix
+
+// Remove border on bottom, left, right
+
+.tabs-below .nav-tabs,
+.tabs-right .nav-tabs,
+.tabs-left .nav-tabs
+  border-bottom: 0
+
+// Show/hide tabbable areas
+
+.tab-content > .tab-pane,
+.pill-content > .pill-pane
+  display: none
+
+.tab-content > .active,
+.pill-content > .active
+  display: block
+
+// BOTTOM
+// ------
+
+.tabs-below .nav-tabs
+  border-top: 1px solid #ddd
+
+.tabs-below .nav-tabs > li
+  margin-top: -1px
+  margin-bottom: 0
+
+.tabs-below .nav-tabs > li > a
+  +border-radius(0 0 4px 4px)
+  &:hover
+    border-bottom-color: transparent
+    border-top-color: #ddd
+
+.tabs-below .nav-tabs .active > a,
+.tabs-below .nav-tabs .active > a:hover
+  border-color: transparent #ddd #ddd #ddd
+
+// LEFT & RIGHT
+// ------------
+
+// Common styles
+
+.tabs-left .nav-tabs > li,
+.tabs-right .nav-tabs > li
+  float: none
+
+.tabs-left .nav-tabs > li > a,
+.tabs-right .nav-tabs > li > a
+  min-width: 74px
+  margin-right: 0
+  margin-bottom: 3px
+
+// Tabs on the left
+.tabs-left .nav-tabs
+  float: left
+  margin-right: 19px
+  border-right: 1px solid #ddd
+
+.tabs-left .nav-tabs > li > a
+  margin-right: -1px
+  +border-radius(4px 0 0 4px)
+
+.tabs-left .nav-tabs > li > a:hover
+  border-color: $grayLighter #dddddd $grayLighter $grayLighter
+
+.tabs-left .nav-tabs .active > a,
+.tabs-left .nav-tabs .active > a:hover
+  border-color: #ddd transparent #ddd #ddd
+  *border-right-color: $white
+
+// Tabs on the right
+.tabs-right .nav-tabs
+  float: right
+  margin-left: 19px
+  border-left: 1px solid #ddd
+
+.tabs-right .nav-tabs > li > a
+  margin-left: -1px
+  +border-radius(0 4px 4px 0)
+
+.tabs-right .nav-tabs > li > a:hover
+  border-color: $grayLighter $grayLighter $grayLighter #dddddd
+
+.tabs-right .nav-tabs .active > a,
+.tabs-right .nav-tabs .active > a:hover
+  border-color: #ddd #ddd #ddd transparent
+  *border-left-color: $white