Theme system overhaul#4212
Merged
Merged
Conversation
Listed currently in-use colors and related use cases based on night mode overrides and easy to find elements TODO: - Persistence of current theme - Color editor - Use case previews - Taking the new theme css to use - Using use case colors for things - Theme selector - Themes & theme storage - Check that all elements are there - Night mode support for theme editor - Translation support for theme editor
- Take most colors into use in css - Add some missing colors - Translations - Color CRUD functionalities - Use case examples - Reimplement color translation functions to use class based system - Fixes to color translation functions
- Use theme system to generate theme css for the page - Fixed some color conversion function issues - Translation fixes for improved react-i18n usage - Performance graph range selector sync between graphs - Modal and Tab colors fixed - Modal overlay fixed on night mode - Theme text fixed on night mode - Text color fixes - Kills table searchability - Graph colors now use same css variables on both light and night mode
- Fixed theme switching for main theme even when in editor
# Conflicts: # Plan/common/src/main/resources/assets/plan/locale/locale_ZH_TW.yml # Plan/react/dashboard/package.json # Plan/react/dashboard/yarn.lock
VRXDev2
pushed a commit
to VRXDev2/Plan
that referenced
this pull request
Jan 5, 2026
Adds a new theme system to the website Unrelated features implemented on this branch: - Session hijack vulnerability patched by linking cookies to IP addresses and using SecureRandom in cookie generation. - Kills tables now contain more values and can be searched or sorted - Translated all timestamps and time amounts based on selected locale - Translated Country names - Translated all Calendar content - Translated Query page content - Replaced all MultiSelect components with react-select which provides a more intuitive selection of multiple items - Performance graph tabs now sync their range selector so that you can switch between them easier - Network performance graph colors now vary between servers Affects issues: - Close plan-player-analytics#4114 - Partially plan-player-analytics#3346
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
This PR introduces a /theme-editor page to the website, complete with CRUD functionalities, css color definitions, as well as variable generation so that those colors can be selected for each element on the Plan website.
With this theme.yml files are removed and only World Pie colors remain in config.yml since they could not yet be reliably implemented in the current theme system due to limitations of the MultiSelect component. In the future there will be a Manage page for managing world settings that will include colors in order to replace the world pie color settings in config.yml files.
The goal for this system is to allow further customization of the website without needing to maintain Html customization, as well as sharing themes if wanting to do so.
There are two storage mechanisms to support both HTTP/export and HTTPS
Unrelated features implemented on this branch:
TODO items before merge:
TODO items after merge:
Affects issues: