iugu-ux 0.8.0 → 0.8.5

data/sandbox/app/assets/stylesheets/application.css

@@ -1,3 +0,0 @@
-/*
- *= require 'experiment.sass'
-*/

data/sandbox/app/assets/stylesheets/default-sprites.sass

@@ -1,12 +0,0 @@
-@import "iugu-ux/core"
-  
-$assets: sprite-map("assets/*.png", $layout: smart, $spacing: 0px, $cleanup: true, $sprite-dimensions: true)
-$assets-hd: sprite-map("assets-hd/*.png", $layout: smart, $spacing: 0px, $cleanup: true, $sprite-dimensions: true)
-
-@include build-sprites("assets", $assets, normal)
-
-@include for-hd()
-  @include build-sprites("assets", $assets-hd, retina)
-  @include build-sprites("assets-hd", $assets-hd, retina)
-
-

data/sandbox/app/assets/stylesheets/experiment.sass

@@ -1,181 +0,0 @@
-@import "iugu-ux/core"
-@import "compass/utilities/general/clearfix"
-
-// CINZA
-// $background_base_color: #ECECEC
-// $base_ui_color: #F1ECE7
-$background_base_color: #3C5A76
-$base_ui_color: #ECECEC
-$mobile_navigation_color: #3D3D3D
-$header_ui_color: #5282BC
-
-$desktop_navigation_size: 256px
-$mobile_navigation_size: 256px
-
-$toolbar_height: 44px
-
-// Color Palette
-$background_highlight_color: lighten( $background_base_color, 10 )
-
-$base_ui_color_lighten: lighten( $base_ui_color, 10 )
-$base_ui_color_darken: darken( $base_ui_color, 10 )
-$base_ui_color_highlight: lighten( $base_ui_color, 50 )
-$base_ui_color_shadow: darken( $base_ui_color, 50 )
-
-$secondary_ui_color: darken( $base_ui_color, 3 )
-$secondary_ui_color_lighten: lighten( $secondary_ui_color, 10 )
-$secondary_ui_color_darken: darken( $secondary_ui_color, 10 )
-$secondary_ui_color_highlight: lighten( $secondary_ui_color, 50 )
-$secondary_ui_color_shadow: darken( $secondary_ui_color, 50 )
-
-$header_ui_color_lighten: lighten(   $header_ui_color, 10 )
-$header_ui_color_darken: darken(     $header_ui_color, 10 )
-$header_ui_color_highlight: lighten( $header_ui_color, 50 )
-$header_ui_color_shadow: darken(     $header_ui_color, 50 )
-
-html,body,#app
-  height: 100%
-  width: 100%
-  position: relative
-  @include box-sizing( border-box )
-
-html,body
-  overflow: hidden
-
-body
-  background: $background_base_color
-
-.ui-box
-  @include pie-clearfix
-  background: $base_ui_color
-  width: 100%
-  margin-left: auto
-  margin-right: auto
-  position: relative
-  color: #666
-  height: 100%
-  @include box-sizing( border-box )
-  border-left: 1px solid $base_ui_color_highlight
-  border-top: 1px solid $base_ui_color_highlight
-  border-right: 1px solid $base_ui_color
-  border-bottom: 1px solid $base_ui_color
-
-  .sidebar
-    float: left
-    width: $desktop_navigation_size 
-    height: 100%
-    background: $secondary_ui_color
-    border-right: 1px solid $secondary_ui_color_darken
-    padding: 20px
-    @include box-sizing( border-box )
-    position: relative
-
-  .content
-    height: 100%
-    position: relative
-    @include background( top, linear-gradient( lighten($base_ui_color, 3) 44px, $base_ui_color ) )
-
-    @include box-sizing( border-box )
-    .small-navigation
-      display: none
-    
-    &.handle-sidebar
-      border-left: 1px solid $secondary_ui_color_lighten
-      margin-left: $desktop_navigation_size
-
-@include for-large-screens()
-  body
-    padding: 20px
-    @include background-image( radial-gradient(top center, circle, $background_highlight_color 0px, rgba($background_highlight_color,0) 300px) ,linear-gradient(bottom, $background_highlight_color 30%,$background_base_color 70%) )
-  .ui-box
-    max-width: 980px
-    @include box-shadow( rgba(0,0,0,0.54) 0px 0px 2px, rgba(0,0,0,0.25) 0px 0px 20px )
-    border: 1px solid #FF0000, 2px solid #00FFFF
-    @include border-radius( 4px, 4px )
-
-@include for-small-screens()
-  body
-    background: $mobile_navigation_color
-
-  .mobile
-    .ui-box
-      .content.handle-sidebar
-        // @include translate3d(0,0,0)
-        +translateZ(0px)
-
-  .ui-box
-    border: none
-    background: $mobile_navigation_color
-
-    .sidebar
-      float: none
-      position: absolute
-      z-index: 1000
-      width: $mobile_navigation_size
-      border: none
-      background: $mobile_navigation_color
-      visibility: hidden
-
-      // @include transition-property( visibility, border, margin )
-      @include transition-delay( 0.3s )
-
-    .content.handle-sidebar
-      margin-left: 0px
-      border-left: none
-      z-index: 2000
-      min-width: 320px
-
-      @include transition-property( transform )
-      @include transition-duration( 300ms )
-      @include transition-timing-function( cubic-bezier(0.39, 0.575, 0.565, 1) )
-
-    // A merda esta aki
-    .content
-      @include background( top, linear-gradient( lighten($base_ui_color, 3) 44px, $base_ui_color ) )
-      @include box-shadow( rgba(0,0,0,0.54) 0px 0px 2px, rgba(0,0,0,0.8) 0px 0px 15px )
-      border-left: 1px solid $base_ui_color_highlight
-      border-top: 1px solid $base_ui_color_highlight
-      border-right: 1px solid $base_ui_color
-      border-bottom: 1px solid $base_ui_color
-      @include border-radius( 4px, 4px )
-
-      &.handle-sidebar
-        .small-navigation
-          display: block
-          height: $toolbar_height
-          position: relative
-          background: $header_ui_color
-          @include background( top, linear-gradient( $header_ui_color 22px, $header_ui_color_darken ) )
-
-          margin-top: -1px
-          margin-right: -2px
-
-          @include border-radius( 4px 4px 0px 0px )
-          border-left: 1px solid $header_ui_color_lighten
-          border-top: 1px solid $header_ui_color_lighten
-          border-right: 1px solid $header_ui_color
-          border-bottom: 1px solid $header_ui_color_shadow
-          
-          .toggle-sidebar
-            display: block
-            width: 44px
-            height: 44px
-            cursor: pointer
-            position: absolute
-            top: 0px
-            left: 0px
-            z-index: 10
-
-  .desktop .open, .mobile .open
-    border: none
-    .content.handle-sidebar
-      // @include translate3d( $mobile_navigation_size, 0, 0 )
-      +translateX( $mobile_navigation_size )
-
-    .sidebar
-      display: block
-      visibility: visible
-      margin: 1px
-
-      @include transition-property( border )
-      @include transition-delay( 0.3s )

