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.
:root not possible in component CSS files
See original GitHub issueI’d like to define some CSS variables for my component. For example,
// app/styles/components/my-component.scss
:root {
--my-component-color: blue;
}
& {
color: var(--my-component-color);
some: other-style-that-cannot-be-customized;
}
This would let component authors allow certain aspects of their component to be customized, but not others.
See #281
Issue Analytics
- State:
- Created 5 years ago
- Reactions:1
- Comments:6 (3 by maintainers)
Top Results From Across the Web
reactjs - Style root element using css file, but not working
You cannot style the #root of your app. Just style the className of <App /> component, for example: const App = () =>...
Read more >root - CSS: Cascading Style Sheets - MDN Web Docs - Mozilla
In HTML, :root represents the <html> element and is identical to the selector html , except that its specificity is higher.
Read more >Breaking CSS Custom Properties out of :root Might Be a Good ...
The main reason that :root is suggested is because CSS isn't only used to style HTML documents. It is also used for XML...
Read more >Solving the React Error: Not Picking Up CSS Style | Pluralsight
This error is generated because the compiler is only able to import files from the src folder. Here, the CSS file is saved...
Read more >CSS Variables for React Devs - Josh W Comeau
css file.) We've created some variables, hung them on the root node, and now we can access them in our components: jsx.
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
oohh…!!! Ha! it is. hmmm… I’d say that if it’s a language feature that exists in css, which it appears to be, https://developer.mozilla.org/en-US/docs/Web/CSS/:root then that should be something that we support.
any movement on this?