highlight.js: (CSS) Animations highlighting incorrectly
CSS animations highlighting incorrectly When writing CSS animations, such as:
@keyframes animation {
10.1% {
left: 10px;
}
}
It highlights incorrectly.
animationisn’t highlighted as a variable10.1%isn’t highlighted as anhljs-numberas it should be.1is highlighted as ahljs-selector-class.
Language: CSS
I used highlight
…
Sample Code to Reproduce
@keyframes animation {
10.1% {
left: 10px;
}
}
Or any other CSS animation, really. Example JSFiddle: https://jsfiddle.net/barhatsor/oz14ewyx/2/
Expected behavior Turns out Github also higlights it incorrectly so here’s a picture of CodeMirror getting it right:

Would be happy if this got fixed. Thanks!
About this issue
- Original URL
- State: open
- Created 4 years ago
- Comments: 19 (18 by maintainers)
FYI
css_consistencyis rebased and merged into master now.We’ll see if @allejo has any thoughts. I been working on the CSS consistency more and this is pretty simple once you flatten the grammar… you can just use from/to keywords at the top-level for the frame positives, easy peasy. So complexity shouldn’t stop us.