Text boxes are too small when window is ~800-1100px wide #1839
Labels
type: bug
Something isn't working
Comments
schultz96
added a commit
to CloudByteKS/microCOVID
that referenced
this issue
May 20, 2023
…smoother * If the number in the total population box is changed from 100,000, then the label for the box above it should change to "total weekly new cases" * At mobile screen width, the explanatory labels on the slider no longer work. Please set them to wrap properly. * Please send the instructions on how to edit the presets and their labels. * See if you can fix microCOVID#1839 (text boxes are unusable and widths between phone and desktop) * Change the text in the pink bar from "Step 1: Characterize community infection" to "Step 1: Enter COVID rate" * Change the instructions to: Use the slider or text box to enter weekly new COVID cases per 100,000 people in your area. You can also estimate whether cases are relatively low or high and use the preset options on the slider. In the US you can look up weekly new cases on covidactnow.org by clicking your state on the map, and then your county. The first number on the screen is "weekly new reported cases per 100k"
octern
pushed a commit
that referenced
this issue
Jul 10, 2023
* issue-1826 changes * issue-1826 pull-1837 feedback updates * issue-1836 v2 changes * revert yarn.lock * revert yarn.lock back * remove warnings potentially causing netlify * add styling libraries for mui * wrap in ThemeProvider * remove dependency mui and use a different library * update yarn.lock after fresh install * rm yarn & regenerate * rm yarn * revert again... * reinstall mui * issue-1836 updated based on feedback * * Please change the step value for the slider from 100 to 10 so it's smoother * If the number in the total population box is changed from 100,000, then the label for the box above it should change to "total weekly new cases" * At mobile screen width, the explanatory labels on the slider no longer work. Please set them to wrap properly. * Please send the instructions on how to edit the presets and their labels. * See if you can fix #1839 (text boxes are unusable and widths between phone and desktop) * Change the text in the pink bar from "Step 1: Characterize community infection" to "Step 1: Enter COVID rate" * Change the instructions to: Use the slider or text box to enter weekly new COVID cases per 100,000 people in your area. You can also estimate whether cases are relatively low or high and use the preset options on the slider. In the US you can look up weekly new cases on covidactnow.org by clicking your state on the map, and then your county. The first number on the screen is "weekly new reported cases per 100k" * fix typo in readme.md * fix step count showing decimals on slider * #1836 add + update slider with preset buttons and labels disappear when on mobile to avoid collision * eslint fixes * make buttons vertical instead of horizontal * increase step count to decrease lag and change text to include link (took out of <Trans> element to be able to insert URL into text) * fix label formatting issue preventing user from being able to click weekly new cases text field --------- Co-authored-by: kenny96 <kblaze1996@gmail.com>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Describe the bug
When the browser window is narrow (roughly phone-shaped) or wide (roughly desktop-shaped) the text boxes for new cases and total population looks normal. However, at widths of ~800-1100px, they become just two characters wide.
To Reproduce
Steps to reproduce the behavior:
Drag your window to 1000px wide (tested on Mac in Chrome and Firefox)
Expected behavior
The text boxes remain wide enough to see at least 7 digits.
Is this a regression?
No, this seems to be a longstanding issue.
The text was updated successfully, but these errors were encountered: