Commit Graph
15 Commits
Author SHA1 Message Date
Martin IandGitHub 070b5060d8 fix: swap team text and buttons position; fix gap space on leaderboard (#3135)
## Description:

1. Swaps the position of the teams text and leaderboard buttons;
2. Edits the text and button margins
3. Fixes spacing bug where because of a "gap-2", if only one leaderboard
is open, there's empty space on the left or right of the leaderboard.
4. Small code refactor proposed by code rabbit / icon description

Button swap and spacing changes were suggested by:
@FloPinguin  @ryanbarlow97  

## 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

***
Screenshots:
Before swapping the position and editing the spacing:
<img width="242" height="151" alt="image"
src="https://github.com/user-attachments/assets/cf196842-b469-45ab-a685-0a5e56b56378"
/>

After swapping the position and editing the spacing: ✔️
<img width="233" height="149" alt="image"
src="https://github.com/user-attachments/assets/c88da4ec-0f23-4670-af5d-fce4124d4936"
/>

Before swapping the position and editing the spacing without the text:
<img width="528" height="398" alt="image"
src="https://github.com/user-attachments/assets/e1e31352-31d1-42a4-ad92-a60b0014b779"
/>

After swapping the position and editing the spacing without the text: ✔️
<img width="514" height="350" alt="image"
src="https://github.com/user-attachments/assets/6a1f2391-e2f1-478e-bada-9436b7cb2e13"
/>

Before fixing the spacing on mobile:
<img width="579" height="158" alt="image"
src="https://github.com/user-attachments/assets/8d5e225b-6dbd-4a07-afeb-97035000a09d"
/>

After fixing the spacing on mobile: ✔️
<img width="575" height="134" alt="image"
src="https://github.com/user-attachments/assets/f9016060-ac9e-47fc-8886-e3eee6359906"
/>

Before fixing the leaderboard space issue:
<img width="511" height="398" alt="image"
src="https://github.com/user-attachments/assets/0fadddcd-2c5f-4caf-b641-c7a3e19a5a14"
/>

<img width="511" height="398" alt="image"
src="https://github.com/user-attachments/assets/2a9a9f7d-e08d-4908-b2d1-f26500c4c602"
/>

<img width="585" height="204" alt="image"
src="https://github.com/user-attachments/assets/9dbb4c51-56ae-4e7a-b603-f49cd1dc2286"
/>

After fixing the leaderboard space issue: ✔️
<img width="533" height="463" alt="image"
src="https://github.com/user-attachments/assets/c0608e83-974a-4950-94cd-896bc7dd7720"
/>

##Discord username: martoi

***
Signed-off-by: MartinIvovIv <https://github.com/martinIvovIv>
2026-02-06 19:39:35 -08:00
Martin IandGitHub 289e246162 fix: spacing between team leaderboard buttons (#3101)
## Description:

In team games, the UI buttons for the leaderboard and the team
leaderboard look out of place.
A bit of tailwind css fixes the look and a making the gap window
specific makes the accessibility better.

## 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

***
Screenshots:
Before change:
<img width="218" height="130" alt="image"
src="https://github.com/user-attachments/assets/e7366435-c3d3-44b9-af5f-05a1548bf743"
/>

After change:
<img width="393" height="277" alt="image"
src="https://github.com/user-attachments/assets/86dcb614-dd30-48f9-9048-fcb892a5dbae"
/>

Befre change with open leaderboard:
<img width="491" height="211" alt="image"
src="https://github.com/user-attachments/assets/4313fb89-8a61-4892-8c28-0c0d82bcc03b"
/>

After change with open leaderboard:
<img width="531" height="251" alt="image"
src="https://github.com/user-attachments/assets/9b4e2ed5-8427-4a7a-84dc-69169f53b031"
/>

Mobile before change:
<img width="535" height="180" alt="image"
src="https://github.com/user-attachments/assets/f6cc87be-1f7f-4bc7-bb1d-9afcce45ff6d"
/>

Mobile after change:
<img width="469" height="199" alt="image"
src="https://github.com/user-attachments/assets/ac4baa9d-4051-4938-a0a1-53d38efea7a8"
/>

Mobile before change with open leaderboard:
<img width="501" height="195" alt="image"
src="https://github.com/user-attachments/assets/a086cdd8-7898-4e13-a679-04b63be7a67b"
/>

Mobile after change with open leaderboard:
<img width="446" height="238" alt="image"
src="https://github.com/user-attachments/assets/8cc9c833-b8f9-43bb-9664-8cfb9f608cc4"
/>


Discord username: martoi

***
Signed-off-by: MartinIvovIv <https://github.com/martinIvovIv>
2026-02-06 09:42:41 -08:00
Martin IandGitHub 563ae3f90a fix; improvement proposal for the leaderboard buttons (#3107)
## Description:

Changes the leaderboard buttons to look more like other buttons per
suggestion by @FloPinguin

## 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

***
Screenshots:

Before change:
<img width="306" height="164" alt="image"
src="https://github.com/user-attachments/assets/3ff5648c-b088-4d3e-a608-901c2e8d0402"
/>

After change:
<img width="263" height="169" alt="image"
src="https://github.com/user-attachments/assets/983f7d50-0c40-4365-9f34-d64a18e69c68"
/>

After change hover:
<img width="315" height="221" alt="image"
src="https://github.com/user-attachments/assets/e56746ae-9e65-437a-b27c-60ac6ab52d6c"
/>

Mobile:
<img width="297" height="251" alt="image"
src="https://github.com/user-attachments/assets/66f6de72-5002-4da9-95d9-63f67b6136e3"
/>


##Discord username: martoi

***
Signed-off-by: MartinIvovIv <https://github.com/martinIvovIv>
2026-02-06 09:42:10 -08:00
e79c805804 refactor(ui): migrate tailwindcss v3 to v4 (#2735)
## Description:

migrate tailwindcss v3 to v4

## 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:

wraith4081

---------

Co-authored-by: iamlewis <lewismmmm@gmail.com>
Co-authored-by: Ryan <7389646+ryanbarlow97@users.noreply.github.com>
2026-01-06 14:21:52 -08:00
26f5d40819 build: migrate build system to Vite and test runner to Vitest & Remove depracated husky usage (#2703)
- Replace Webpack with Vite for faster client bundling and HMR.
- Migrate tests from Jest to Vitest and update configuration.
- Update Web Worker instantiation to standard ESM syntax.
- Implement Env utility in `src/core` for safe, hybrid environment
variable access (Vite vs Node).
- Refactor configuration loaders to remove direct `process.env`
dependencies in shared code.
- Update TypeScript environment definitions and project scripts for the
new toolchain.
- Remove the [depracated usage of the
husky](https://github.com/typicode/husky/releases/tag/v9.0.1).

## Description:

migrate build system to Vite and test runner to Vitest & Remove
depracated husky usage

## 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
- [ ] 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:

wraith4081

---------

Co-authored-by: evanpelle <evanpelle@gmail.com>
2025-12-28 22:10:26 -08:00
RoanandGitHub e104614a85 Consistent border radius and padding from edge of screen for in game UI (#2576)
## Description:

Moves all the in game ui to have a fixed padding around the edge of the
screen and also makes all the in game ui have the same border radius.


Before:

<img width="569" height="802" alt="image"
src="https://github.com/user-attachments/assets/2d51b66c-26bb-4835-abef-a646565280ba"
/>

<img width="2559" height="1238" alt="image"
src="https://github.com/user-attachments/assets/00723649-bfc7-4e92-bee9-6cff0c2d688c"
/>


After: 

<img width="2559" height="1240" alt="image"
src="https://github.com/user-attachments/assets/8dda98e3-8836-4363-8f33-5b699303ee4f"
/>

<img width="686" height="1122" alt="image"
src="https://github.com/user-attachments/assets/a3820d1c-0579-4b2b-b2a8-7eb790e3ec39"
/>




## 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:

`rovi.`
2025-12-09 19:37:52 -08:00
VariableVinceandGitHub ec0bf079ef Fix spacing in player team label display (#2560)
## Description:

Add a space after "Your team:"

Before:
<img width="237" height="117" alt="image"
src="https://github.com/user-attachments/assets/60c0821f-a188-44bc-bcd5-e810a741b297"
/>

After:
<img width="243" height="122" alt="image"
src="https://github.com/user-attachments/assets/99b3ff5a-167d-4bae-b8f6-b1b199d4946a"
/>

## 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:

tryout33
2025-12-03 16:37:17 -08:00
evanpelleandGitHub d89babea04 leaderboard bugfix: show by default for medium to large screens. (#1470)
## Description:

removes the unnecessary check in tick() which was causing the
leaderboard to not be shown by default on smaller screens.

## 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
- [x] I have read and accepted the CLA aggreement (only required once).

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

evan
2025-07-17 11:19:58 -07:00
evanpelleandGitHub 6bad34a2a3 fix team leaderboard margin (#1469)
## Description:

The team leaderboard had a large top margin. This PR aligns the team
leaderboard with the player leaderboard.

<img width="758" height="541" alt="Screenshot 2025-07-17 at 8 55 04 AM"
src="https://github.com/user-attachments/assets/9c9b6b67-e448-4419-8625-644e6e8584c7"
/>

## 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
- [x] I have read and accepted the CLA aggreement (only required once).

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

evan
2025-07-17 09:00:20 -07:00
evanpelleandGitHub da8aeedd8b Leaderboard improvements (#1424)
## Description:

1. Made leaderboard smaller
2. replaced show top 5/show all with a +/- to save space
3. show leaderboard by default on larger screens

<img width="458" height="393" alt="Screenshot 2025-07-13 at 5 27 10 PM"
src="https://github.com/user-attachments/assets/c18c732b-8b1e-4b71-89aa-b807ceb91e30"
/>

## 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
- [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:

evan
2025-07-13 17:48:04 -07:00
evanpelleandGitHub 2cbe34ed79 update ui (#1368)
## Description:

Center pop & gold information, and split up & remove the top bar.

Before:

<img width="1913" alt="Screenshot 2025-07-07 at 7 54 55 PM"
src="https://github.com/user-attachments/assets/8ab59102-1f0e-4023-905f-e0b1b2fa73a2"
/>


After:

<img width="1916" alt="Screenshot 2025-07-07 at 7 53 02 PM"
src="https://github.com/user-attachments/assets/06c885e3-a179-4447-9d1d-0da3849e726d"
/>


reference:

![image](https://github.com/user-attachments/assets/8c985a1a-e232-45ce-9af7-c1981df7fb15)

## 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
- [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:

evan
2025-07-07 20:06:14 -07:00
4e48eba910 Better In Game UI (#1243)
## Description:
Top Bar Refactor – UI & UX Improvement Proposal

This update overhauls the top game bar to improve clarity,
responsiveness, and overall user experience across desktop and mobile.
It consolidates player resources (e.g., building counts), integrates
game controls (pause, settings, time), and enhances visual contrast.

Key changes:

Redesigned top bar with player data and game options.

Team color indicator bar (team games only).

Countdown bar during "Choose Starting Position" phase.

Removed redundant info (e.g., troop/worker counts shown elsewhere).

Inspired by strategy games like Travian Legends, this refactor offers a
cleaner and more intuitive layout, especially for smaller screens.

⚠️ Note: This is a large change and likely contains visual or functional
bugs I can’t currently spot due to fatigue. Thorough testing is required
before approval.

## 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
- [ ] 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
- [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:

Diessel
![Snímek obrazovky 2025-06-21 v 8 13 46](https://github.c
![Snímek obrazovky 2025-06-21 v 8 13
35](https://github.com/user-attachments/assets/e166ee1b-6173-48f5-8e2d-598d796a7e2d)
om/user-attachments/assets/3a0edbef-e621-4fc4-b6b7-c1ed
![Snímek obrazovky 2025-06-21 v 8 13
20](https://github.com/user-attachments/assets/1214ab61-323c-4317-8722-eaa4b932a60c)
8f9a8219)
![Snímek obrazovky 2025-06-21 v 8 10
04](https://github.com/user-attachments/assets/374fe15a-bfad-4469-9950-3ec631b6e2d3)

Closes #1165

---------

Co-authored-by: Scott Anderson <scottanderson@users.noreply.github.com>
Co-authored-by: evanpelle <evanpelle@gmail.com>
2025-06-30 19:49:42 -07:00
TomaszGitHubcoderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>evanpelle
91adf1fa8b Add localization support for leaderboard and team-related UI elements (#1308)
## Description:

As in the title

## Please complete the following:

- [x] I process any text displayed to the user through translateText()
and I've added it to the en.json file
- [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:

pierogi69

---------

Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
Co-authored-by: evanpelle <evanpelle@gmail.com>
2025-06-30 19:06:50 -07:00
b7ee1caa52 * update leaderboard align (#1189)
## Description:
This fix issue of leaderboard overlaping other elements. 
Also give option to dispaly ads below leaderboard since on desktop they
are next to each other

## Please complete the following:

- [ ] 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
- [ ] 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
- [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:

Diessel

![image](https://github.com/user-attachments/assets/28d1a952-b9b1-4990-9a2a-59d221f5c007)

![image](https://github.com/user-attachmen
![Snímek obrazovky 2025-06-17 v 18 28
12](https://github.com/user-attachments/assets/f00bd060-361a-4c2f-98dd-1849f7d705ff)
ts/assets/5886ceb2-2d15-4b0e-9c30-8c61b0255f48)
![Snímek obrazovky 2025-06-17 v 18 28
36](https://github.com/user-attachments/assets/a60943ef-7865-43fa-a400-a7bd381b6ea3)
![Snímek obrazovky 2025-06-17 v 18 28
19](https://github.com/user-attachments/assets/7a328e7a-5a97-4b71-bb7a-40adac2d45c3)

---------

Co-authored-by: evanpelle <evanpelle@gmail.com>
2025-06-17 13:32:27 -07:00
DiesselOneandGitHub 38b87b7217 Rework leaderboard and team stats (#1164)
## Description:
This PR update the leaderboard and team stats component to be more
responsive on mobile and desktop.
Include new component gameLeftISidebar that manages showing/hiding
elements.
Add icons as components for easy use

## 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
- [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:

Diessel

Closes #1163 

Images:
![Snímek obrazovky 2025-06-13 v 18 45
44](https://github.com/user-attachments/assets/8c80fbfc-ae7d-449d-88a6-5072ede8d0e4)
![Snímek obrazovky 2025-06-13 v 18 45
39](https://github.com/user-attachments/assets/e386e368-3cf5-4cf5-b85b-8380a5785d62)
![Snímek obrazovky 2025-06-13 v 18 45
32](https://github.com/user-attachments/assets/efc39a92-bcd8-4f3c-a281-6570a92e4633)
![Snímek obrazovky 2025-06-13 v 18 45
27](https://github.com/user-attachments/assets/6bcb8462-ee11-4de5-af4c-1763f95fa56a)
2025-06-13 18:32:50 +00:00