-
Notifications
You must be signed in to change notification settings - Fork 117
DT-2854-5-dark-mode-menu #2754
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
DT-2854-5-dark-mode-menu #2754
Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
| {#if open} | ||
| <div class="flex h-full flex-col justify-start gap-6 overflow-auto px-4 py-8"> | ||
| <TimezoneSelect position="left" /> | ||
| <TimezoneSelect position="left" size="sm" /> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Annotation: requested by @bilal-karim to match other menu item sizes
| }); | ||
|
|
||
| test('user can toggle dark mode between on, off, and system default', async ({ | ||
| test('user can select System Default option via dropdown menu', async ({ |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Annotation: Thanks AI for updating the tests for.
Description & motivation 💭
This PR updates the dark mode 3-state toggle button, to be a dropdown menu. This is based on feedback from @rossnelson during team testing, and ok'ed by @bilal-karim from design. This is intended to simplify and clarify the interaction for the user, and be more like other websites with dark mode options.
Screenshots (if applicable) 📸
Design Considerations 🎨
I got the UX go-ahead from @bilal-karim to convert 3-state dark mode toggle to a dropdown menu. Bilal also requested the size change in the bottom nav usage of it.
@bilal-karim dropdown alignment seems slightly off in the bottom nav menu, this is existing. Probably easy to fix but that can be another task.
Testing 🧪
Tested manually locally.
Updated integration tests for both.
Will test in cloud-ui before release.
How was this tested 👻
Steps for others to test: 🚶🏽♂️🚶🏽♀️
Checklists
Draft Checklist
Merge Checklist
Issue(s) closed
Docs
Any docs updates needed?