Header: remove initial animation as it was causing visual stutter

This commit is contained in:
rektdeckard
2020-09-09 21:39:48 -04:00
parent 361cacdabd
commit 2b84e5026e

View File

@@ -42,12 +42,7 @@ const handleScrollToIcons = () => {
const Header: React.FC<HeaderProps> = () => { const Header: React.FC<HeaderProps> = () => {
return ( return (
<header> <header>
<motion.div <div className="image-container">
className="image-container"
variants={illustrationVariants}
initial="hidden"
animate="visible"
>
<img src={markerPurple} id="marker-purple" alt="" /> <img src={markerPurple} id="marker-purple" alt="" />
<img src={paperclips} id="paperclips" alt="" /> <img src={paperclips} id="paperclips" alt="" />
<div className="intro"> <div className="intro">
@@ -123,7 +118,7 @@ const Header: React.FC<HeaderProps> = () => {
id="calculator" id="calculator"
className="inspectable" className="inspectable"
variants={illustrationVariants} variants={illustrationVariants}
initial="hidden" initial="visible"
whileHover="hidden" whileHover="hidden"
whileTap="hidden" whileTap="hidden"
src={calculator} src={calculator}
@@ -135,7 +130,7 @@ const Header: React.FC<HeaderProps> = () => {
id="tablet" id="tablet"
className="inspectable" className="inspectable"
variants={illustrationVariants} variants={illustrationVariants}
initial="hidden" initial="visible"
whileHover="hidden" whileHover="hidden"
whileTap="hidden" whileTap="hidden"
src={tablet} src={tablet}
@@ -151,7 +146,7 @@ const Header: React.FC<HeaderProps> = () => {
id="billiard-ball" id="billiard-ball"
className="inspectable" className="inspectable"
variants={illustrationVariants} variants={illustrationVariants}
initial="hidden" initial="visible"
whileHover="hidden" whileHover="hidden"
whileTap="hidden" whileTap="hidden"
src={billiardBall} src={billiardBall}
@@ -163,13 +158,13 @@ const Header: React.FC<HeaderProps> = () => {
id="warning" id="warning"
className="inspectable" className="inspectable"
variants={illustrationVariants} variants={illustrationVariants}
initial="hidden" initial="visible"
whileHover="hidden" whileHover="hidden"
whileTap="hidden" whileTap="hidden"
src={warning} src={warning}
alt="" alt=""
/> />
</motion.div> </div>
</header> </header>
); );
}; };