Add environment variables group

features/safe-area-inset.yml

@@ -0,0 +1,10 @@
+name: Safe area inset environment variables
+description: The `safe-area-inset-` CSS environment variables represent a rectangle that cannot cut off content within a non-rectangular screen. For example, `top:\ env(safe-area-inset-top);` positions the top of an element below the notch on an iPhone.
+spec: https://drafts.csswg.org/css-env-1/#safe-area-insets
+group: environment-variables
+compat_features:
+  - css.properties.custom-property.env.safe-area-inset-bottom
+  - css.properties.custom-property.env.safe-area-inset-left
+  - css.properties.custom-property.env.safe-area-inset-right
+  - css.properties.custom-property.env.safe-area-inset-top
+  - css.properties.custom-property.env

features/safe-area-inset.yml.dist

@@ -0,0 +1,21 @@
+# Generated from: safe-area-inset.yml
+# Do not edit this file by hand. Edit the source file instead!
+
+status:
+  baseline: high
+  baseline_low_date: 2020-01-15
+  baseline_high_date: 2022-07-15
+  support:
+    chrome: "69"
+    chrome_android: "69"
+    edge: "79"
+    firefox: "65"
+    firefox_android: "65"
+    safari: "11.1"
+    safari_ios: "11.3"
+compat_features:
+  - css.properties.custom-property.env
+  - css.properties.custom-property.env.safe-area-inset-bottom
+  - css.properties.custom-property.env.safe-area-inset-left
+  - css.properties.custom-property.env.safe-area-inset-right
+  - css.properties.custom-property.env.safe-area-inset-top

groups/environment-variables.yml

@@ -0,0 +1,3 @@
+name: CSS environment variables
+# description: CSS environment variables expose system-specific values using the `env()` function.
+parent: css