michaeljblum · September 24, 2019 01:41
diff --git a/Nav.js b/Nav.js
 import React from 'react';
 import { a, useTransition} from 'react-spring'
 import { Link } from 'react-router-dom';

 const Nav = ({ toggleNav }) => {

    const navOverlayAnimation = useTransition(toggleNav, null, {
        from: {opacity: 0, visibility: 'hidden'},
        enter: {opacity: 1, visibility: 'visible'},
        leave: {opacity: 0},
        unique: true
      })
    
    return (
        navOverlayAnimation.map(({ item, key, props: transitionAnim }) => item &&
            <a.nav key={key} style={transitionAnim}>
                <div className='Nav__wrapper'>
                {/* <div className={(toggleNav ? 'Nav__wrapper-open' : 'Nav__wrapper' )}> */}
                <ul className='Nav__link-group'>
                    <li>
                        <Link to='' className='Nav__link'>Home</Link>
                    </li>
                    <li>
                        <Link to=''>About</Link>
                    </li>
                    <li>
                        <Link to=''>Contact</Link>
                    </li>
                </ul>
                <ul className='Nav__link-group'>
                    <li>
                        <Link to=''>Blog</Link>
                    </li>
                    <li>
                        <Link to=''>Portfolio</Link>
                    </li>
                    <li>
                        <Link to=''>News</Link>
                    </li>
                </ul>
                </div>
            </a.nav>
            )
    )
 }

 export default Nav