Increase input width for Patient Investigation

[Ashesh3]

Fixes #3535

Input fields are now big enough for the user to enter and review the data.

[netlify]

✅ Deploy Preview for care-egov-staging ready!

Name	Link
🔨 Latest commit	ced59fe
🔍 Latest deploy log	https://app.netlify.com/sites/care-egov-staging/deploys/63305a2c1fa5cd0008091ad6
😎 Deploy Preview	https://deploy-preview-3539--care-egov-staging.netlify.app/
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site settings.

[rabilrbl]

@Ashesh3 The UI is a bit confusing in small screens
Can we have flex-col so that fields stack in mobile devices?

[Ashesh3]

@Ashesh3 The UI is a bit confusing in small screens Can we have flex-col so that fields stack in mobile devices?

I agree that the table is a bit hard to navigate on smaller screens but I am afraid I am aware of no better solution. MaterialUI Table does not allow us to display the cells stacked according to the screen size.

https://mui.com/material-ui/api/table/

Although we can indeed force the cells to stack, this might not achieve the best results:

I believe that at it's current state (with this PR), it makes the table at least fully usable and represents it in an elegant manner.
If you know of any better way, feel free to suggest a change!

[nihal467]

@rabilrbl @Ashesh3 see a conversation here, once you finalise it, change the label to need testing

[Ashesh3]

@rabilrbl Which design looks better for you?

[rabilrbl]

@Ashesh3 Reached out to @gigincg told me @aparnacoronasafe Will confirm whether this UI is confusing or not.

[rabilrbl]

@rabilrbl Which design looks better for you?

Obviously the first one.

[Ashesh3]

@Ashesh3 Reached out to @gigincg told me @aparnacoronasafe Will confirm whether this UI is confusing or not.

Sure! Please do let me know here once you have an update on that.

[Ashesh3]

@rabilrbl @aparnacoronasafe Any updates on this?

[nihal467]

@Ashesh3 what is the status

[Ashesh3]

@Ashesh3 what is the status

No changes are required to this PR. The suggested stacked table looks odd, for now the original design of this PR can be tested and implemented.

[nihal467]

@Ashesh3 merge the latest development to this PR

[Ashesh3]

@Ashesh3 merge the latest development to this PR

Done

[nihal467]

@Ashesh3

the UI is breaking everywhere, can you check it in normal view

[Ashesh3]

Should be fixed now:

[sonarcloud]

Kudos, SonarCloud Quality Gate passed!   

0 Bugs
0 Vulnerabilities
0 Security Hotspots
0 Code Smells

No Coverage information
44.4% Duplication

[nihal467]

test approved