tor-browser

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

mq_dynamic_svg_test.html (1886B)

      1 <!DOCTYPE html>
      2 <html>
      3 <meta charset=utf-8>
      4 <style>
      5 @media (prefers-color-scheme: dark) {
      6  rect { fill: green; }
      7 }
      8 iframe { border: none; }
      9 </style>
     10 <p>inline</p>
     11 <svg width="50" height="50">
     12  <rect width="50" height="50" fill="red"/>
     13 </svg>
     14 <p>iframe</p>
     15 <iframe src='data:image/svg+xml,
     16  <svg xmlns="http://www.w3.org/2000/svg" width="50" height="50">
     17    <style>
     18      @media (prefers-color-scheme: dark) {
     19        rect { fill: green; }
     20      }
     21    </style>
     22    <rect width="50" height="50" fill="red"/>
     23  </svg>
     24 ' width=50 height=50></iframe>
     25 <p>img</p>
     26 <img src='data:image/svg+xml,
     27  <svg xmlns="http://www.w3.org/2000/svg" width="50" height="50">
     28    <style>
     29      @media (prefers-color-scheme: dark) {
     30        rect { fill: green; }
     31      }
     32    </style>
     33    <rect width="50" height="50" fill="red"/>
     34  </svg>
     35 ' width=50 height=50>
     36 <p>background-image</p>
     37 <div style='background-image: url("data:image/svg+xml,\
     38  <svg xmlns=&apos;http://www.w3.org/2000/svg&apos; width=&apos;50&apos; height=&apos;50&apos;>\
     39    <style>\
     40      @media (prefers-color-scheme: dark) {\
     41        rect { fill: green; }\
     42      }\
     43    </style>\
     44    <rect width=&apos;50&apos; height=&apos;50&apos; fill=&apos;red&apos;/>\
     45  </svg>\
     46 "); width: 50px; height: 50px;'></div>
     47 <p>img with nested document</p>
     48 <img src='data:image/svg+xml,
     49  <svg xmlns="http://www.w3.org/2000/svg" width="50" height="50">
     50    <image href="data:image/svg+xml,
     51      &amp;lt;svg xmlns=&amp;quot;http://www.w3.org/2000/svg&amp;quot; width=&amp;quot;50&amp;quot; height=&amp;quot;50&amp;quot;>
     52        &amp;lt;style>
     53          @media (prefers-color-scheme: dark) {
     54            rect { fill: green; }
     55          }
     56        &amp;lt;/style>
     57        &amp;lt;rect width=&amp;quot;50&amp;quot; height=&amp;quot;50&amp;quot; fill=&amp;quot;red&amp;quot;/>
     58      &amp;lt;/svg>
     59    " width="50" height="50"/>
     60  </svg>
     61 ' width=50 height=50>