From e3232e3a79853f4bf335a1ad8eb307c937746561 Mon Sep 17 00:00:00 2001 From: Gabriel Grant Date: Wed, 26 Oct 2022 13:28:02 -0700 Subject: [PATCH 1/2] custom-media: add basic test of container at-rules getting custom media strings --- plugins/postcss-custom-media/test/basic.css | 6 ++++++ plugins/postcss-custom-media/test/basic.expect.css | 6 ++++++ .../test/basic.preserve.expect.css | 12 ++++++++++++ 3 files changed, 24 insertions(+) diff --git a/plugins/postcss-custom-media/test/basic.css b/plugins/postcss-custom-media/test/basic.css index a992cfe2f..f76e74343 100644 --- a/plugins/postcss-custom-media/test/basic.css +++ b/plugins/postcss-custom-media/test/basic.css @@ -8,6 +8,12 @@ } } +@container (--mq-a) { + body { + order: 1; + } +} + @media (--mq-b) { body { order: 1; diff --git a/plugins/postcss-custom-media/test/basic.expect.css b/plugins/postcss-custom-media/test/basic.expect.css index ed797941c..3112bff3a 100644 --- a/plugins/postcss-custom-media/test/basic.expect.css +++ b/plugins/postcss-custom-media/test/basic.expect.css @@ -4,6 +4,12 @@ } } +@container (max-width: 30em),(max-height: 30em) { + body { + order: 1; + } +} + @media screen and (max-width: 30em) { body { order: 1; diff --git a/plugins/postcss-custom-media/test/basic.preserve.expect.css b/plugins/postcss-custom-media/test/basic.preserve.expect.css index 4c8aefc63..ed31a16b4 100644 --- a/plugins/postcss-custom-media/test/basic.preserve.expect.css +++ b/plugins/postcss-custom-media/test/basic.preserve.expect.css @@ -14,6 +14,18 @@ } } +@container (max-width: 30em),(max-height: 30em) { + body { + order: 1; + } +} + +@container (--mq-a) { + body { + order: 1; + } +} + @media screen and (max-width: 30em) { body { order: 1; From 273442d46604bfe3f161ca36c38187df990e6e7f Mon Sep 17 00:00:00 2001 From: Gabriel Grant Date: Wed, 26 Oct 2022 13:29:16 -0700 Subject: [PATCH 2/2] custom-media: treat @container as at-rule to be processeds (was just @media) --- plugins/postcss-custom-media/src/index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/plugins/postcss-custom-media/src/index.js b/plugins/postcss-custom-media/src/index.js index 17d08a2ed..44cd4c1e9 100644 --- a/plugins/postcss-custom-media/src/index.js +++ b/plugins/postcss-custom-media/src/index.js @@ -32,7 +32,7 @@ const creator = opts => { await writeCustomMediaToExports(helpers[customMediaHelperKey], exportTo); }, AtRule: (atrule, helpers) => { - if (atrule.name !== 'media') { + if (!(atrule.name === 'media' || atrule.name === 'container')) { return; }