Files
OpenFrontIO/src
Erwan Huon 037796971a Fix text overflow in instructions for longer translations (#971)
## Description:

This pull request addresses a layout issue where text in instructions
(player icon) would overflow or be cut off, especially when translated
into languages with longer word structures (e.g., Dutch, German, French,
...)


![image](https://github.com/user-attachments/assets/8fe77f1c-91e1-44ad-91b4-2dbec720fee3)
_Before_ (web app view)



![image](https://github.com/user-attachments/assets/5c867453-4b3c-49e2-b45d-a3ec5af8c2ab)
_After_ (mobile layout)

### 🔧 Changes made:
Removed fixed height classes h-8 and md:h-10 from description
containers.

Allowed natural text wrapping and height growth by relying on min-h only
where needed.

Added text-center for better alignment and break-words to handle long
words gracefully.

### 🧪 Tested in:

Dutch 

German

French

English

Responsive layouts (mobile and desktop)

## Please complete the following:

- [x] I have added screenshots for all UI updates
- [x] I process any text displayed to the user through translateText()
and I've added it to the en.json file
- [x] I have added relevant tests to the test directory -> UI only
- [x] I confirm I have thoroughly tested these changes and take full
responsibility for any bugs introduced
- [x] I understand that submitting code with bugs that could have been
caught through manual testing blocks releases and new features for all
contributors

## Please put your Discord username so you can be contacted if a bug or
regression is found:

RTHOne
2025-06-03 16:40:51 +02:00
..
2025-06-02 23:40:01 +02:00
2025-05-23 22:26:01 -04:00
2025-05-30 09:10:00 -07:00