[css-cascade] Cascade layers need an import syntax · Issue #5681 · w3c/csswg-drafts (original) (raw)

This issue was raised on Cascade 5.

The current cascade-layers proposal offers several directions.

This also raises some question around ordering of @layer and @import rules. Currently:

• Layering is determined by source-order of @layer rules
• @import is required to come first in a document.

Using @layer

The most direct approach would be allowing a url() in place of a {…} code block in the @layer rule:

/* @layer ? url() */ @layer reset url(reset.css); @layer bootstrap url(bootstrap.css);

Using @import

It may also be possible to build on the existing @import syntax:

@import layer reset url(reset.css); @import layer(reset) url(reset.css);

Other options?

Other proposals include creating a new at-rule, or allowing imports to be nested inside the block syntax:

/* new rule */ @layer-import reset url(reset.css);

/* nested imports */ @layer reset { @import url(reset.css); }

/* etc… */