hackforla
Migrated Checkin Button to Material UI
Fixes #1683
What changes did you make and why did you make them ?
Changed from Default react components to Material UI in CheckinButtons.js
Screenshots of Proposed Changes Of The Website (if any, please do not screen shot code changes)
Visuals before changes are applied
Visuals after changes are applied
Want to review this pull request? Take a look at this documentation for a step by step guide!
From your project repository, check out a new branch and test the changes.
git checkout -b ntrehan-1683 development
git pull https://github.com/ntrehan/VRMS.git 1683
![github-actions[bot] avatar](https://avatars.githubusercontent.com/in/15368?v=4 "Published by a pub.dev verified publisher"){kind=small}
@ntrehan & @trillium - looks like the updated MUI buttons used in the above screenshots are no longer viewable to the user (no outline viewable on the button, only button text is viewable which may impact clear usability / understanding that this is an interactive element for the user).
I might recommend using the following MUI component if we want to replicate a similar style to the old button layout: <Button variant="outlined">Outlined</Button>. See more here: https://mui.com/material-ui/react-button/
That said, I'd check with @trillium on this first to get his thoughts :)
@trillium Do you think we should change this to an outlined button, like I mentioned in my previous comment before we go ahead and merge?
@ntrehan, confirmed with @trillium that we should change the button style to contain borders - please make the updates according to the above comment: https://github.com/hackforla/VRMS/pull/1725#issuecomment-2292034373
Hi @JackHaeg , @trillium
I have made the required changes as pointed out by jack and have also taken the liberty to add a small margin to avoid clumping of the outlined buttons
Please let me know if this is okay or any further changes are required
@trillium agrees with the changes above. Any team member can review this issue.