modernize example

estelle · estelle · commit 2a1c77b022f4 · 2024-01-02T17:34:48.000-08:00
diff --git a/feature-queries/or.html b/feature-queries/or.html
@@ -12,10 +12,10 @@
         border: 4px solid blue;
         color: blue;
       }
-      @supports (display: grid) or (display: -ms-grid) {
+      @supports (font-smooth: always) or (-webkit-font-smoothing: always) {
         .box {
-          border: 4px solid red;
-          color: red;
+          border: 4px dashed darkgreen;
+          color: darkgreen;
         }
       }
     </style>
@@ -24,8 +24,8 @@
   <body>
     <section class="preview">
       <div class="box">
-        If your browser supports display: grid or display: -ms-grid, the text
-        and border will be red.
+        If your browser supports font smoothing, the text
+        and border will be green.
       </div>
     </section>
 
@@ -34,17 +34,18 @@
   border: 4px solid blue;
   color: blue;
 }
-@supports (display: grid) or (display: -ms-grid)  {
+@supports (font-smooth: always) or (-webkit-font-smoothing: always) {
   .box {
-    border: 4px solid red;
-    color: red;
+    border: 4px dashed darkgreen;
+    color: darkgreen;
   }
+}
 }</textarea
     >
 
     <textarea class="playable playable-html" style="height: 120px">
 <div class="box">
-If your browser supports display: grid or display: -ms-grid, the text and border will be red.
+  If your browser supports font smoothing, the text and border will be green.
 </div></textarea
     >
 
