Support for container-properties and @container rules
threema-danilo opened this issue · 2 comments
Is your feature request related to a problem? Please describe.
When using container-properties and @container rules / at-queries, svelte-check complains about these properties not being known:
<style lang="scss">
.profile-picture {
container-type: size;
container-name: resize-box;
/* ... */
@container resize-box (aspect-ratio > 1/1) {
.inner {
width: auto;
height: 100%;
}
}
}
</style>
svelte-check output:
ProfilePicture.svelte:41:5
Warn: Unknown property: 'container-type' (scss)
.profile-picture {
container-type: size;
container-name: resize-box;
ProfilePicture.svelte:42:5
Warn: Unknown property: 'container-name' (scss)
container-type: size;
container-name: resize-box;
grid-area: profile-picture;
ProfilePicture.svelte:65:5
Warn: Unknown at rule @container (scss)
@container resize-box (aspect-ratio > 1/1) {
.inner {
Describe the solution you'd like
I'm not sure whether this is the proper repository for such a feature request, but container queries are already usable in current browsers and it would be good if this wouldn't trigger a warning 🙂 https://caniuse.com/?search=%40container
Describe alternatives you've considered
I could disable all warnings for unknown properties and at-queries, but that might silence warnings for actual typos.
How important is this feature to you?
I currently have to disable fail-on-warnings in CI because of this.
This isn't related to Svelte or preprocessing, this is related to the language tools / svelte-check
. Those use the vscode-css-languageservice
for intellisense inside the style tags, and that doesn't support container queries yet - see this upstream issue for more info. Closing in favor of that.
Ah, thanks for linking to the proper issue! 👍🏻