Skip to content

Dark/light mode - #248

Open
UgurEkim wants to merge 7 commits into
dualshock-tools:mainfrom
UgurEkim:main
Open

Dark/light mode#248
UgurEkim wants to merge 7 commits into
dualshock-tools:mainfrom
UgurEkim:main

Conversation

@UgurEkim

@UgurEkim UgurEkim commented Aug 1, 2026

Copy link
Copy Markdown

Hi,

Implemented a dark/light toggle switch for changing theme's. Dark is more easier on the eyes on a big screen :). Besides that i've converted default css files to sass and also added the gulp-sass plugin in order to build the css files. This was needed for the dark/light mode.

Light Mode
image

Dark Mode
image

@UgurEkim UgurEkim changed the title Update to v2.27 from main Dark/light mode Aug 3, 2026
…dark/light mode in core.js

Changed strolestyle color for drawing crosshair back to original in stick-renderer.js.

clearing canvas now resets it to the correct theme colors in calib-range-modal.js.
@carpikes

carpikes commented Aug 3, 2026

Copy link
Copy Markdown
Contributor

Hi, thank you for the PR, I will have a look at it asap!

@UgurEkim

UgurEkim commented Aug 4, 2026

Copy link
Copy Markdown
Author

Don't merge it yet, i still have a few optimizations and features. Right now there is nothing used regarding the sass (scss) files. The idea is that if you want to create your own theme you just create a new scss file with your theme colors and wrap them in this code block:

@include color-mode([insert_your_color_name]) {
// css color variables and others..
}

and with minimal changes to the code. Besides that i want to create scss for the controller part so people can customize them selfs with their own color choices. What we/i can introduce is creating a css class for every controller type. For example: you connect volcanic red controller so the controller svg shown is also volcanic red.

@UgurEkim

UgurEkim commented Aug 9, 2026

Copy link
Copy Markdown
Author

You can review it fully now. I wanted to try and change colors of the controller. It did work but only for the buttons (all the infills) but not the body. For this i have to implement new svg's but thats tomuch work for now.

This PR contains code for switching between light and dark mode only.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants