question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Node of type rule not supported as an inline style

See original GitHub issue

When using primitives, if I try to add a pseudo-class I get Node of type rule not supported as an inline style. I found a very similar ticket (#770), but I was unable to solve this problem.

import styled from 'styled-components/primitives';

const Ciao = styled.View`
  width: 100px;
  height: 100px;
  background: papayawhip;
  
  &:hover {
    background: palevioletred;
  }
`;

Issue Analytics

  • State:closed
  • Created 6 years ago
  • Comments:6 (2 by maintainers)

github_iconTop GitHub Comments

20reactions
jeffreybrowningcommented, Nov 22, 2017

This should be added to the readme and documentation. I have only found this information, that some subset of the library is not available in React Native, here in this issue. Please percolate that up to more visible spots with exactly what is and is not usable.

0reactions
kopax-polyconseilcommented, Mar 9, 2022

Same here

Read more comments on GitHub >

github_iconTop Results From Across the Web

React-native: warning Node of type rule not supported as an ...
I'm importing native and using native components. It seems that the warning appears when I'm styling a TextInput and adding height to it....
Read more >
Pseudo selectors not working with styled-components - Reddit
"node of type rule not supported as an inline style". is there something wrong with syntax or its not supported? any idea if...
Read more >
Styled-system in react native responsive values - Stack Overflow
I want to use responsive style in my box component but I get error "Node of type atrule not supported as an inline...
Read more >
Why you shouldn't use inline styling in production React apps
One of the main reasons that inline styling is not a good choice for your application is because it does not support (or...
Read more >
React Styled Components: Inline Styles + 3 Other CSS Styling ...
There are four different ways to style React application, and in this post you will learn about them all. Let's start with inline...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found