flatui-rails 0.0.1

data/vendor/assets/stylesheets/flat-ui/_spaces.sass

@@ -0,0 +1,129 @@
+// Should be used to modify the default spacing between objects (not between nodes of * the same object)
+// p,m = padding,margin
+// a,t,r,b,l,h,v = all,top,right,bottom,left,horizontal,vertical
+// x,s,m,l,n = extra-small($x),small($s),medium($m),large($l),none(0px)
+$x: 3px
+$s: 5px
+$m: 10px
+$l: 20px
+
+.ptn, .pvn, .pan
+  padding-top: 0
+
+.ptx, .pvx, .pax
+  padding-top: $x
+
+.pts, .pvs, .pas
+  padding-top: $s
+
+.ptm, .pvm, .pam
+  padding-top: $m
+
+.ptl, .pvl, .pal
+  padding-top: $l
+
+.prn, .phn, .pan
+  padding-right: 0
+
+.prx, .phx, .pax
+  padding-right: $x
+
+.prs, .phs, .pas
+  padding-right: $s
+
+.prm, .phm, .pam
+  padding-right: $m
+
+.prl, .phl, .pal
+  padding-right: $l
+
+.pbn, .pvn, .pan
+  padding-bottom: 0
+
+.pbx, .pvx, .pax
+  padding-bottom: $x
+
+.pbs, .pvs, .pas
+  padding-bottom: $s
+
+.pbm, .pvm, .pam
+  padding-bottom: $m
+
+.pbl, .pvl, .pal
+  padding-bottom: $l
+
+.pln, .phn, .pan
+  padding-left: 0
+
+.plx, .phx, .pax
+  padding-left: $x
+
+.pls, .phs, .pas
+  padding-left: $s
+
+.plm, .phm, .pam
+  padding-left: $m
+
+.pll, .phl, .pal
+  padding-left: $l
+
+.mtn, .mvn, .man
+  margin-top: 0px
+
+.mtx, .mvx, .max
+  margin-top: $x
+
+.mts, .mvs, .mas
+  margin-top: $s
+
+.mtm, .mvm, .mam
+  margin-top: $m
+
+.mtl, .mvl, .mal
+  margin-top: $l
+
+.mrn, .mhn, .man
+  margin-right: 0px
+
+.mrx, .mhx, .max
+  margin-right: $x
+
+.mrs, .mhs, .mas
+  margin-right: $s
+
+.mrm, .mhm, .mam
+  margin-right: $m
+
+.mrl, .mhl, .mal
+  margin-right: $l
+
+.mbn, .mvn, .man
+  margin-bottom: 0px
+
+.mbx, .mvx, .max
+  margin-bottom: $x
+
+.mbs, .mvs, .mas
+  margin-bottom: $s
+
+.mbm, .mvm, .mam
+  margin-bottom: $m
+
+.mbl, .mvl, .mal
+  margin-bottom: $l
+
+.mln, .mhn, .man
+  margin-left: 0px
+
+.mlx, .mhx, .max
+  margin-left: $x
+
+.mls, .mhs, .mas
+  margin-left: $s
+
+.mlm, .mhm, .mam
+  margin-left: $m
+
+.mll, .mhl, .mal
+  margin-left: $l
+

data/vendor/assets/stylesheets/flat-ui/flat-ui.sass

@@ -0,0 +1,39 @@
+// Flat UI main stylesheet that aggregates all modules
+
+// Loading custom fonts
+@import url('http://fonts.googleapis.com/css?family=Lato:400,700,900,400italic')
+@import 'icon-font'
+@import 'icon-font-24'
+
+// Loading config with variables (changing them leads to changing a color scheme)
+@import 'config'
+
+// Utility mixins for greater good
+@import 'mixins'
+
+// Modules
+@import 'modules/type'
+@import 'modules/btn'
+@import 'modules/demo'
+@import 'modules/navbar'
+@import 'modules/select'
+@import 'modules/input'
+@import 'modules/checkbox-and-radio'
+@import 'modules/toggle'
+@import 'modules/tagsinput'
+@import 'modules/progress'
+@import 'modules/ui-slider'
+@import 'modules/pager'
+@import 'modules/pagination'
+@import 'modules/share'
+@import 'modules/tooltip'
+@import 'modules/palette'
+@import 'modules/tile'
+@import 'modules/todo'
+@import 'modules/footer'
+@import 'modules/video'
+@import 'modules/login'
+
+// Spaces
+@import 'spaces'
+

data/vendor/assets/stylesheets/flat-ui/modules/_btn.sass

