From 9a5c8a135e742fe64cb2a168e29f5decf2cf13cb Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fe=CC=81lix=20Pe=CC=81ault?= <hello@flayks.com>
Date: Fri, 6 Mar 2020 11:14:13 +0100
Subject: [PATCH] Buttons: Change text direction on hover

---
 src/style/atoms/_button-outline.scss | 4 ++--
 src/style/atoms/_button.scss         | 4 ++--
 src/style/atoms/_link.scss           | 4 ++--
 3 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/style/atoms/_button-outline.scss b/src/style/atoms/_button-outline.scss
index 27423db..a7766f5 100644
--- a/src/style/atoms/_button-outline.scss
+++ b/src/style/atoms/_button-outline.scss
@@ -39,7 +39,7 @@
             top: 50%;
             left: 0;
             right: 0;
-            transform: translateY(-120%);
+            transform: translateY(100%);
         }
 
         span, &:after {
@@ -61,7 +61,7 @@
 
         span {
             opacity: 0;
-            transform: translateY(100%);
+            transform: translateY(-75%);
         }
         .text:after {
             opacity: 1;
diff --git a/src/style/atoms/_button.scss b/src/style/atoms/_button.scss
index 09c9651..6d8b8ec 100644
--- a/src/style/atoms/_button.scss
+++ b/src/style/atoms/_button.scss
@@ -60,7 +60,7 @@
             top: 50%;
             left: 0;
             width: 100%;
-            transform: translateY(-120%);
+            transform: translateY(100%);
         }
     }
 
@@ -86,7 +86,7 @@
         .text {
             span {
                 opacity: 0;
-                transform: translateY(100%);
+                transform: translateY(-75%);
             }
             &:after {
                 opacity: 1;
diff --git a/src/style/atoms/_link.scss b/src/style/atoms/_link.scss
index 141deae..04f25d3 100644
--- a/src/style/atoms/_link.scss
+++ b/src/style/atoms/_link.scss
@@ -88,7 +88,7 @@
 
         span {
             display: inline-block;
-            transform: translateY(-75%);
+            transform: translateY(100%);
             opacity: 0;
             transition: all 275ms $ease-cubic;
             will-change: transform, opacity;
@@ -99,7 +99,7 @@
     &:hover {
         .text {
             &:after {
-                transform: translateY(25%);
+                transform: translateY(-75%);
                 opacity: 0;
             }