search

TylerBarnes / gatsby-plugin-transition-link

A link component for page transitions in gatsby
537 stars 71 forks source link

AniLink background color not updating per link #247

Open donttalktorobots opened 3 years ago

donttalktorobots commented 3 years ago

I want each AniLink to have a different background color transition for "cover", but the transition only shows the first "bg" prop defined in the component. Am I missing something simple that will fix this?

Here is how I have my links set up, right now each transition only shows #9D2407:

           <li>
            <AniLink
              cover
              to="/delivery-kitchens/"
              direction="up"
              duration={1}
              bg="#9D2407"
              className="btn--text color--grey-5"
            >
              Delivery Kitchens
            </AniLink>
          </li>
          <li>
            <AniLink
              cover
              to="/technology/"
              direction="up"
              duration={1}
              bg="#B7661B"
              className="btn--text color--grey-5"
            >
              Technology
            </AniLink>
          </li>
jonoroboto commented 3 years ago

Bumping this, we're having the exact same issue. Would be unbelievably helpful to get this working.

jonoroboto commented 3 years ago

Just to add, happy to create codepen to show this in action

pdelfan commented 3 years ago

I have the same issue as well.

skimaharvey commented 3 years ago

Same issue here.

daledesilva commented 3 years ago

Same... even with one bg=hex and one bg=url

sathyaram commented 3 years ago

Bumping as well - issue is still persistant. bg/hex don't work and adding 'paintDrip' creates a duplicate link.

bichan17 commented 3 years ago

also having this issue on version 1.20.5

OTaylorUK commented 2 years ago

Still having this issue, would be great to get a fix although seems unlikely seeing as this appears to be an unfixed bug from 2020....