@@ -0,0 +1,73 @@
+=button-states($color)
+  background-color: $color
+  &:hover,
+  &:focus
+    background-color: scale-color($color, $lightness: 20%)
+  &:active,
+  &.active
+    background-color: scale-color($color, $lightness: -15%)
+
+// Buttons -----------------------
+.btn
+  border: none
+  background: $base
+  color: $inverse
+  font-size: 16.5px
+  text-decoration: none
+  text-shadow: none
+  +box-shadow(none)
+  +transition(.25s)
+
+  &:hover,
+  &:focus
+    background-color: scale-color($base, $lightness: 20%)
+    color: $inverse
+    +transition(.25s)
+
+  &:active,
+  &.active
+    background-color: scale-color($base, $lightness: -15%)
+    color: rgba($inverse, .75)
+    +box-shadow(none)
+
+  &.disabled,
+  &[disabled]
+    background-color: $gray
+    color: $inverse
+
+  // Sizes -----------------------
+  &.btn-large
+    padding-bottom: 12px
+    padding-top: 13px
+
+  // Colors -----------------------
+  &.btn-primary
+    +button-states($firm)
+
+  &.btn-info
+    +button-states($info)
+
+  &.btn-danger
+    +button-states($danger)
+
+  &.btn-success
+    +button-states($success)
+
+  &.btn-warning
+    +button-states($warning)
+
+  // Button with icon inside
+  .btn-toolbar &
+    font-size: 18px
+    padding: 10px 14px 9px
+
+    &:first-child
+      +border-radius(6px 0 0 6px)
+
+    &:last-child
+      +border-radius(0 6px 6px 0)
+
+.btn-toolbar
+  .btn.active
+    color: $inverse
+

data/vendor/assets/stylesheets/flat-ui/modules/_checkbox-and-radio.sass

@@ -0,0 +1,86 @@
+// Checkbox & Radio
+.checkbox,
+.radio
+  margin-bottom: 12px
+  padding-left: 32px
+  position: relative
+  +transition(.25s)
+
+  &:hover
+    color: $firm
+
+  input
+    outline: none !important
+    +opacity(0)
+
+  &.checked
+    .icon
+      background-position: -60px -30px
+      opacity: 1
+      display: block\9
+
+    .icon-to-fade
+      opacity: 0
+      display: none\9
+
+  // Disabled state
+  &.disabled
+    color: scale-color($gray, $lightness: 62%)
+    cursor: default
+
+    .icon
+      opacity: 0
+      display: none\9
+
+    .icon-to-fade
+      background-position: -30px -60px
+      opacity: 1
+      display: block\9
+
+    &.checked
+      .icon
+        background-position: 0 -90px
+        opacity: 1
+        display: block\9
+
+      .icon-to-fade
+        opacity: 0
+        display: none\9
+
+  // Icon
+  .icon,
+  .icon-to-fade
+    background: url('../images/checkbox.png') -90px 0 no-repeat
+    display: block
+    height: 20px
+    left: 0
+    opacity: 1
+    position: absolute
+    top: -1px
+    width: 20px
+    +transition(opacity .1s linear)
+
+  .icon
+    opacity: 0
+    top: 0
+    z-index: 2
+    display: none\9
+
+// Radio
+.radio
+  .icon,
+  .icon-to-fade
+    background-image: url('../images/radio.png')
+
+// Serving 2x images
+@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (-moz-min-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 2)
+  .checkbox
+    .icon
+      background-image: url('../images/checkbox-2x.png')
+      background-size: 110px 110px
+
+  .radio
+    .icon
+      background-image: url('../images/radio-2x.png')
+      background-size: 110px 110px
+

data/vendor/assets/stylesheets/flat-ui/modules/_demo.sass

