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

chore: dropdown component #6241

Draft
wants to merge 1 commit into
base: main
Choose a base branch
from

Conversation

deboer-tim
Copy link
Collaborator

@deboer-tim deboer-tim commented Mar 2, 2024

What does this PR do?

Creates a new Dropdown component that is just a styled select control, so that we don't have this styling/slight variations in several places, and one less thing to fix for light-mode. Styling uses the same variable naming pattern as an Input.

I used the new component in three places to start so that there's something to test: deploying a pod to Kube, creating a pod from containers, and enum items in preferences. There are 11 other instances of <select> that will need to be switched in future PRs.

Screenshot / video of UI

Screen.Recording.2024-03-20.at.8.33.17.AM.mov

What issues does this PR fix or reference?

First step of #6199.

How to test this PR?

Unit test included; go to the places listed in the UI to test styling/behaviour.

@deboer-tim deboer-tim requested review from benoitf and a team as code owners March 2, 2024 13:04
@deboer-tim deboer-tim requested review from jeffmaury and cdrage and removed request for a team March 2, 2024 13:04
packages/renderer/src/lib/ui/Select.svelte Outdated Show resolved Hide resolved
packages/renderer/src/lib/ui/Select.svelte Outdated Show resolved Hide resolved
@benoitf benoitf marked this pull request as draft March 12, 2024 17:46
Creates a new Dropdown component that is just a styled select control,
so that we don't have slight variations and styling in several places,
and one less thing to fix for light-mode. Styling uses the same color
pattern as an Input for consistency.

I used the new component in three places to start so that there's
something to test: deploying a pod to Kube, creating a pod from
containers, and enum items in preferences. There are 11 other instances
of <select> that will need to be switched in future PRs.

Signed-off-by: Tim deBoer <[email protected]>
@deboer-tim deboer-tim changed the title chore: select component chore: dropdown component Mar 20, 2024
@deboer-tim
Copy link
Collaborator Author

Rebased, renamed to Dropdown, updated to current Input styling, updated PR description, and added proposed dropdown color variables for UX review.

@ekidneyrh
Copy link
Contributor

I'm using Fedora Linux and the dropdown options are the same colour as the bg making it illegible.
Screencast from 2024-03-21 12-10-16.webm

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.

None yet

3 participants