You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: README.md
+32-6Lines changed: 32 additions & 6 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1,8 +1,5 @@
1
1
# CSS Nesting Syntax Highlighting
2
-
3
-
> Note: You may need to reload VSCode after installing this extension for it to take effect.
4
-
5
-
All modern browsers support CSS nesting ([Can I Use](https://caniuse.com/css-nesting)), but Visual Studio Code doesn't currently have CSS nesting syntax highlighting. This extension rectifies that by updating the CSS syntax highlighting to include nesting.
2
+
All modern browsers support CSS nesting ([Can I Use](https://caniuse.com/css-nesting)), but Visual Studio Code doesn't currently have CSS nesting syntax highlighting. This extension rectifies that by updating the CSS syntax highlighting to include nesting (and more).
6
3
7
4
To learn more about CSS Nesting, see [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_nesting).
8
5
@@ -27,15 +24,45 @@ The core CSS syntax file this extension updates can be found in the [official vs
## Includes _function_ syntax highlighting for 'at-rules', such as in `@media`
45
+
46
+
```css
47
+
/* calc() function example */
48
+
@media (max-width: calc( (768/16) * 1rem )) {
49
+
.example {
50
+
margin: 0;
51
+
}
52
+
}
53
+
```
54
+
30
55
## Installation
31
56
57
+
> Note: You may need to reload VSCode after installing this extension for it to take effect.
58
+
32
59
Search for `CSS Nesting Syntax Highlighting` in the VSCode's Extensions Marketplace panel or click the install button on the [CSS Nesting Syntax Highlighting Marketplace page](https://marketplace.visualstudio.com/items?itemName=jacobcassidy.css-nesting-syntax-highlighting).
33
60
34
61
You can also manually install the extension by cloning the [github repository](https://github.com/jacobcassidy/vscode-css-nesting-syntax-highlighting) into `~/.vscode/extensions` and restarting the VSCode editor.
35
62
36
63
## Companion Theme
37
64
38
-
CSS Nesting Syntax Highlighting works excellent with the [Cassidy Dark Theme](https://marketplace.visualstudio.com/items?itemName=jacobcassidy.cassidy-dark).
65
+
CSS Nesting Syntax Highlighting works great with the [Cassidy Dark Theme](https://marketplace.visualstudio.com/items?itemName=jacobcassidy.cassidy-dark).
39
66
40
67
## What's New?
41
68
@@ -46,7 +73,6 @@ View the [Changelog](https://github.com/jacobcassidy/vscode-css-nesting-syntax-h
46
73
- When nested, a few obscure `#tag-names` are overridden by the same `#property-names`. Those names are:
0 commit comments