Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[experiment] Allow users to use system's appearance (dark / light) mode #3703

Open
wants to merge 7 commits into
base: main
Choose a base branch
from

Conversation

MitjaBezensek
Copy link
Contributor

@MitjaBezensek MitjaBezensek commented May 6, 2024

Allow the users to fully use the same colour scheme as their system. Allows the users to either: force dark colour scheme, force light colour scheme, or use the system one.

It's reactive to the system changes.

CleanShot.2024-05-06.at.17.28.27.mp4

Change Type

  • sdk — Changes the tldraw SDK
  • dotcom — Changes the tldraw.com web app
  • docs — Changes to the documentation, examples, or templates.
  • vs code — Changes to the vscode plugin
  • internal — Does not affect user-facing stuff
  • bugfix — Bug fix
  • feature — New feature
  • improvement — Improving existing features
  • chore — Updating dependencies, other boring stuff
  • galaxy brain — Architectural changes
  • tests — Changes to any test code
  • tools — Changes to infrastructure, CI, internal scripts, debugging tools, etc.
  • dunno — I don't know

Test Plan

  1. Add a step-by-step description of how to test your PR here.
  • Unit Tests
  • End to end tests

Release Notes

  • Add a brief release note for your PR here.

Copy link

vercel bot commented May 6, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Updated (UTC)
examples ✅ Ready (Inspect) Visit Preview Jun 10, 2024 11:39am
1 Ignored Deployment
Name Status Preview Updated (UTC)
tldraw-docs ⬜️ Ignored (Inspect) Visit Preview Jun 10, 2024 11:39am

@mimecuvalo
Copy link
Member

this is sick 🎸

@steveruizok steveruizok requested a review from ds300 June 3, 2024 08:43
@steveruizok
Copy link
Collaborator

steveruizok commented Jun 3, 2024

From a UX perspective I'm in agreement, great feature! Adding @ds300 as a reviewer here just to be sure that the user preferences stuff is compatible.

Copy link
Collaborator

@ds300 ds300 left a comment

Choose a reason for hiding this comment

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

great improvement! i think the inferDarkMode behaviour was a little broken by this but should be easy enough to fix. happy to merge after 🙇🏼

packages/editor/src/lib/config/TLUserPreferences.ts Outdated Show resolved Hide resolved
Comment on lines +51 to +54
case 'system':
return this.systemColorScheme.get() === 'dark'
default:
return this.inferDarkMode ? this.systemColorScheme.get() === 'dark' : false
Copy link
Collaborator

Choose a reason for hiding this comment

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

as mentioned elsewhere, inferDarkMode will only be respected when colorScheme is undefined, but at the moment that can't happen without the sdk user explicitly setting it to undefined because our default user preferences sets it to 'light'

@MitjaBezensek MitjaBezensek requested a review from ds300 June 10, 2024 11:44
@MitjaBezensek
Copy link
Contributor Author

great improvement! i think the inferDarkMode behaviour was a little broken by this but should be easy enough to fix. happy to merge after 🙇🏼

Yeah, nice catch. Updated with your recommendation and brought it up to date.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
improvement Improves existing features sdk Affects the tldraw sdk
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

4 participants