gray-mueller / gray-mueller/food-delivery-clone-app-using-react-native

Enatega Customer iOS + Admin Dashboard : Cuisine names are overflowing beyond the image square's boundary, breaking the UI.

Open
#141 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
0
Forks
0
PR merge metrics
No merged PRs in 30d

Description

Describe the bug
Cuisine names are overflowing beyond the image square's boundary, breaking the UI. Also restrict the user to enter cuisine names with some words limits so it should not breaks the boundary.

To Reproduce
Steps to reproduce the behavior:

Go to Enatega Customer application
Click on 'Restaurants' menu button.
Now see at the Top of screen restaurants see error Browse categories scroll-bar where Cuisine names are overflowing beyond the image square's boundary, breaking the UI.
Expected behavior

The cuisine names should stay within the image square and not overflow.
If the text is too long, it should either wrap properly or be truncated with "...".
The design should remain responsive for different screen sizes.

Screenshots

Image

Smartphone (please complete the following information):

Device: [e.g. iPhone13]
OS: [e.g. iOS18]
Browser [e.g. Application]
Version [e.g. latest]

Contributor guide

Open the contributing guide

Research direction

Start in the Customer application at Restaurants and the Browse categories area, then trace the component rendering cuisine names and the admin dashboard field that accepts them. Check the layout on different screen sizes and test long cuisine names; done means names stay within their image boundaries by wrapping or truncating, and input limits prevent new overflow.

Written by the indexing model from the issue text.

Assessment

Tech stack
react-native, typescript
Domain
frontend, mobile-dev
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
52/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.