Skip to content

CSS Conflict warning when using placeholder variant in React Native + Tailwind CSS via Nativewind #1407

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

Open
WillyReyno opened this issue Jun 9, 2025 · 1 comment
Assignees
Labels
enhancement New feature or request

Comments

@WillyReyno
Copy link

What version of VS Code are you using? v1.100.3
What version of Tailwind CSS IntelliSense are you using? v0.14.21
What version of Tailwind CSS are you using? v3.4.17 & Nativewind 4.1.23
What package manager are you using? npm
What operating system are you using? macOS
Tailwind config

Reproduction

import { TextInput } from "react-native";

<TextInput className="placeholder:text-red-500 text-white" />

Describe your issue

When setting text color and a placeholder's color, the following cssConflict appears as a warning whereas both classes are not styling the same element of the input

Image

@thecrypticace
Copy link
Contributor

This isn't really a false positive given the generated CSS. There's no pseudo-class or pseudo-element like there normally would be so IntelliSense doesn't "know" that things will be processed differently later because of the presence of the @rn-move at-rule inside.

Normal CSS doesn't work this way and we generally assume that. I'll leave this open though to think about how we want to solve this (if at all).

@thecrypticace thecrypticace self-assigned this Jun 9, 2025
@thecrypticace thecrypticace added the enhancement New feature or request label Jun 9, 2025
@thecrypticace thecrypticace changed the title cssConflict warning when using placeholder:text & text on input CSS Conflict warning when using placeholder in React Native + Tailwind CSS via Nativewind Jun 9, 2025
@thecrypticace thecrypticace changed the title CSS Conflict warning when using placeholder in React Native + Tailwind CSS via Nativewind CSS Conflict warning when using placeholder variant in React Native + Tailwind CSS via Nativewind Jun 9, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

2 participants