Add resolution media queries (#1798)

Author: jamesnw

features/resolution.yml

@@ -0,0 +1,12 @@
+name: resolution media query
+description: The `resolution` CSS media query sets styles based on the pixel density, or how many pixels a device uses to display a single CSS pixel.
+spec: https://drafts.csswg.org/mediaqueries-5/#resolution
+caniuse: css-media-resolution
+# group: media-queries
+compat_features:
+  - css.at-rules.media.resolution
+  - css.types.resolution
+  - css.types.resolution.dpcm
+  - css.types.resolution.dpi
+  - css.types.resolution.dppx
+  - css.types.resolution.x

features/resolution.yml.dist

@@ -0,0 +1,54 @@
+# Generated from: resolution.yml
+# Do not edit this file by hand. Edit the source file instead!
+
+status:
+  baseline: low
+  baseline_low_date: 2022-09-12
+  support:
+    chrome: "68"
+    chrome_android: "68"
+    edge: "79"
+    firefox: "62"
+    firefox_android: "62"
+    safari: "16"
+    safari_ios: "16"
+compat_features:
+  # baseline: low
+  # baseline_low_date: 2022-09-12
+  # support:
+  #   chrome: "29"
+  #   chrome_android: "29"
+  #   edge: "12"
+  #   firefox: "8"
+  #   firefox_android: "8"
+  #   safari: "16"
+  #   safari_ios: "16"
+  - css.at-rules.media.resolution
+  - css.types.resolution
+  - css.types.resolution.dpcm
+  - css.types.resolution.dpi
+
+  # baseline: low
+  # baseline_low_date: 2022-09-12
+  # support:
+  #   chrome: "29"
+  #   chrome_android: "29"
+  #   edge: "12"
+  #   firefox: "16"
+  #   firefox_android: "16"
+  #   safari: "16"
+  #   safari_ios: "16"
+  - css.types.resolution.dppx
+
+  # ⬇️ Same status as overall feature ⬇️
+  # baseline: low
+  # baseline_low_date: 2022-09-12
+  # support:
+  #   chrome: "68"
+  #   chrome_android: "68"
+  #   edge: "79"
+  #   firefox: "62"
+  #   firefox_android: "62"
+  #   safari: "16"
+  #   safari_ios: "16"
+  - css.types.resolution.x