tweak popover css (#2055)

Co-authored-by: Cameron Dutro <[email protected]>

.changeset/angry-files-leave.md

@@ -0,0 +1,5 @@
+---
+'@primer/view-components': patch
+---
+
+Tweak Overlay CSS to account for cases where the browser supports :open, :popover-open, both, or neither.

.github/workflows/preview-deploy.yml

@@ -119,9 +119,8 @@ jobs:
 
       - name: Generate static files
         run: |
-          bundle exec rake utilities:build
-          bundle exec rake docs:build
-          bundle exec rake static:dump
+          bundle exec rake utilities:build docs:build static:dump
+          echo -e "/* autoprefixer: off */\n$(cat docs/static/primer_view_components.css)" > docs/static/primer_view_components.css
 
       - name: Build
         run: npm run build:docs:preview

app/components/primer/alpha/overlay.pcss

@@ -3,13 +3,23 @@
   padding: 0;
   position: absolute;
   min-width: 192px;
+  inset: auto;
 }
 
-/* stylelint-disable-next-line selector-pseudo-class-no-unknown */
-.Overlay[popover]:not(:popover-open) {
+.Overlay[popover]:not(.\:popover-open) {
   display: none;
 }
 
-anchored-position {
-  display: block;
+/* This reverts the declaration above for native popover, where `:popover-open` is supported */
+@supports selector(:popover-open) {
+  .Overlay[popover]:not(.\:popover-open) {
+    display: revert;
+  }
+}
+
+/* This reverts the declaration above for native popover, where `:open` is supported (Chrome 113, Safari TP) */
+@supports selector(:open) {
+  .Overlay[popover]:not(.\:popover-open) {
+      display: revert;
+  }
 }