For my portfolio website, I am using React to create a unique typewriter effect showcasing some of my hobbies.
Currently, the code is set up like this:
"I like to"
[hobbies]
However, I want it to display like this:
"I like to" [hobbies]
Below is my React code for reference:
<div className="row banner">
<div className="banner-text">
<h1 className="responsive-headline">I am {resumeData.name}.</h1>
<h3>I am a {resumeData.role}.{resumeData.roleDescription}</h3>
<div className="typewriter-home">
<h2>I like
<Typical loop={Infinity}
steps={['Coding', 2000,'Soccer', 2000,
'Basketball', 2000, 'Finance', 2000,
'Tech', 2000]}/></h2>
</div>
CSS
.typewriter-home {
display: inline;
}