@@ -0,0 +1,228 @@
+// For demo purposes only
+.demo-headline
+  padding: 73px 0 110px
+  text-align: center
+
+.demo-logo
+  font-size: 90px
+  font-weight: 900
+  letter-spacing: -2px
+  line-height: 100px
+
+  .logo
+    background: url('../images/demo/logo-mask.png') center 0 no-repeat
+    background-size: 256px 186px
+    height: 186px
+    margin: 0 auto 26px
+    overflow: hidden
+    text-indent: -9999em
+    width: 256px
+
+  small
+    color: rgba($base, .3)
+    display: block
+    font-size: 22px
+    font-weight: 700
+    letter-spacing: -1px
+    padding-top: 5px
+
+// Panels delimiter
+.demo-row
+  margin-bottom: 20px
+
+.demo-panel-title
+  margin-bottom: 20px
+  padding-top: 20px
+
+  small
+    color: scale-color(desaturate($base, 25%), $lightness: 66%)
+    font-size: inherit
+    font-weight: 400
+
+// Shift blocks to fit design
+.demo-navigation
+  margin-bottom: -4px
+  margin-top: -10px
+
+.demo-pager
+  margin-top: -10px
+
+.demo-tooltips
+  height: 126px
+
+  // Needed just for the demo. Don't use it in producion ;)
+  .tooltip
+    left: -8px !important
+    position: relative !important
+    top: -8px !important
+
+.demo-headings
+  margin-bottom: 12px
+
+.demo-tiles
+  margin-bottom: 46px
+
+.demo-icons
+  margin-bottom: 115px
+
+.demo-icons-24
+  font-size: 24px
+  margin-bottom: 38px
+  position: relative
+  span
+    margin: 0 0 0 18px
+    &:first-child
+      margin-left: 0
+
+.demo-icons-16
+  font-size: 16px
+  margin: 0 0 38px 5px
+  position: relative
+  span
+    margin: 0 0 0 28px
+    &:first-child
+      margin-left: 0
+
+.demo-icons-tooltip
+  bottom: 0
+  color: scale-color($base, $lightness: 70%)
+  font-size: 12px
+  left: 100%
+  margin-left: 0 !important
+  position: absolute
+  width: 80px
+
+.demo-illustrations
+  margin-bottom: 45px
+
+  img
+    height: 100px
+    margin-left: 35px
+    width: 100px
+    vertical-align: bottom
+
+    &:first-child
+      margin-left: 0
+
+    &.big-illustration
+      height: 111px
+      width: 112px
+
+    &.big-retina-illustration
+      height: 104px
+      margin-right: -24px
+      width: 117px
+
+    &.big-illustration-pusher
+      margin-right: 12px
+
+.demo-samples
+  margin-bottom: 46px
+
+.demo-video
+  border-radius: 6px
+  padding-top: 95px
+
+.demo-download-section
+  float: none
+  margin: 0 auto
+  padding: 60px 0 90px 20px
+  text-align: center
+
+  [class*='fui-']
+    margin: 3px 0 -3px
+
+.demo-download
+  background-color: scale-color($base, $lightness: 90%)
+  border-radius: 50%
+  height: 120px
+  margin: 0 auto 32px
+  padding: 40px 28px 30px 32px
+  text-align: center
+  width: 130px
+
+  img
+    height: 104px
+    width: 82px
+
+.demo-download-text
+  font-size: 15px
+  padding: 20px 0
+  text-align: center
+
+.demo-text-box
+  a:hover
+    color: $firm
+
+.demo-browser
+  background: scale-color($base, $lightness: -15%) url('../images/demo/browser.png') 0 0 no-repeat
+  background-size: 659px 42px
+  border-radius: 0 0 6px 6px
+  color: $inverse
+  margin: 0 41px 140px 0
+  padding-top: 42px
+
+.demo-browser-side
+  float: left
+  padding: 22px 20px
+  width: 111px
+
+  > h5
+    margin-bottom: 3px
+    text-transform: none
+
+  > h6
+    font-size: 11px
+    font-weight: 300
+    line-height: 18px
+    margin-top: 3px
+    text-transform: none
+
+.demo-browser-author
+  background: url('../images/demo/browser-author.jpg') center center no-repeat
+  border: 3px solid $inverse
+  display: block
+  height: 84px
+  margin: 0 auto
+  width: 84px
+  +border-radius(50%)
+
+.demo-browser-action
+  padding: 30px 0 12px
+
+  > .btn
+    padding: 9px 0 10px 11px
+    text-align: left
+    +border-radius(3px)
+
+    &:before
+      color: $inverse
+      content: '\e004'
+      font-size: 16px
+      font-family: 'Flat-UI-Icons-16'
+      font-weight: 300
+      margin-right: 12px
+      position: relative
+      top: 1px
+      -webkit-font-smoothing: antialiased
+
+.demo-browser-content
+  background-color: $base
+  border-radius: 0 0 6px
+  overflow: hidden
+  padding: 21px 0 0 20px
+
+  > img
+    border: 6px solid $inverse
+    float: left
+    margin: 0 15px 20px 0
+    width: 134px
+
+// Serving 2x images
+@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (-moz-min-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 2)
+  .logo
+    background-image: url('../images/demo/logo-mask-2x.png')
+
+  .demo-browser
+    background-image: url('../images/demo/browser-2x.png')
+