guilhermerodz / input-otp

One time passcode Input. Accessible & unstyled.
https://input-otp.rodz.dev
MIT License
2.35k stars 47 forks source link

[BUG] global ::selection breaks transparent color #39

Closed andrewdoro closed 4 months ago

andrewdoro commented 4 months ago

having selection selector in the global.css changes the input color

::selection {
    @apply bg-highlight text-foreground;
  }

Expected Behavior

Color is transparent

Current Behavior

Input text color takes the value defined in selection

Screenshot 2024-03-24 at 15 43 16

Possible Solution

Make color transparent for a selection selector Not sure if this should be done at the library level or in shadcn-ui?

.selection\:text-transparent *::selection {
  color: transparent;
}

https://github.com/shadcn-ui/ui/issues/3085

guilhermerodz commented 4 months ago

That makes sense! the input ::selection should be indeed transparent in ALL situations. Should be made at library level.

Perhaps !important is the way to go there, will figure out

guilhermerodz commented 4 months ago

solved by 9b16030

please run npm install input-otp@latest