Community forum for knowledge and support

Updated 4 months ago

Optimizing the contact modal layout

At a glance

Question on contact modal. I imported contact-modal-1. It was imported as a section including padding-global and padding-section-large. I moved the 'open modal' button to the main navigation and changed it to contact. Do I need to keep all the padding in the section? It's creating a bunch of unnecessary space.

M
W
5 comments

naw you wont need all of those extra divs. But try to keep the button and the modal component near each other if possible.

Thanks. I didn't think so, but didn't want to break anything. I was thinking of putting the modal in the footer since it is on every page. That way, I don't have to add the modal to every page. But that puts the modal as far away from the button (in the navbar) as possible.

I'll play around with it. In the meantime, curious if you (or anyone else) have thoughts on best practices for contact modals or whether you should even use them and instead use a contact page?

ah well in that case I do have a quick loom on this topic - its covering a larger topic but addresses this one as well.
https://relume.notion.site/How-to-add-multiple-modals-5012143c03f14e6da19f8cd3e23e7f3f?pvs=4

In short it is totally possible to do what you are doing and yeah putting the modal in the footer is what I would consider industry best practices.

Thanks . I put it in the footer and it mostly works. I'm in preview mode. If I navigate from one page to another, it doesn't always work (the modal doesn't appear. Maybe it is because of preview mode. I'll play around with it some more. Thanks for your help!

no worries, share a read-only and I can help too - should be easy enough to resolve.

Add a reply
Sign up and join the conversation on Slack