Support for light-dark() colors

[smhmd]

What version of VS Code are you using?

Version: 1.87.2

What version of Tailwind CSS IntelliSense are you using?

v0.11.60 (pre-release)

What version of Tailwind CSS are you using?

4.0.0-alpha.10

What package manager are you using?

pnpm

What operating system are you using?

macOS

Tailwind config

@import 'tailwindcss';

:root {
  color-scheme: light dark;
}

@theme {
  --color-*: initial;
  
  --text-color-brand-primary: light-dark(white, black);
  --text-color-brand-secondary: blue;
}

VS Code settings

n/a

Reproduction URL

Please, insist if needed and I'll create one 🙏🏼 , otherwise, I think the description is self explanatory

Describe your issue

When using light-dark() CSS function (MDN), the intellisense loses its color. I think adding both colors makes some sense.

[thecrypticace]

VSCode only supports a single color swatch on completions so showing both is not possible. We might be able to show both in the editor but not 100% sure (also not sure if we'd want to). Going to think on this some.

[thecrypticace]

We've decided to only show one swatch for consistency purposes with completions as they only support a single color swatch. So, right now, we always pick the light color swatch to at least show something.

This'll go out in the next patch of the extension but that may or may not be until next week. (depends on how many fixes I get in before Friday)