Create ContactCard component structure about rbb-website HOT 9 CLOSED

Id love to jump on this one

from rbb-website.

"The entire card should be clickable and trigger either the URL or a modal popup." -

So will the image be a link to the contact? I dont quite understand the requirement.

from rbb-website.

Apologies, let me elaborate off of the above screenshot:

Each card has an image.

If we look at the "Business Owners" card. On click of this card, a business registration form modal will appear. Don't worry about the contents of the modal for now, we just need the ability to trigger a modal if necessary from an individual card.

If we look at the "General Inquiry" card. Clicking of this card should be a mailto: link with a fake email address for now (we'll change this to the proper RBB support email). Opens in a new tab

The "Volunteers" card will be a Discord link (https://discord.gg/272XMuv). Opens in a new tab.

We need to be able to support the above cases with this component. Let me know if that helps!

from rbb-website.

Thats great info thank you! So its actually three cards with separate use cases!

from rbb-website.

Ahh i missed the screenshot, too eager! Thank you for clarifying :)

from rbb-website.

Thats great info thank you! So its actually three cards with separate use cases!

Three separate cards, but should only be one React component, with props to address each use case :)

Ahh i missed the screenshot, too eager! Thank you for clarifying :)

No worries at all!

from rbb-website.

Yep, all over it! First time using Chakra so learning that as i go. Will hopefully have this done by latest Sunday night.

from rbb-website.

I might suggest using the react-spring-modal package for the modals as well. It's a library I made that abstracts out a lot of the accessibility issues when dealing with models while still allowing you to keep the modals looking professional with the possibility of animations/transitions via react-spring. If not that's fine too as long as the modals we use are accessible.

https://npm.im/react-spring-modal

from rbb-website.

I might suggest using the react-spring-modal package for the modals as well. It's a library I made that abstracts out a lot of the accessibility issues when dealing with models while still allowing you to keep the modals looking professional with the possibility of animations/transitions via react-spring. If not that's fine too as long as the modals we use are accessible.

https://npm.im/react-spring-modal

Thanks Chris, We're using Chakra so I had thought to use their modal, but I will take a look at this package. I'm not a massive fan of spring but if needs must... 😊

from rbb-website.