uniform-ui 3.0.0.beta8 → 3.0.0.beta10

data/lib/assets/stylesheets/uniform/utilities/effects.scss

@@ -60,6 +60,37 @@
     }
 }
 
+.transition-fade-down,
+.transition-fade-up,
+.transition-fade-left,
+.transition-fade-right {
+    transition: transform 100ms, opacity 100ms;
+    opacity: 1;
+    &.-out {
+        opacity: 0;
+    }
+}
+.transition-fade-down {
+    &.-out {
+        transform: translateY(10px);
+    }
+}
+.transition-fade-up {
+    &.-out {
+        transform: translateY(-10px);
+    }
+}
+.transition-fade-left {
+    &.-out {
+        transform: translateX(10px);
+    }
+}
+.transition-fade-right {
+    &.-out {
+        transform: translateX(-10px);
+    }
+}
+
 
 //----------------------------------------------------------------
 //             Transforms

data/lib/assets/stylesheets/uniform/utilities/layout.scss

@@ -1,23 +1,5 @@
 @import 'uniform/mixins';
 
-//----------------------------------------------------------------
-//             Container
-//----------------------------------------------------------------
-// TODO match this with breakpoints variable, so that breakpoints can change and adjust this
-.container{
-    margin: auto;
-    @include breakpoint('md'){
-        max-width: 720px;
-    }
-    @include breakpoint('lg'){
-        max-width: 1080px;
-    }
-    @include breakpoint('xl'){
-        max-width: 1400px;
-    }
-}
-
-
 //----------------------------------------------------------------
 //             Display
 //----------------------------------------------------------------
@@ -65,9 +47,10 @@
 @include responsive-rule('flex-nowrap'){ flex-wrap: nowrap; }
 @include responsive-rule('flex-wrap'){ flex-wrap: wrap; }
 
-@include responsive-rule('flex-initial'){ flex: 0 1 auto; }
 @include responsive-rule('flex-fill'){ flex: 1 1 auto; }
-@include responsive-rule('flex-none'){ flex: none; }
+@include responsive-rule('flex-grow'){ flex: 1 0 auto; }
+@include responsive-rule('flex-shrink'){ flex: 0 1 auto; }
+@include responsive-rule('flex-none'){ flex: 0 0 auto; }
 
 @for $i from 1 through 12 {
     @include responsive-rule('order-#{$i}'){ order: $i; }
@@ -83,6 +66,16 @@
     @include responsive-rule('col-start-#{$i}'){ grid-column-start: $i; }
     @include responsive-rule('col-end-#{$i}'){ grid-column-end: $i; }
 }
