In short, I discovered that the project already uses an outdated version of Material UI, so to be as close to the original stack as possible, I decided make more heavy use of MUI to alter the project in order to make it responsive.
In my PR, I made the following changes:
V5(latest stable version)
- Implemented a Theme Provider for
responsive fontsupport (used in the nav title)
- Reworked navigation, so react-router-dom is now capable of doing in-site, SPA style navigations (no complete page reload needed)
NavButton, that reacts to the current in-site history API navigation pathname (active buttons are disabled)
- Altered the top navigation bar, in mobile view a hamburger menu is shown instead of the normal nav buttons
- Implemented a navigation drawer, only visible on mobile view
- Removed the limitation that bails out of rendering in mobile view
- Moved the game cards to MUI cards
- Introduced logic to break the camera view below the hand card in mobile view
Because of the extent of my changes and subsequent merges from the maintainer, I had to resolve merge conflicts between the repo's main branch and my PR. Also, I did extensive testing on both desktop and mobile devices to make sure the application works as expected.
During this process I did get a chance to brush up on, and deepen my
Material-UI knowledge. The project had some significant changes since I last had a chance to work with it.
At the time of writing, the PR was not yet merged, because of the relatively large amount of code and busy schedule of the code maintainer. The PR was posted on the 5th of December, so ample time was given to review and merge. Any additional questions were, and will be promptly answered.