fustrate-rails 0.3.3

data/vendor/assets/stylesheets/fustrate/components/grid.sass

@@ -0,0 +1,204 @@
+$row-width: rem-calc(1000)
+$total-columns: 12
+$column-gutter: rem-calc(30)
+
+@function grid-calc($colNumber, $totalColumns)
+  @return percentage($colNumber / $totalColumns)
+
+// Use +grid-row(nest) to include a nested row
+// Use +grid-row(collapse) to collapsed a container row margins
+// Use +grid-row(nest-collapse) to collapse outer margins on a nested row
+// Use +grid-row to use a container row
+=grid-row($behavior: false)
+  @if $behavior == nest
+    width: auto
+    margin-left: -($column-gutter / 2)
+    margin-right: -($column-gutter / 2)
+    margin-top: 0
+    margin-bottom: 0
+    max-width: none
+
+  @else if $behavior == collapse
+    width: 100%
+    margin: 0
+    max-width: $row-width
+
+  @else if $behavior == nest-collapse
+    width: auto
+    margin: 0
+    max-width: none
+
+  @else
+    width: 100%
+    margin-left: auto
+    margin-right: auto
+    margin-top: 0
+    margin-bottom: 0
+    max-width: $row-width
+
+  // Clearfix for all rows
+  +clearfix
+
+// Creates a column, should be used inside of a media query to control layouts
+//
+// $columns - The number of columns this should be
+// $last-column - Is this the last column? Default: false.
+// $center - Center these columns? Default: false.
+// $offset - # of columns to offset. Default: false.
+// $push - # of columns to push. Default: false.
+// $pull - # of columns to pull. Default: false.
+// $collapse - Get rid of gutter padding on column? Default: false.
+// $float - Should this float? Default: true. Options: true, false, left, right.
+=grid-column($columns: false, $last-column: false, $center: false, $offset: false, $push: false, $pull: false, $collapse: false, $float: true, $position: false)
+
+  // If positioned for default .column, include relative position
+  // push and pull require position set
+  @if $position or $push or $pull
+    position: relative
+
+  // If collapsed, get rid of gutter padding
+  @if $collapse
+    padding-left: 0
+    padding-right: 0
+
+  @else if $collapse == false
+    // Gutter padding whenever a column isn't set to collapse
+    // (use $collapse: null to do nothing)
+    padding-left: $column-gutter / 2
+    padding-right: $column-gutter / 2
+
+  // If a column number is given, calculate width
+  @if $columns
+    width: grid-calc($columns, $total-columns)
+
+    // If last column, float naturally instead of to the right
+    @if $last-column
+      float: right
+
+  // Source Ordering, adds left/right depending on which you use.
+  @if $push
+    left: grid-calc($push, $total-columns)
+    right: auto
+  @if $pull
+    right: grid-calc($pull, $total-columns)
+    left: auto
+
+  @if $float
+    @if $float == left or $float == true
+      float: left
+    @else if $float == right
+      float: right
+    @else
+      float: none
+
+  // If centered, get rid of float and add appropriate margins
+  @if $center
+    margin-left: auto
+    margin-right: auto
+    float: none
+
+  // If offset, calculate appropriate margins
+  @if $offset
+    margin-left: grid-calc($offset, $total-columns) !important
+
+// Create presentational classes for grid
+//
+// $size - Name of class to use, i.e. "large" will generate .large-1, .large-2, etc.
+=grid-html-classes($size)
+  @for $i from 0 through $total-columns - 1
+    .#{$size}-push-#{$i}
+      +grid-column($push: $i, $collapse: null, $float: false)
+
+    .#{$size}-pull-#{$i}
+      +grid-column($pull: $i, $collapse: null, $float: false)
+
+  .column,
+  .columns
+    +grid-column($columns: false, $position: true)
+
+
+  @for $i from 1 through $total-columns
+    .#{$size}-#{$i}
+      +grid-column($columns: $i, $collapse: null, $float: false)
+
+  @for $i from 0 through $total-columns - 1
+    .#{$size}-offset-#{$i}
+      +grid-column($offset: $i, $collapse: null, $float: false)
+
+  .#{$size}-reset-order
+    margin-left: 0
+    margin-right: 0
+    left: auto
+    right: auto
+    float: left
+
+  .column.#{$size}-centered,
+  .columns.#{$size}-centered
+    +grid-column($center: true, $collapse: null, $float: false)
+
+  .column.#{$size}-uncentered,
+  .columns.#{$size}-uncentered
+    margin-left: 0
+    margin-right: 0
+    float: left
+
+  // Fighting [class*="column"] + [class*="column"]:last-child
+  .column.#{$size}-centered:last-child,
+  .columns.#{$size}-centered:last-child
+    float: none
+
+  // Fighting .column.<previous-size>-centered:last-child
+  .column.#{$size}-uncentered:last-child,
+  .columns.#{$size}-uncentered:last-child
+    float: left
+
+  .column.#{$size}-uncentered.opposite,
+  .columns.#{$size}-uncentered.opposite
+    float: right
+
+=fustrate-grid
+  .row
+    +grid-row
+
+    &.fluid
+      width: 100%
+      max-width: 100%
+
+    &.collapse
+      > .column,
+      > .columns
+        +grid-column($collapse: true, $float: false)
+
+      .row
+        margin-left: 0
+        margin-right: 0
+
+    .row
+      +grid-row(nest)
+
+      &.collapse
+        +grid-row(nest-collapse)
+
+  .column,
+  .columns
+    +grid-column($columns: $total-columns)
+
+    & + &:last-child,
+    & + &.end
+      float: left
+
+  [class*="column"] + [class*="column"]:last-child
+    float: right
+  [class*="column"] + [class*="column"].end
+    float: left
+
+  @media #{$small-up}
+    +grid-html-classes($size: small)
+
+  @media #{$medium-up}
+    +grid-html-classes($size: medium)
+
+  @media #{$large-up}
+    +grid-html-classes($size: large)
+    .large-column-count-2
+      +columns(2)

