Skip to content

Custom select box hover style issues #130038

@lezgomatt

Description

@lezgomatt

Does this issue occur when all extensions are disabled?: Yes

  • VS Code Version: 1.58.2, also tested main (ca273fc); Pretty sure it affects earlier versions as well
  • OS Version: Linux x64; Windows should be affected as well (not macOS because it uses the native select box)

Steps to Reproduce:

  1. Use a theme (or set custom colors) where focus and hover styles don't match. Example (used in the video below):
    "workbench.colorCustomizations": {
        "quickInputList.focusBackground": "#ff0000", // red
        "quickInputList.focusForeground": "#00ff00", // green
        "list.hoverBackground": "#0000ff", // blue
        "list.hoverForeground": "#ffff00", // yellow
        "dropdown.background": "#ff00ff", // magenta
        "dropdown.listBackground": "#00ffff" // cyan
    }
  1. Hover over the select items of a select box (try the one in the output panel)
    • notice how the hover FG is applied with the focus BG (should be either both hover, or both focus)
    • notice how disabled options applies a style (no visible extra styling should be applied on hover)

Video:

Peek.2021-08-03.21-10.mp4

Metadata

Metadata

Labels

insiders-releasedPatch has been released in VS Code Insiders

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions