Fix the new mobile styles a bit 🖌️ (#3106)

## Description:

### 1. PlayerInfoOverlay had less margin top than the leaderboard and
the game controls. Fixed.

### 2. PlayerInfoOverlay  did overlap with HeadsUpMessage. Fixed.

Previous:

<img width="543" height="174" alt="Screenshot 2026-02-03 184835"
src="https://github.com/user-attachments/assets/8687294b-feb6-409d-995a-971986a9d406"
/>

Now:

<img width="510" height="299" alt="Screenshot 2026-02-03 185117"
src="https://github.com/user-attachments/assets/8b81f5ed-98ea-4154-b485-9de4ed974939"
/>

### 3. Fixed border radius of the lower panels

Previous:

<img width="1200" height="162" alt="Screenshot 2026-02-03 184938"
src="https://github.com/user-attachments/assets/72dc77c4-8992-4812-8b5d-e100e16fe91e"
/>

<img width="1081" height="122" alt="Screenshot 2026-02-03 185014"
src="https://github.com/user-attachments/assets/0291e305-faed-41d2-b5a9-db795b61a8d2"
/>

Now:

<img width="1237" height="151" alt="Screenshot 2026-02-03 184953"
src="https://github.com/user-attachments/assets/40565ab4-cdad-4ea6-81e5-f24d485c7199"
/>

<img width="1054" height="99" alt="Screenshot 2026-02-03 185004"
src="https://github.com/user-attachments/assets/ce091c16-74ac-4a05-8843-8493e08ba6c3"
/>

### 4. Give PlayerInfoOverlay the same gap between gold icon and gold
text as in ControlPanel

Previous:

<img width="772" height="759" alt="Screenshot 2026-02-03 191150"
src="https://github.com/user-attachments/assets/49b14025-9d28-447d-9370-64ad30532abd"
/>

Now:

<img width="803" height="748" alt="Screenshot 2026-02-03 191203"
src="https://github.com/user-attachments/assets/b4749557-bf10-4643-83b1-5e9d22f122ed"
/>

## 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
- [X] I confirm I have thoroughly tested these changes and take full
responsibility for any bugs introduced

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

FloPinguin
This commit is contained in:
FloPinguin
2026-02-03 15:16:17 -08:00
committed by GitHub
parent c9d8ed767c
commit 596bc90134
4 changed files with 8 additions and 6 deletions
+1 -1
View File
@@ -261,7 +261,7 @@ export class ControlPanel extends LitElement implements Layer {
return html`
<div
class="pointer-events-auto ${this._isVisible
? "relative z-[60] w-full max-lg:landscape:fixed max-lg:landscape:bottom-0 max-lg:landscape:left-0 max-lg:landscape:w-1/2 max-lg:landscape:z-50 lg:max-w-[400px] text-sm lg:text-base bg-gray-800/70 p-1.5 pr-2 lg:p-5 shadow-lg lg:rounded-xl backdrop-blur-sm"
? "relative z-[60] w-full max-lg:landscape:fixed max-lg:landscape:bottom-0 max-lg:landscape:left-0 max-lg:landscape:w-1/2 max-lg:landscape:z-50 lg:max-w-[400px] text-sm lg:text-base bg-gray-800/70 p-1.5 pr-2 lg:p-5 shadow-lg lg:rounded-tr-xl min-[1200px]:rounded-xl backdrop-blur-sm"
: "hidden"}"
@contextmenu=${(e: MouseEvent) => e.preventDefault()}
>