data/sandbox/app/assets/stylesheets/mq-styles.sass

@@ -1,50 +0,0 @@
-@import "iugu-ux/core"
-@import "compass/utilities/general/clearfix"
-@import 'default-sprites'
-
-.mqc
-  background: #CCC
-  padding: 20px
-
-  .my_mq_button
-    +find-sprite( $assets, 'letsyell-logo' )
-
-@mixin get-image()
-  background: #F00
-
-@include for-small-screens()
-  .mqc
-
-    .my_mq_button
-      border: 1px solid #000
-      +find-sprite( $assets, 'arrow-up' )
-
-@include for-hd()
-  .mqc
-    .my_mq_button
-      border: 1px solid #F00
-      +find-sprite( $assets-hd, 'letsyell-logo' )
-
-.component-grid
-  .component-item
-    width: 440px
-
-  .component-description
-    width: 400px
-
-@include for-small-screens(915px)
-  .nav
-    .button
-      width: 50%
-  .component-grid  
-    margin-left: 0px
-    .component-item,.component-description
-      width: 100%
-      @include box-mode
-      margin: 0px
-      margin-bottom: $baseLineSpacing
-      float: none
-    .component-description
-      margin-bottom: 0px
-    .container
-      margin-bottom: $baseLineSpacing

data/sandbox/app/assets/stylesheets/mqtest.css

@@ -1,6 +0,0 @@
-/*
- * This is a manifest file that'll automatically include all the stylesheets available in this directory
- * and any sub-directories. You're free to add application-wide styles to this file and they'll appear at
- * the top of the compiled file, but it's generally better to create a new file per style scope.
- *= require 'mq-styles.sass'
-*/

data/sandbox/app/assets/stylesheets/sandbox-sprites.css

@@ -1,6 +0,0 @@
-/*
- * This is a manifest file that'll automatically include all the stylesheets available in this directory
- * and any sub-directories. You're free to add application-wide styles to this file and they'll appear at
- * the top of the compiled file, but it's generally better to create a new file per style scope.
- *= require 'default-sprites.sass'
-*/

data/sandbox/app/views/ui_library/mediaquery.html.haml

@@ -1,5 +0,0 @@
-.mqc{ :style => "margin-bottom: 20px" }
-
-  .my_mq_container
-
-    .my_mq_button