Skip to content
This repository has been archived by the owner on Mar 1, 2024. It is now read-only.

Customize styles through UI API #133

Merged
merged 6 commits into from
Mar 2, 2023
Merged

Conversation

hmuurine
Copy link
Collaborator

@hmuurine hmuurine commented Mar 1, 2023

Summary

Added code that allows the users to customize styles via the UI API.

  • No longer applying styles automatically in constructor. Need to call applyStyles()
  • Developers can give custom overriding CSS styles as optional parameters in new PixelStreamingApplicationStyle() constructor
  • Moved light/dark mode palette applying code from Application to PixelStreamingApplicationStyle to keep all the style related code in a single place and separate from Application
  • Application now exposes an optional onUpdateColors callback that is called when light/dark mode is toggled. The style class hooks into this to apply styles on mode change
  • Developers can give light/dark mode palette as an optional parameter in new PixelStreamingApplicationStyle() constructor to override the default colors

Test plan

  • Ran the frontend without any style overrides, and verified that the default styles were applied
    Screenshot 2023-03-01 at 17 12 42
  • Toggled between light/dark mode and verified that the styles were applied
    Screenshot 2023-03-01 at 17 12 51
  • Modified player.ts to apply custom styles and verified that the styles were applied
    Screenshot 2023-03-01 at 17 17 02
    Screenshot 2023-03-01 at 17 17 32
  • Modified player.ts to set a custom light/dark mode palette and verified that the styles were applied on toggling color mode
    Screenshot 2023-03-01 at 17 20 57
    Screenshot 2023-03-01 at 17 20 19
    Screenshot 2023-03-01 at 17 20 28

@lukehb
Copy link
Contributor

lukehb commented Mar 1, 2023

CC @Belchy06 for vis

Copy link
Contributor

@lukehb lukehb left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

lgtm!

@lukehb lukehb merged commit 73bc553 into EpicGames:master Mar 2, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants