From 8b4d948afbc77c007aa638c707e5917301e956e1 Mon Sep 17 00:00:00 2001
From: Evgeny Vanchugov <dragonesis@ya.ru>
Date: Mon, 29 Apr 2019 20:33:53 +0300
Subject: [PATCH 1/3] Add mixin for transition

---
 src/styles/mixins.scss | 25 +++++++++++++++++++++++++
 1 file changed, 25 insertions(+)

diff --git a/src/styles/mixins.scss b/src/styles/mixins.scss
index 24c959c93..5fa4139dc 100644
--- a/src/styles/mixins.scss
+++ b/src/styles/mixins.scss
@@ -58,3 +58,28 @@
   overflow: hidden;
   text-overflow: ellipsis;
 }
+
+// Service mixin
+@mixin simple_transition($value) {
+  transition: $value;
+}
+// Usage example: @include transition(height, opacity, transform);
+// Result of use: transition: height 0.3s ease 0s , opacity 0.3s ease 0s , transform 0.3s ease 0s , -webkit-transform 0.3s ease 0s;
+@mixin transition($args...) {
+  $type: nth($args, length($args));
+  $props: $args;
+  $result: ();
+
+  @for $i from 1 through length($props) {
+    $anim: length($args);
+    $prop: nth($props, $i);
+    $result: append($result, $prop);
+    $result: append($result, unquote($string: '0.3s ease 0s'));
+
+    @if $i != length($props) {
+      $result: append($result, unquote($string: ","));
+    }
+  }
+
+  @include simple_transition($result);
+}

From e2efcb3230d0ed3dc79d6cde155656f47eb0a012 Mon Sep 17 00:00:00 2001
From: Evgeny Vanchugov <dragonesis@ya.ru>
Date: Tue, 30 Apr 2019 11:38:40 +0300
Subject: [PATCH 2/3] Update transition value

---
 src/styles/mixins.scss | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/styles/mixins.scss b/src/styles/mixins.scss
index 5fa4139dc..0a2a453fd 100644
--- a/src/styles/mixins.scss
+++ b/src/styles/mixins.scss
@@ -64,7 +64,7 @@
   transition: $value;
 }
 // Usage example: @include transition(height, opacity, transform);
-// Result of use: transition: height 0.3s ease 0s , opacity 0.3s ease 0s , transform 0.3s ease 0s , -webkit-transform 0.3s ease 0s;
+// Result of use: transition: height 200ms cubic-bezier(0, 0, 0.2, 1) 0s , opacity 200ms cubic-bezier(0, 0, 0.2, 1) 0s , transform 200ms cubic-bezier(0, 0, 0.2, 1) 0s , -webkit-transform 200ms cubic-bezier(0, 0, 0.2, 1) 0s;
 @mixin transition($args...) {
   $type: nth($args, length($args));
   $props: $args;
@@ -74,7 +74,7 @@
     $anim: length($args);
     $prop: nth($props, $i);
     $result: append($result, $prop);
-    $result: append($result, unquote($string: '0.3s ease 0s'));
+    $result: append($result, unquote($string: 200ms $default-animation 0s));
 
     @if $i != length($props) {
       $result: append($result, unquote($string: ","));

From dd3f047c5ee7818d4436763df54a10d0714c49d2 Mon Sep 17 00:00:00 2001
From: Evgeny Vanchugov <dragonesis@ya.ru>
Date: Tue, 30 Apr 2019 11:52:29 +0300
Subject: [PATCH 3/3] Fix transition mixin

---
 src/styles/mixins.scss | 10 +++-------
 1 file changed, 3 insertions(+), 7 deletions(-)

diff --git a/src/styles/mixins.scss b/src/styles/mixins.scss
index 0a2a453fd..8e1fd4e16 100644
--- a/src/styles/mixins.scss
+++ b/src/styles/mixins.scss
@@ -59,13 +59,9 @@
   text-overflow: ellipsis;
 }
 
-// Service mixin
-@mixin simple_transition($value) {
-  transition: $value;
-}
-// Usage example: @include transition(height, opacity, transform);
+// Usage example: @include default-transition(height, opacity, transform);
 // Result of use: transition: height 200ms cubic-bezier(0, 0, 0.2, 1) 0s , opacity 200ms cubic-bezier(0, 0, 0.2, 1) 0s , transform 200ms cubic-bezier(0, 0, 0.2, 1) 0s , -webkit-transform 200ms cubic-bezier(0, 0, 0.2, 1) 0s;
-@mixin transition($args...) {
+@mixin default-transition($args...) {
   $type: nth($args, length($args));
   $props: $args;
   $result: ();
@@ -81,5 +77,5 @@
     }
   }
 
-  @include simple_transition($result);
+  transition: $result;
 }