`/#contact` linking fixed

mwilkins74 commented 4 months ago

Got this linking fixed when the Contact FooterLink is clicked.

Stuck on how to get the same functionality when the Contact Link is clicked inside of the NavList.

netlify[bot] commented 4 months ago

Deploy Preview for kurt-sensenbrenner ready!

Name	Link
Latest commit	f20d0c5e183da57c04fda6469b6914ff6eefaf5f
Latest deploy log	https://app.netlify.com/sites/kurt-sensenbrenner/deploys/65efbb15a7118500090510db
Deploy Preview	https://deploy-preview-119--kurt-sensenbrenner.netlify.app
Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

kmdunn5 commented 4 months ago

Oh, @mwilkins74 I remember having this issue when I first added this before stuff got changed. The /#contact only works with a <Link> component. It doesn't work with the navigate("/#contact"). I had to do this to make it work for the button. The to="/#contact" is necessary.

mwilkins74 commented 4 months ago

Oh fantastic! That's what I was able to determine - that it only worked with the <Link>, but my brain didn't even think to implement to to= attribute. Duh!

mwilkins74 commented 4 months ago

Ok, I removed the prop from the Home component and kept it inside of the Contact component. The Contact FooterLink and the Like My Work button works to jump to the Contact component. In the NavList component, it won't jump directly to the Contact component. When I click the Contact link inside of the NavList the route changes tohttp://localhost:3000/#contact, but it just renders the top of the Home component. I'm not seeing what I'm missing?

It's mapping through this enum:

export const navLinks = [
  { route: '/', label: 'Recent Work' },
  { route: '/about', label: 'About' },
  { route: '/#contact', label: 'Contact' },
] as const

So the to attribute does become /#contact so what am I missing in the rendering of the Contact component when this route is hit?

ChuckBTaylor commented 4 months ago

I think you've got your cause-effect wrong. None of the links are working properly. The Footer and "Like My Work?" link just look like they're working correctly

mwilkins74 commented 3 months ago

I think you've got your cause-effect wrong. None of the links are working properly. The Footer and "Like My Work?" link just look like they're working correctly

Can you elaborate a bit for me, please? When clicked the Footer and the "Like My Work" links jump to the Contact form (route becomes: http://localhost:3000/#contact) so how are they not working? I'm not clear on how they look like they're working correctly?

mwilkins74 commented 3 months ago

All of your changes look great. Really like the Utility file to scroll to the hash. I never would have thought of that.

mwkwsd / sensensomething