React-native: warning Node of type rule not supported as an inline style

Hey, when I tried to use the below styling in react-native:

const Input = styled.input`
  font-size: 1.25em;
  padding: 0.5em;
  margin: 0.5em;
  color: palevioletred;
  background: papayawhip;
  border: none;
  border-radius: 3px;

  &:hover {
    box-shadow: inset 1px 1px 2px rgba(0,0,0,0.1);
  }
`;

I go the the title warning, which I do not know how to resolve it. If I delete the internal hover section, it works without warning.

Thanks

[kitten]

You have to use the native import and a native component.

https://sc-next-docs.philpl.com/docs/basics#react-native

[bernatfortet]

I just found the problem 😕

height: {p => p.inputHeight}px; instead of height: ${p => p.inputHeight}px; I was missing the $ before the brackets

I wonder if there’s a good way to alert for that.

Thanks anyway