+
+@for $i from 0 through 100 {
+    @include responsive-rule(".cols-fill-#{$i * 5}-px"){ 
+        grid-template-columns: repeat(auto-fill, minmax($i * 5px, 1fr));
+    };
+    @include responsive-rule(".cols-fit-#{$i * 5}-px"){ 
+        grid-template-columns: repeat(auto-fit, minmax($i * 5px, 1fr));
+    };
+}
+
 @for $i from 1 through 6 {
     @include responsive-rule('rows-#{$i}'){ grid-template-rows: repeat($i, minmax(0, 1fr)); }
     @include responsive-rule('row-span-#{$i}'){ grid-row: span $i / span $i; }

data/lib/assets/stylesheets/uniform/utilities/position.scss

@@ -13,6 +13,10 @@ static
 @each $direction in 'top' 'right' 'bottom' 'left' {
     @include responsive-rule('.#{$direction}-0'){ #{$direction}: 0; }
     @include responsive-rule('.#{$direction}-auto'){ #{$direction}: auto; }
+    .sticky-#{$direction}{
+        position:sticky;
+        #{$direction}: 0;
+    }
 }
 @include responsive-rule('position-fill'){
     position:absolute;

data/lib/assets/stylesheets/uniform/utilities/text.scss

@@ -8,6 +8,7 @@
     --text-opacity: 1.0;
     color: rgba($color, var(--text-opacity));
 }
+@include responsive-rule('.text-current') { color: currentColor; }
 @include responsive-rule('.text-md') { font-size: 1rem; }
 @include color-rule('.placeholder') using ($color){
     &::placeholder{

data/lib/assets/stylesheets/uniform/utilities.scss

@@ -13,6 +13,9 @@
 .overflow-x{
     overflow-x: auto;
 }
+.overflow-x-scroll{
+    overflow-y: scroll;
+}
 
 //----------------------------------------------------------------
 //             Element Reset
@@ -47,6 +50,9 @@ grab
         cursor: $type;
     }
 }
+.cursor-move-v {
+    cursor: ns-resize;
+}
 
 //----------------------------------------------------------------
 //             SVG

data/lib/uniform/version.rb

@@ -1,3 +1,3 @@
 module Uniform
-  VERSION = "3.0.0.beta8"
+  VERSION = "3.0.0.beta10"
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: uniform-ui
 version: !ruby/object:Gem::Version
-  version: 3.0.0.beta8
+  version: 3.0.0.beta10
 platform: ruby
 authors:
 - Ben Ehmke
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2021-08-19 00:00:00.000000000 Z
+date: 2022-01-11 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: sass
@@ -51,12 +51,14 @@ files:
 - lib/assets/javascripts/uniform/checkbox.js
 - lib/assets/javascripts/uniform/component.js
 - lib/assets/javascripts/uniform/dropdown.js
+- lib/assets/javascripts/uniform/dropzone.js
 - lib/assets/javascripts/uniform/floating-label-input.js
 - lib/assets/javascripts/uniform/icons.js
 - lib/assets/javascripts/uniform/modal.js
 - lib/assets/javascripts/uniform/popover.js
 - lib/assets/javascripts/uniform/resizer.js
 - lib/assets/javascripts/uniform/select.js
+- lib/assets/javascripts/uniform/sticker.js
 - lib/assets/javascripts/uniform/tooltip.js
 - lib/assets/stylesheets/uniform.scss
 - lib/assets/stylesheets/uniform/base.scss
@@ -64,6 +66,7 @@ files:
 - lib/assets/stylesheets/uniform/components/checkbox.scss
 - lib/assets/stylesheets/uniform/components/container.scss
 - lib/assets/stylesheets/uniform/components/dropdown.scss
+- lib/assets/stylesheets/uniform/components/dropzone.scss
 - lib/assets/stylesheets/uniform/components/floating-label-input.scss
 - lib/assets/stylesheets/uniform/components/input-group.scss
 - lib/assets/stylesheets/uniform/components/label.scss
@@ -75,8 +78,12 @@ files:
 - lib/assets/stylesheets/uniform/components/table.scss
 - lib/assets/stylesheets/uniform/components/thumb.scss
 - lib/assets/stylesheets/uniform/components/z-input.scss
+- lib/assets/stylesheets/uniform/config.scss
 - lib/assets/stylesheets/uniform/defaults.scss
 - lib/assets/stylesheets/uniform/functions.scss
+- lib/assets/stylesheets/uniform/functions/icons.scss
+- lib/assets/stylesheets/uniform/functions/map.scss
+- lib/assets/stylesheets/uniform/functions/string.scss
 - lib/assets/stylesheets/uniform/mixins.scss
 - lib/assets/stylesheets/uniform/utilities.scss
 - lib/assets/stylesheets/uniform/utilities/background.scss
@@ -88,7 +95,6 @@ files:
 - lib/assets/stylesheets/uniform/utilities/spacing.scss
 - lib/assets/stylesheets/uniform/utilities/svg.scss
 - lib/assets/stylesheets/uniform/utilities/text.scss
-- lib/assets/stylesheets/uniform/variables.scss
 - lib/uniform.rb
 - lib/uniform/version.rb
 homepage: http://bemky.github.io/uniform/

data/lib/assets/stylesheets/uniform/variables.scss

@@ -1,145 +0,0 @@
-//----------------------------------------------------------------
-//             Text
-//----------------------------------------------------------------
-$text-inputs: "input:not([type=search]):not([type=submit]):not([type=checkbox]):not([type=radio])";
-$system-font: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
-$base-font: $system-font;
-
-$base-font: if(variable-exists('base-font'), $base-font, $system-font);
-
-
-//----------------------------------------------------------------
-//             Includes
-//----------------------------------------------------------------
-$include_child_utilities: if(variable-exists('include_child_utilities'), $include_child_utilities, false);
-$include_breakpoint_container: if(variable-exists('include_breakpoint_container'), $include_breakpoint_container, false);
-$include_pseudo_utilities: if(variable-exists('include_pseudo_utilities'), $include_pseudo_utilities, [hover]);
-
-//----------------------------------------------------------------
-//             Colors
-//----------------------------------------------------------------
-
-$colors: if(variable-exists('colors'), $colors, (
-    'gray':               #505152,
-    'green':              #97C848,
-    'blue':               #0994E2,
-    'red':                #E1563E,
-    'yellow':             #D7E542,
-    'purple':             #9461b9
-));
-$color_spectrum: (
-    'white':              #FFFFFF,
-);
-@each $name, $color in $colors {
-    $color_spectrum: map-merge($color_spectrum, ("#{$name}": $color));
-    @for $index from 1 through 9 {
-        $saturation_adjustment: 0;
-        @if saturation($color) > 20% {
-            $saturation_adjustment: ((100 - saturation($color)) / 4) * abs(5 - $index);
-        }
-        $color_spectrum: map-merge($color_spectrum, ("#{$name}-#{(10 - $index) * 10}": change-color($color, $lightness: $index * 10, $saturation: saturation($color) + $saturation_adjustment)));
-    }
-}
-
-
-//----------------------------------------------------------------
-//             Breakpoints
-//----------------------------------------------------------------
-// 720, 1080, 1440
-$include_breakpoint_container: if(variable-exists('include_breakpoint_container'), $include_breakpoint_container, false);
-$breakpoints: if(variable-exists('breakpoints'), $breakpoints, (
-    sm: "max-width: 719px",
-    md: "min-width: 720px",
-    lg: "min-width: 1080px",
-    xl: "min-width: 1440px"
-));
-
-
-//----------------------------------------------------------------
-//             Sizes
-//----------------------------------------------------------------
-$sizes: map-merge((
-  border: (
-    '': 1px,
-    'none': 0,
-    '2px': 2px,
-    '3px': 3px,
-    '4px': 4px
-  ),
-  divide: (
-    '': 1px,
-    'none': 0,
-    '2px': 2px,
-    '3px': 3px,
-    '4px': 4px
-  ),
-  rounded: (
-    '':  0.25rem,
-    'none': 0,
-    "xs":        0.1rem,
-    "sm":        0.2rem,
-    "lg":        0.5rem,
-    "xl":        1rem,
-  ),
-  margin: (
-    '':  1rem,
-    'none': 0,
-    "1\\/4x":      0.25rem,
-    "1\\/2x":      0.5rem,
-    "3\\/4x":      0.75rem,
-    "xs":        0.8rem,
-    "sm":        0.9rem,
-    "lg":        1.2rem,
-    "xl":        1.4rem,
-    "2x":        2rem,
-  ),
-  gap: (
-    '':  1rem,
-    'none': 0,
-    "xs":        0.8rem,
-    "sm":        0.9rem,
-    "lg":        1.2rem,
-    "xl":        1.4rem,
-  ),
-  space: (
-    '':  1rem,
-    'none': 0,
-    "xs":        0.8rem,
-    "sm":        0.9rem,
-    "lg":        1.2rem,
-    "xl":        1.4rem,
-    "2x":        2rem,
-    "4x":        4rem,
-  ),
-  pad: (
-    ''       : 1rem,
-    'none'   : 0,
-    "1\\/4x" : 0.25rem,
-    "1\\/2x" : 0.5rem,
-    "3\\/4x" : 0.75rem,
-    "xs"     : 0.8rem,
-    "sm"     : 0.9rem,
-    "lg"     : 1.2rem,
-    "xl"     : 1.4rem,
-    "2x"     : 2rem,
-
-  ),
-  text: (
-    '':  1rem,
-    "xs" : 0.8rem,
-    "sm" : 0.9rem,
-    "lg" : 1.2rem,
-    "xl" : 1.4rem,
-    "2x" : 2rem,
-    "4x" : 4rem,
-    "8x" : 8rem
-
-  ),
-  stroke: (
-      "sm" : 0.5px,
-      "md" : 1px,
-      "lg" : 1.5px,
-      "2x" : 2px,
-      "3x" : 3px
-  )
-), if(variable-exists('sizes'), $sizes, ()));