| OLD | NEW |
|---|
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <meta charset="UTF-8"> | 2 <meta charset="UTF-8"> |
| 3 <style> | 3 <style> |
| 4 .target { | 4 .target { |
| 5 stroke: black; | 5 stroke: black; |
| 6 /* | 6 /* |
| 7 CSS transitions and animations for baseline-shift are broken unless a | 7 CSS transitions and animations for baseline-shift are broken unless a |
| 8 numerical underlying value is specified. See crbug.com/304007. | 8 numerical underlying value is specified. See crbug.com/304007. |
| 9 */ | 9 */ |
| 10 baseline-shift: 0; | 10 baseline-shift: 0; |
| 11 } | 11 } |
| 12 .replica { | 12 .replica { |
| 13 stroke: green; | 13 stroke: green; |
| 14 } | 14 } |
| 15 svg:nth-child(2n) { | 15 svg:nth-child(2n) { |
| 16 margin-right: 10px; | 16 margin-right: 10px; |
| 17 } | 17 } |
| 18 svg { | 18 svg { |
| 19 baseline-shift: 30px; | 19 baseline-shift: 30px; |
| 20 } | 20 } |
| 21 </style> | 21 </style> |
| 22 <body> | 22 <body> |
| 23 <template id="target-template"> | 23 <template id="target-template"> |
| 24 <svg width="30" height="50"> | 24 <svg width="30" height="50"> |
| 25 <!-- | 25 <!-- |
| 26 We have to specify the target class on the text element because numerical | 26 We have to specify the target class on the text element because numerical |
| 27 values of baseline-shift are not inherited properly. See crbug.com/304006. | 27 values of baseline-shift are not inherited properly. See crbug.com/304006. |
| 28 --> | 28 --> |
| 29 <text x="0" y="25" font-size="20" class="target"> | 29 <text x="0" y="25" font-size="10" class="target"> |
| 30 <tspan>T</tspan>T | 30 <tspan>T</tspan>T |
| 31 </text> | 31 </text> |
| 32 </svg> | 32 </svg> |
| 33 </template> | 33 </template> |
| 34 <script src="resources/interpolation-test.js"></script> | 34 <script src="resources/interpolation-test.js"></script> |
| 35 <script> | 35 <script> |
| 36 assertInterpolation({ | 36 assertInterpolation({ |
| 37 property: 'baseline-shift', | 37 property: 'baseline-shift', |
| 38 from: '-10px', | 38 from: '-10px', |
| 39 to: '10px' | 39 to: '10px' |
| (...skipping 65 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 105 {at: -0.25, is: '228.720474243164px'}, | 105 {at: -0.25, is: '228.720474243164px'}, |
| 106 {at: 0, is: '50mm'}, | 106 {at: 0, is: '50mm'}, |
| 107 {at: 0.25, is: '149.232284545898px'}, | 107 {at: 0.25, is: '149.232284545898px'}, |
| 108 {at: 0.75, is: '69.7440948486328px'}, | 108 {at: 0.75, is: '69.7440948486328px'}, |
| 109 {at: 1, is: '30px'}, | 109 {at: 1, is: '30px'}, |
| 110 {at: 1.25, is: '-9.74409484863281px'}, | 110 {at: 1.25, is: '-9.74409484863281px'}, |
| 111 ]); | 111 ]); |
| 112 assertInterpolation({ | 112 assertInterpolation({ |
| 113 property: 'baseline-shift', | 113 property: 'baseline-shift', |
| 114 from: '10px', | 114 from: '10px', |
| 115 to: '20em' | 115 to: '21em' |
| 116 }, [ | 116 }, [ |
| 117 {at: -0.25, is: '10px'}, | 117 {at: -0.25, is: '-40px'}, |
| 118 {at: 0, is: '10px'}, | 118 {at: 0, is: '10px'}, |
| 119 {at: 0.25, is: '10px'}, | 119 {at: 0.25, is: '60px'}, |
| 120 {at: 0.75, is: '20em'}, | 120 {at: 0.75, is: '160px'}, |
| 121 {at: 1, is: '20em'}, | 121 {at: 1, is: '210px'}, |
| 122 {at: 1.25, is: '20em'}, | 122 {at: 1.25, is: '260px'}, |
| 123 ]); | 123 ]); |
| 124 assertInterpolation({ | 124 assertInterpolation({ |
| 125 property: 'baseline-shift', | 125 property: 'baseline-shift', |
| 126 from: 'inherit', | 126 from: 'inherit', |
| 127 to: '40em' | 127 to: '33em' |
| 128 }, [ | 128 }, [ |
| 129 {at: -0.25, is: '30px'}, | 129 {at: -0.25, is: '-45px'}, |
| 130 {at: 0, is: '30px'}, | 130 {at: 0, is: '30px'}, |
| 131 {at: 0.25, is: '30px'}, | 131 {at: 0.25, is: '105px'}, |
| 132 {at: 0.75, is: '40em'}, | 132 {at: 0.75, is: '255px'}, |
| 133 {at: 1, is: '40em'}, | 133 {at: 1, is: '330px'}, |
| 134 {at: 1.25, is: '40em'}, | 134 {at: 1.25, is: '405px'}, |
| 135 ]); | 135 ]); |
| 136 | 136 |
| 137 </script> | 137 </script> |
| 138 </body> | 138 </body> |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 956553004:
Use Length for baselineShiftValue in SVGLayoutStyle (Closed)
Base URL: svn://svn.chromium.org/blink/trunk