@corva/ui 0.99.0-6 → 0.99.0-8

package/styles/common.scss

@@ -51,7 +51,8 @@ $palette_p16: var(--palette-pastel-p-16);
 
 /* Other common variables ./src/styles/vars.base.scss */
 $spacing: 8px;
-$transition: all cubic-bezier(0.4, 0, 0.2, 1) 0.15s;
+$transition_parameters: cubic-bezier(0.4, 0, 0.2, 1) 0.15s;
+$transition: all $transition_parameters;
 $fontFamily: 'Roboto', sans-serif;
 
 :export {
@@ -78,3 +79,16 @@ $fontFamily: 'Roboto', sans-serif;
 
   @return ($top * $spacing) ($right * $spacing) ($bottom * $spacing) ($left * $spacing);
 }
+
+@function transition($properties...) {
+  $result: '';
+  @each $property in $properties {
+    @if ($result != '') {
+      $result: $result + ', ';
+    }
+
+    $result: $result + $property + ' ' + $transition_parameters;
+  }
+
+  @return #{$result};
+}

package/styles/utils.scss

@@ -17,3 +17,16 @@
 
   @return ($top * $spacing) ($right * $spacing) ($bottom * $spacing) ($left * $spacing);
 }
+
+@function transition($properties...) {
+  $result: '';
+  @each $property in $properties {
+    @if ($result != '') {
+      $result: $result + ', ';
+    }
+
+    $result: $result + $property + ' ' + $transition_parameters;
+  }
+
+  @return #{$result};
+}

package/styles/vars.base.scss

@@ -1,5 +1,6 @@
 $spacing: 8px;
-$transition: all cubic-bezier(0.4, 0, 0.2, 1) 0.15s;
+$transition_parameters: cubic-bezier(0.4, 0, 0.2, 1) 0.15s;
+$transition: all $transition_parameters;
 $fontFamily: 'Roboto', sans-serif;
 
 :export {