Commit 03753cb
enable tailwind nesting (#29746)
Currently, if you implement native CSS nesting within a Vue component a
warning will appear in the terminal. It states
`Nested CSS was detected, but CSS nesting has not been configured
correctly.
Please enable a CSS nesting plugin *before* Tailwind in your
configuration.` To fix this error we need to enable the built-in
[tailwinds nesting
config](https://tailwindcss.com/docs/using-with-preprocessors#nesting).
Example code to trigger the warning within a vue component:
```CSS
<style>
.example {
&:hover,
&:focus-visible {
color: var(--color-text);
}
& svg {
margin-right: 0.78rem;
}
}
</style>
```
---------
Co-authored-by: rafh <rafaelheard@gmail.com>
Co-authored-by: silverwind <me@silverwind.io>1 parent 487ac9b commit 03753cb
3 files changed
+56
-2
lines changedSome generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.
| Original file line number | Diff line number | Diff line change | |
|---|---|---|---|
| |||
42 | 42 | | |
43 | 43 | | |
44 | 44 | | |
| 45 | + | |
45 | 46 | | |
46 | 47 | | |
47 | 48 | | |
| |||
| Original file line number | Diff line number | Diff line change | |
|---|---|---|---|
| |||
13 | 13 | | |
14 | 14 | | |
15 | 15 | | |
| 16 | + | |
| 17 | + | |
16 | 18 | | |
17 | 19 | | |
18 | 20 | | |
| |||
145 | 147 | | |
146 | 148 | | |
147 | 149 | | |
| 150 | + | |
148 | 151 | | |
149 | 152 | | |
150 | 153 | | |
151 | 154 | | |
152 | 155 | | |
153 | 156 | | |
154 | 157 | | |
155 | | - | |
| 158 | + | |
| 159 | + | |
| 160 | + | |
| 161 | + | |
156 | 162 | | |
157 | 163 | | |
158 | 164 | | |
| |||
0 commit comments