How to style specific nested tokens?
See original GitHub issueIs your feature request related to a problem? Please describe.
The built-in styles include nested token styles like this:
However as far as I can tell they don’t actually seem to work.
Describe the solution you’d like
It would be great if there was some way to target nested tokens like you can when writing a CSS theme for Prism/Highlight.
Describe alternatives you’ve considered
Tried a bunch of syntaxes to see if anything worked:
<SyntaxHighlighter
style={{
'.token.atrule .token.rule': { background: 'pink' }
'atrule rule': { background: 'pink' }
'atrule.rule': { background: 'pink' }
}}
{/* ... */}
/>
Issue Analytics
- State:
- Created 4 years ago
- Reactions:1
- Comments:8 (8 by maintainers)
Top Results From Across the Web
How to manage your Design Tokens with Style Dictionary
Recently I have come across a tool, called Style Dictionary, developed by Danny Banks at Amazon, that allows you to manage design tokens...
Read more >how to add styles inside nested routes react router
1 Answer 1 ... Create a layout route that renders the div element and style and an Outlet component for the nested Route...
Read more >Multiple Nested Styles In InDesign - YouTube
This video shows you how to save time by applying multiple Nested Styles to listings In InDesign.
Read more >css simple selector - style nested elements - CodePen
Insecure Resource. The resource you are linking to is using the 'http' protocol, which may not work when the browser is using https....
Read more >Can I use a drop cap/nested style up to a specific digit. - Reddit
Yes, you can use nested style for that. Just assign the character style to bold, through 1 ":". There is no option for...
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
@adamwathan a solution from #305 has now been merged and is available in
react-syntax-highlighter@15.0.1
!If it works for you, maybe this issue can be closed 😃
Opened a PR with this approach at https://github.com/react-syntax-highlighter/react-syntax-highlighter/pull/305 - of course open for feedback and changing the approach!