From eb75d8ffef232ab2704d61fc2a46004a42e966f5 Mon Sep 17 00:00:00 2001
From: morethanwords <thanwords24@gmail.com>
Date: Fri, 1 Jan 2021 22:16:10 +0400
Subject: [PATCH] Improved label animation performance for Safari

---
 src/scss/partials/_input.scss | 17 +++++++----------
 1 file changed, 7 insertions(+), 10 deletions(-)

diff --git a/src/scss/partials/_input.scss b/src/scss/partials/_input.scss
index d18e3071..dd13eec0 100644
--- a/src/scss/partials/_input.scss
+++ b/src/scss/partials/_input.scss
@@ -38,11 +38,12 @@
     left: 1rem;
     right: auto;
     z-index: 2;
-    top: 50%;
-    transform: translateY(-50%);
+    top: 0;
+    height: 1.5rem;
+    transform: translateY(calc((54px - 1.5rem) / 2));
     background-color: #fff;
-    transition: .2s all, .1s opacity;
-    display: inline-block;
+    transition: .2s transform, .2s padding, .1s opacity;
+    transform-origin: left center;
     pointer-events: none;
   }
   
@@ -124,12 +125,8 @@
     }
     
     &:focus ~ label, &:valid ~ label, &:not(:empty) ~ label, &:disabled ~ label {
-      top: -.5rem;
-      transform: none;
-      padding: 0 5px;
-      left: .75rem;
-      font-size: .75rem!important;
-      //color: #666;
+      transform: translate(-.215rem, -.675rem) scale(0.75);
+      padding: 0 6px;
       opacity: 1;
     }
   }