Overflow of some fields such as district in the user management page

[alanansari]

Describe the bug
Fields like Role and District in the user management page are fixed in width, so if a word of length greater than that width comes there it overflows over other elements or goes out of boundary.

To Reproduce
Steps to reproduce the behavior:

1. Go to https://care.ohc.network/
2. Click on 'Users' tab in the left sidebar
3. Scroll down to the cards
4. See error

Expected behavior
The fields if overflowed should wrap the elements in the next line to align themselves or the text itself can be shortened instead of showing the full names. Eg: Thiruvananthapuram can be Thiruvanan.. and hovering over shows a tooltip with full text.

Screenshots

Desktop:

• OS: Windows 11
• Browser Chrome
• Version 122.0.6261.57 (Official Build) (64-bit)

I would like to work on this issue as well.

[kshitijv256]

I would like to work on it

[rithviknishad]

@kshitijv256 feel free to take this up once the changes requested 3 weeks ago for #7111 has been addressed

[alanansari]

I would like to work on this issue.