tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

media-rules.html (1560B)

      1 <!DOCTYPE html>
      2 <html>
      3 <head>
      4  <meta charset="UTF-8">
      5  <meta name="viewport" content="width=device-width,initial-scale=1">
      6  <link rel="stylesheet" href="simple.css"/>
      7  <link rel="stylesheet" href="media-rules.css"/>
      8  <!-- This stylesheet is needed to ensure we cover the fix for Bug 1779043 -->
      9  <style>
     10    div {
     11      color: salmon;
     12    }
     13  </style>
     14  <style>
     15    @media screen {
     16      div {
     17        outline: 1px solid tomato;
     18      }
     19 
     20      @supports (display: flex) {
     21        @media (1px < height < 10000px) {
     22          div {
     23            display: flex;
     24          }
     25        }
     26      }
     27    }
     28 
     29    @layer myLayer {}
     30    @container (min-width: 1px) {
     31      body {
     32        div {
     33          color: gold;
     34          @supports selector(&) {
     35            &:hover {
     36              color: yellowgreen;
     37            }
     38          }
     39        }
     40      }
     41    }
     42 
     43    @property --my-property {
     44      syntax: "<color>";
     45      inherits: true;
     46      initial-value: #f06;
     47    }
     48 
     49    @position-try --pt-custom-bottom {
     50      top: anchor(bottom);
     51      bottom: unset;
     52      margin-top: 10px;
     53    }
     54 
     55    @custom-media --mobile-breakpoint (width < 320px) and (height < 1420px), not print;
     56    @custom-media --enabled true;
     57    @custom-media --disabled false;
     58 
     59    div {
     60      color: chocolate;
     61 
     62      @media (--mobile-breakpoint) {
     63        color: peachpuff;
     64      }
     65 
     66      @media (--enabled) {
     67        color: green;
     68      }
     69 
     70      @media (--disabled) {
     71        color: red;
     72      }
     73    }
     74  </style>
     75 </head>
     76 <body>
     77  <div>
     78    Testing style editor media sidebar
     79  </div>
     80 </body>
     81 </html>