## Description:
Add a new pixi layer for rendering structure icons
Add new sprites for structures

## 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:
Vivacious Box
---------
Co-authored-by: evanpelle <evanpelle@gmail.com>
## Description:
This PR separates only the rendering logic.
The settings and other related parts will be handled when updating the
UI.
The remaining work will be split into two separate PRs.
Once this is done, I’ll move on to the next one.
## 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
## Description:
New images in Instructions where needed for:
- event panel: wasn't mentioned yet
- infopanel changed: quick chat, donate gold, stop/start trading etc
- player icons: traitor, embargo, requesting alliance
- radial menu: now differs between enemy/ally
- leaderboard: was changed
- options: time display was changed, cookie preferences button is now
visible so kept that in the new image
Some justifcations of part of the textual changes:
- Trade: info was already behind and now updated to include changes from
PR https://github.com/openfrontio/OpenFrontIO/pull/707
- Retreats: weren't yet mentioned. Added this to new info about Event
panel. Including https://github.com/openfrontio/OpenFrontIO/pull/699,
and not-yet-but-soon merged PR
https://github.com/openfrontio/OpenFrontIO/pull/740 and
https://github.com/openfrontio/OpenFrontIO/pull/705
- Radial Menu: close button has been replaced, explain that
right-clicking closes it now.
- Traitor: being a traitor and its consequences, like the changed
defense debuff and effects on trade.
- SAM: launcher hit chanches % changed.
- Port: Battleships > Warships and other changes.
- Warship: made more clear that only enemy trade ships/warships/boats
are captured/destroyed. Made 'attack-click' more clear.
- Boat: the word Boat was used, not Transport ship. While on server and
in code it is called a Transport (ship) too. Tried to clear this up.
Since it is now explained n Instructions, it doesn't have to be
clarified per se elsewhere. Like in Build menu for Warship it says
"Captures trade ships, destroys ships and boats" which can stay this way
as it is now assumed knowledge that boat = transport.
- More uniform capitalisation for 'Openfront' terms: capitalization was
used differently across terms like Info panel and build menu, Alternate
view and Alternate View. Other instances are more ambiguous like "Small
explosive bomb that destroys territory, buildings, ships and boats"
which i kept as is.
- Embargo: the word 'embargo' was deliberately removed earlier, because
it wasn't always understood by target audience
(https://github.com/openfrontio/OpenFrontIO/pull/147). But some remnants
were left. Using 'stop trading' in all but one spot now: it's used as
one-word explanation for the Dollar stop sign player icon, just like
other icons also have short 'Ally' 'Traitor' etc. So the players who do
use the word embargo still have one reference left.
- Build menu: left Warship description as is (see 'Boat:' above).
Updated Port description from "Sends trade ships to allies to generate
gold" to "Sends trade ships to generate gold". Trade is not only with
allies anymore. And there's more details that are in Instructions like
the effects stop/start trading, that don't have to be in the Build menu.
This lessens the chances of having to change the Port description in
Build menu again.
- Player info: changed "Embargo against you" to "Stopped trade with you"
(see 'Embargo:' above).
Keys that need to be (re)translated in MLS:
- NEW keys: info_chat, info_trade, ally_donate_gold, build_menu_desc,
icon_embargo, icon_request, ui_playeroverlay, ui_playeroverlay_desc,
ui_events, ui_events_desc, ui_events_alliance, ui_events_attack,
ui_events_quickchat
- UPDATED keys: info_enemy_desc, ally_betray, build_port_desc,
build_warship_desc, build_sam_desc, icon_crown, icon_traitor,
radial_boat, radial_build, build_menu.desc.port, embargo,
option_settings, build_defense_desc, radial_desc, ui_leaderboard_desc
Font looks weird in screenshots because of zoom 40% in browser to
capture it all:






## Please complete the following:
- [x] I have added screenshots for all UI updates
- [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:
tryout33
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
## Summary by CodeRabbit
- **New Features**
- Added new UI elements and icons for alliance requests, embargo status,
and gold donation in the help modal and player info panels.
- Introduced detailed sections in the help modal for events, player
overlays, and expanded build menu explanations.
- **Improvements**
- Enhanced and clarified descriptions for leaderboard, event panels,
player overlays, ally betrayal, and build menu items.
- Improved visual grouping, layout, and styling consistency in the help
modal and across UI icons.
- **Style**
- Updated and unified image and icon styles for consistent appearance in
the help modal.
- Added new CSS classes for modal images and icons; removed fixed-size
radial menu image style.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Description:
Fixes#480
## Please complete the following:
- [ ] I have added screenshots for all UI updates
- [ ] I confirm I have thoroughly tested these changes and take full
responsibility for any bugs introduced
- [ ] 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:
<DISCORD USERNAME>
## Description:
Changes private lobby code input font to be monospace. Parity with lobby
creation screen (#438).
**Before:**

**After:**

## Please complete the following:
- [X] I have added screenshots for all UI updates
- [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:
imdarktom
## Description:
This PR adds a **User Settings** modal accessible from the main UI.
Currently available settings include:
- Toggle for Dark Mode
- Writing Speed Multiplier (slider)
- Bug Count (number input)
- Troop and Worker Ratio (slider)
- Left Click to Open Menu
- Emoji toggle
Settings are saved via `localStorage` and persist across sessions.
There's also a hidden Easter Egg...
https://discord.com/channels/1284581928254701718/1286741605310533653/1355900228712009908
<img width="787" alt="スクリーンショット 2025-03-31 8 40 08"
src="https://github.com/user-attachments/assets/a9943834-cf40-4fa6-b828-06a8476172da"
/>
Fixes#482
## Please complete the following:
- [x] I have added screenshots for all UI updates
- [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:
<DISCORD USERNAME>
aotumuri
## Description:
Enhanced the visual clarity of key inputs using custom CSS.
Keyboard keys now appear more distinct and intuitive, making the help
modal easier to understand at a glance.
Keys can be changed easily.
Fixes#477
## Please complete the following:
- [x] I have added screenshots for all UI updates
- [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:
<DISCORD USERNAME>
aotumuri(.w. / (๑-̀ㅂ-́)و✧)
## Description:
Use mono font for code generated for private lobbies, making it easier
to distinguish some letters (lowercase L's vs. capital I's).
Fixes#391.
Fixes#462
Before:

After:

## Please complete the following:
- [X] I have added screenshots for all UI updates
- [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:
imdarktom
## Description:
The SAM launcher icon is missing again, fixed.
## Please complete the following:
- [x] I have added screenshots for all UI updates
- [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:
aotumuri
## Please complete the following:
- [x] I have added screenshots for all UI updates
- [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
Changed the icon for the troop donation button, as it looked like it was
donating gold.
I replaced it with a soldier icon to better reflect its function.
Additionally, I updated the icon below it to clearly represent gold
donation instead.
## Please put your Discord username so you can be contacted if a bug or
regression is found:
aotumuri
The cat is because of an extension I have put in. Please ignore it.
<img width="345" alt="スクリーンショット 2025-03-30 10 13 06"
src="https://github.com/user-attachments/assets/9088be1a-57b4-4d10-9507-ca8dc0fcc68c"
/>
<img width="396" alt="スクリーンショット 2025-03-30 10 18 10"
src="https://github.com/user-attachments/assets/2555fd24-0bbc-4b40-8f80-ccf43a1e9a75"
/>
---------
Co-authored-by: Evan <evanpelle@gmail.com>
## Please complete the following:
- [x] I have added screenshots for all UI updates
- [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/e5106fbb-59b2-4d86-8ed8-c899adfa20b1)
## Please complete the following:
- [x] I have added screenshots for all UI updates
- [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


Create css strucure, clean up the index html and use proper tags.
Visualy minor changes, but this allow us maint better visuals and start
the css standards that will help us future
Create base components with shared styles, as start of make ui better.
For now shoul look same but underhood new copoments are used.
This should be first PR that handle this and many more comes. I am in
rush due conflict with other ppl, but should work as i tested.
Testing again and look at structure
Main goal i have global css not scope in component die loading times and
size of elements. (Modal due nature of lit and shadow dom is exception,
maybe later find better way).
Documenting the components will happen later as base components
establish their usage.