tor-browser

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

font-size-composition.html (2068B)

      1 <!DOCTYPE html>
      2 <meta charset="UTF-8">
      3 <title>font-size composition</title>
      4 <link rel="help" href="https://drafts.csswg.org/css-fonts-3/#propdef-font-size">
      5 <script src="/resources/testharness.js"></script>
      6 <script src="/resources/testharnessreport.js"></script>
      7 <script src="/css/support/interpolation-testcommon.js"></script>
      8 <style>
      9 :root {
     10  font-size: 30px;
     11 }
     12 .parent {
     13  font-size: 20px;
     14 }
     15 </style>
     16 <body>
     17 <script>
     18 test_composition({
     19  property: 'font-size',
     20  underlying: '50px',
     21  addFrom: '100px',
     22  addTo: '200px',
     23 }, [
     24  {at: -0.3, expect: '120px'},
     25  {at: 0, expect: '150px'},
     26  {at: 0.25, expect: '175px'},
     27  {at: 0.5, expect: '200px'},
     28  {at: 0.75, expect: '225px'},
     29  {at: 1, expect: '250px'},
     30  {at: 1.5, expect: '300px'},
     31 ]);
     32 
     33 test_composition({
     34  property: 'font-size',
     35  underlying: '100px',
     36  addFrom: '10px',
     37  addTo: 'large',
     38 }, [
     39  {at: -0.5, expect: '106px'},
     40  {at: 0, expect: '110px'},
     41  {at: 0.25, expect: '112px'},
     42  {at: 0.5, expect: '114px'},
     43  {at: 0.75, expect: '116px'},
     44  {at: 1, expect: '118px'},
     45  {at: 1.5, expect: '122px'},
     46 ]);
     47 
     48 test_composition({
     49  property: 'font-size',
     50  underlying: '50%',
     51  addFrom: 'small',
     52  addTo: '20px',
     53 }, [
     54  {at: -0.3, expect: '20.9px'},
     55  {at: 0, expect: '23px'},
     56  {at: 0.25, expect: '24.75px'},
     57  {at: 0.5, expect: '26.5px'},
     58  {at: 0.75, expect: '28.25px'},
     59  {at: 1, expect: '30px'},
     60  {at: 1.5, expect: '33.5px'},
     61 ]);
     62 
     63 test_composition({
     64  property: 'font-size',
     65  underlying: '20%',
     66  addFrom: '10rem',
     67  replaceTo: '5em',
     68 }, [
     69  {at: -0.3, expect: '365.2px'},
     70  {at: 0, expect: '304px'},
     71  {at: 0.25, expect: '253px'},
     72  {at: 0.5, expect: '202px'},
     73  {at: 0.75, expect: '151px'},
     74  {at: 1, expect: '100px'},
     75  {at: 1.5, expect: '0px'},
     76 ]);
     77 
     78 test_composition({
     79  property: 'font-size',
     80  underlying: 'small',
     81  replaceFrom: 'medium',
     82  addTo: 'larger',
     83 }, [
     84  {at: -0.3, expect: '9.7px'},
     85  {at: 0, expect: '16px'},
     86  {at: 0.25, expect: '21.25px'},
     87  {at: 0.5, expect: '26.5px'},
     88  {at: 0.75, expect: '31.75px'},
     89  {at: 1, expect: '37px'},
     90  {at: 1.5, expect: '47.5px'},
     91 ]);
     92 </script>
     93 </body>