data/vendor/assets/stylesheets/fustrate/components/labels.sass

@@ -0,0 +1,63 @@
+$label-padding: rem-calc(6 8)
+$label-font-size: rem-calc(12)
+$label-font-color: #333
+$label-font-color-alt: #fff
+
+=label-color($bg: $primary-color)
+  background-color: $bg
+
+  @if lightness($bg) < 70%
+    color: $label-font-color-alt
+    text-shadow: 0 1px 1px scale_color($bg, $lightness: -70%)
+  @else
+    color: $label-font-color
+    text-shadow: 0 1px 1px scale_color($bg, $lightness: 70%)
+
+=fustrate-labels
+  .label
+    text-align: center
+    text-decoration: none
+    line-height: 1
+    white-space: nowrap
+    display: inline-block
+    position: relative
+    margin-bottom: inherit
+    padding: $label-padding
+    font-size: $label-font-size
+    border-radius: 3px
+    +label-color
+
+    td.status:last-child &:only-child,
+    &.fw
+      display: block
+
+    &.round
+      border-radius: 1000px
+    &.sharp
+      border-radius: 0
+
+    &.bad,
+    &.no,
+    &.danger,
+    &.inactive
+      +label-color($red)
+
+    &.good,
+    &.yes,
+    &.success
+      +label-color($green)
+
+    &.warning
+      +label-color($orange)
+
+    &.plain
+      +label-color(#eee)
+      border: #ddd 1px solid
+
+    // Check Mark
+    &.yes::before
+      +font-awesome("\f00c")
+
+    // X
+    &.no::before
+      +font-awesome("\f00d")

data/vendor/assets/stylesheets/fustrate/components/modals.sass

@@ -0,0 +1,119 @@
+=modal-width($width: 80%)
+  margin-left: -($width / 2)
+  width: $width
+
+=fustrate-modals
+  .modal-overlay
+    position: fixed
+    height: 120%
+    width: 100%
+    background: #000
+    background: rgba(#000, .45)
+    z-index: 9500
+    display: none
+    top: 0
+    left: 0
+
+  .modal
+    visibility: hidden
+    display: none
+    position: absolute
+    z-index: 9501
+    width: 100vw
+    top: 0
+    left: 0
+    background-color: #fff
+    padding: rem-calc(12)
+    border: 1px solid #666
+    box-shadow: 0 0 10px rgba(#000, .4)
+    margin-bottom: 1rem
+
+    @media #{$small-only}
+      min-height: 100vh
+
+    @media #{$medium-up}
+      +modal-width
+      top: rem-calc(100)
+      left: 50%
+
+      &.tiny
+        +modal-width(30%)
+      &.small
+        +modal-width(40%)
+      &.medium
+        +modal-width(60%)
+      &.large
+        +modal-width(70%)
+      &.xlarge
+        +modal-width(95%)
+
+    .column,
+    .columns
+      min-width: 0
+
+    & > :first-child
+      margin-top: 0
+    & > :last-child,
+    .modal-content form
+      margin-bottom: 0
+
+    .modal-title
+      padding: 0 rem-calc(4) rem-calc(4)
+      margin: 0 0 rem-calc(8)
+      border-bottom: 1px solid #ddd
+      font-weight: bold
+
+    .modal-close
+      font-size: rem-calc(24)
+      line-height: 1
+      position: absolute
+      top: rem-calc(8)
+      right: rem-calc(16)
+      color: #aaa
+      font-weight: bold
+      cursor: pointer
+
+    .picker
+      height: 300px
+      overflow-y: scroll
+      background: #fafafa
+      position: relative
+
+      .section
+        &:not(:first-child)
+          margin-top: .5rem
+
+      .title
+        background: #e3e3e3
+        padding: 2px rem-calc(8)
+        border: 1px solid #ccc
+        cursor: pointer
+
+        .count
+          float: right
+          font-size: rem-calc(12)
+
+      .option
+        cursor: pointer
+        border: 1px solid #ccc
+        margin-top: -1px
+        padding: .5rem
+
+        &:hover
+          background: $info-color
+          color: scale_color($info-color, $lightness: -65%)
+          border-color: scale_color($info-color, $lightness: -20%)
+          z-index: 9999
+          position: relative
+
+        .description
+          font-size: .8rem
+          color: #555
+          padding-left: .5rem
+
+
+  @media print
+    .modal-overlay
+      display: none !important
+    .modal
+      background: #fff !important

data/vendor/assets/stylesheets/fustrate/components/pagination.sass

@@ -0,0 +1,57 @@
+$pagination-active-color: $primary-color !default
+
+=fustrate-pagination
+  ul.pagination
+    display: block
+    min-height: rem-calc(24)
+    margin-left: rem-calc(-5)
+    text-align: center
+
+    &:empty
+      display: none
+
+    li
+      height: rem-calc(24)
+      color: #222
+      font-size: rem-calc(14)
+      margin-left: rem-calc(1)
+      display: inline-block
+
+      a, span
+        display: block
+        padding: rem-calc(1 10 1)
+        color: #999
+        background: none
+        border-radius: 4px
+        font-weight: normal
+        font-size: 1em
+        line-height: inherit
+        +transition(background-color .3s ease-out)
+
+      &:hover a,
+      a:focus,
+      &:hover span,
+      span:focus
+        background: scale-color(#fff, $lightness: -10%)
+
+      &.unavailable
+        a, span
+          cursor: default
+          color: #999
+
+        &:hover a,
+        & a:focus,
+        &:hover button,
+        & button:focus
+          background: transparent
+
+      &.current
+        a, span
+          background: $pagination-active-color
+          color: #fff
+          font-weight: bold
+          cursor: default
+
+          &:hover,
+          &:focus
+            background: $pagination-active-color

data/vendor/assets/stylesheets/fustrate/components/panels.sass

@@ -0,0 +1,49 @@
+$panel-bg: darken(#fff, 5%)
+
+$panel-margin-bottom: rem-calc(20)
+$panel-padding: rem-calc(16 20)
+
+$panel-font-color: #333
+$panel-font-color-alt: #fff
+
+=panel-color($bg: $panel-bg)
+  border: 1px solid darken($bg, 11%)
+  background: $bg
+
+  // We set the font color based on the darkness of the bg.
+  h1, h2, h3, h4, h5, h6, p, li, dl
+    color: if(lightness($bg) >= 50%, $panel-font-color, $panel-font-color-alt)
+
+=fustrate-panels
+  .panel
+    margin-bottom: $panel-margin-bottom
+    padding: $panel-padding
+    font-size: rem-calc(14)
+    +panel-color
+
+    // reset header line-heights for panels
+    h1, h2, h3, h4, h5, h6
+      line-height: 1
+      margin-bottom: rem-calc(20) / 2
+
+    ul, ol, dl
+      font-size: inherit
+
+    // Respect the padding, fool.
+    & > :first-child
+      margin-top: 0
+    & > :last-child
+      margin-bottom: 0
+
+    &.radius
+      border-radius: 3px
+
+    &.info
+      +panel-color(lighten($info-color, 5%))
+    &.success
+      +panel-color(lighten($success-color, 20%))
+    &.danger
+      +panel-color(scale_color($danger-color, $lightness: 70%, $saturation: -20%))
+
+    &.small
+      padding: $panel-padding / 2