Adds a modal to the file input section to clean up the user interface.
...
current input section:
![image](https://github.com/user-attachments/assets/5edb8bf6-a788-402c-beac-5d921128b618)
input section following changes:
![image](https://github.com/user-attachments/assets/c4d1738a-464b-4661-8601-3446d2f801d9)
The Upload JSON File button opens a modal:
![image](https://github.com/user-attachments/assets/772853c2-c970-4829-999d-a7c3d8f8c050)
Screenshots of your changes (if applicable)
Type of Change
(Write an X or a brief description next to the type or types that best describe your changes.)
Type
Applies?
π¨ Breaking change (fix or feature that would cause existing functionality to change)
β¨ New feature (non-breaking change that adds functionality)
π Bug fix (non-breaking change that fixes an issue)
π¨ User interface change (change to user interface; provide screenshots)
X
β»οΈ Refactoring (internal change to codebase, without changing functionality)
π¦ Test update (change that only adds or modifies tests)
π Documentation update (change that only updates documentation)
π¦ Dependency update (change that updates a dependency)
π§ Internal (change that only affects developers or continuous integration)
Checklist
(Complete each of the following items for your pull request. Indicate that you have completed an item by changing the [ ] into a [x] in the raw text, or by clicking on the checkbox in the rendered description on GitHub.)
Before opening your pull request:
[x] I have performed a self-review of my changes.
Check that all changed files included in this pull request are intentional changes.
Check that all changes are relevant to the purpose of this pull request, as described above.
[x] I have added tests for my changes, if applicable.
This is required for all bug fixes and new features.
[ ] I have updated the project documentation, if applicable.
This is required for new features.
[ ] If this is my first contribution, I have added myself to the list of contributors.
[x] I have updated the project Changelog (this is required for all changes).
After opening your pull request:
[x] I have verified that the CI tests have passed.
[x] I have reviewed the test coverage changes reported by Coveralls.
Hello Professor! I managed to get the button to a reasonable size without having to rewrite any classes, but I can't seem to vertically center the file browse button within the modal window -- I included screenshots of this. From using the inspect tool, it seems like the file browse/input button is placed inside a div once the website is rendered but not centered within it. I'm not sure how to modify this div, or get rid of it. Do you have any suggestions on next steps? Thanks!
Proposed Changes
Adds a modal to the file input section to clean up the user interface.
...
Screenshots of your changes (if applicable)
Type of Change
(Write an
X
or a brief description next to the type or types that best describe your changes.)Checklist
(Complete each of the following items for your pull request. Indicate that you have completed an item by changing the
[ ]
into a[x]
in the raw text, or by clicking on the checkbox in the rendered description on GitHub.)Before opening your pull request:
After opening your pull request:
Questions and Comments
Hello Professor! I managed to get the button to a reasonable size without having to rewrite any classes, but I can't seem to vertically center the file browse button within the modal window -- I included screenshots of this. From using the inspect tool, it seems like the file browse/input button is placed inside a div once the website is rendered but not centered within it. I'm not sure how to modify this div, or get rid of it. Do you have any suggestions on next steps? Thanks!