From ad00b2dc9492d20b3b8c3dcd7c5b425ee7f8d404 Mon Sep 17 00:00:00 2001
From: Armand Philippot <git@armandphilippot.com>
Date: Fri, 18 Feb 2022 19:36:23 +0100
Subject: refactor(animations): replace width animations with transform

Animations based on width or height can be expensive and can cause
lower performances. So, instead I use transform to obtain the same
effect.
---
 src/components/Branding/Branding.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

(limited to 'src/components/Branding/Branding.tsx')

diff --git a/src/components/Branding/Branding.tsx b/src/components/Branding/Branding.tsx
index 4ec52c3..07b9259 100644
--- a/src/components/Branding/Branding.tsx
+++ b/src/components/Branding/Branding.tsx
@@ -24,7 +24,7 @@ const Branding: BrandingReturn = ({ isHome = false }) => {
     if (logoRef.current) {
       logoRef.current.style.setProperty(
         '--branding-logo-animation',
-        'flip-logo 5.4s ease-in 0s 1'
+        'flip-logo 6.4s ease-in 0s 1'
       );
     }
   }, []);
@@ -33,7 +33,7 @@ const Branding: BrandingReturn = ({ isHome = false }) => {
     if (titleRef.current) {
       titleRef.current.style.setProperty(
         '--branding-name-animation',
-        'blink 0.5s ease-in-out 0s 1, branding-name-typing 2.8s linear 0s 1'
+        'blink 0.5s ease-in-out 0s 1, branding-name-typing 3s linear 0s 1'
       );
     }
   }, []);
@@ -42,7 +42,7 @@ const Branding: BrandingReturn = ({ isHome = false }) => {
     if (jobRef.current) {
       jobRef.current.style.setProperty(
         '--branding-job-animation',
-        'branding-job-typing 7s linear 0s 1, blink 0.8s ease-in-out 5s 3'
+        'branding-job-typing 8s linear 0s 1, blink 0.8s ease-in-out 6s 3'
       );
     }
   }, []);
-- 
cgit v1.2.3

