search

devict / devict.org

The amazing devict.org
https://devict.org
6 stars 28 forks source link

Namespace dev survey modal styles #102

Closed kelledge closed 6 years ago

kelledge commented 6 years ago

Obligatory "first pull request". Let me know if I need to do anything to get this merged.

Several CSS classes were introduced for the dev survey modal that shadow the bootstrap CSS modals used by the mentors page.

Normally the bootstrap modal class has a default "display" property of "none" but the new modal class had a default "display" property of "table". This caused the modal overlay to permanently be a part of the DOM with a Z-index that "covered" the entire page.

This commit namespaces these new CSS classes to prevent this.

Testing:

Done the old fashioned way. Manual. I believe I hit all the content, but I would appreciate if someone else checked as well.

Testing Environment:

$ hugo version
Hugo Static Site Generator v0.46 linux/amd64 BuildDate: 2018-08-01T09:00:55Z
Chrome: Version 67.0.3396.99 (Offizieller Build) (64-Bit

Alternatives Considered:

I considered updating the dev survey modal to use the bootstrap modal infrastructure, but decided against it primarily because the dev survey modal will be a temporary addition. My opinion is that it is much simpler to modify the existing implementation, rather than update the entire approach -- just to rip it all out once the survey is completed.

Future Considerations:

Use existing bootstrap modal infrastructure. It looks like bootstrap is already wired in the project. Both the CSS and JS artifacts are included the header and footer partials found under:

Discovery Method:

Discovered using git bisect. Took a stab at finding a good commit, then iterated until the "bad" commit was found

# git bisect start <bad> <good>
git bisect start master 2bea9c7efbdae04baba4d7a7233bd4a6ba821808
Introduced with:
commit 5ee6fdae43d74aad708bee8b31f138bc70d6a9e0
    Add modal for 2018 Salary Survey (#99)
kelledge commented 6 years ago

I think the biggest impact this issue has is on site navigation.

Once you navigate to the mentors page, this issue means you're stuck on a page that you can not interact with. This includes being unable to use the navigation bar to get back to a working page without using the browser's address bar.

As a user, I find site navigation issues super jarring.

jcbwlkr commented 6 years ago

Awesome work @kelledge! Thanks so much!