mirror of
https://github.com/RGBCube/serenity
synced 2025-10-31 04:22:45 +00:00
e0fe77d012
Each ref test now links to its reference page with a link tag, in the same format as WPT: `<link rel="match" href="reference-page.html" />` The reference pages have all been moved into a separate `reference/` dir so that we can just treat every file in `ref/` as a test. There's no filter to only look at .html files, because we also have a .svg file in there, and there may be other formats we want to use too. But it's not too hard to add one if we need it.
188 lines
7.7 KiB
HTML
188 lines
7.7 KiB
HTML
<link rel="match" href="reference/svg-radialGradient-ref.html" />
|
|
<style>
|
|
* {
|
|
margin: 0;
|
|
}
|
|
body {
|
|
background-color: white;
|
|
}
|
|
svg {
|
|
margin-right: calc(100% - 400px)
|
|
}
|
|
</style>
|
|
<!-- spreadMethod=pad -->
|
|
<svg width="400" height="300" version="1.1" xmlns="http://www.w3.org/2000/svg">
|
|
<defs>
|
|
<radialGradient id="baseGrad">
|
|
<stop offset="0%" stop-color="red" />
|
|
<stop offset="40%" stop-color="purple" />
|
|
<stop offset="100%" stop-color="cyan" />
|
|
</radialGradient>
|
|
<!-- Start circle inside end circle -->
|
|
<radialGradient href="#baseGrad" id="test0" gradientUnits="userSpaceOnUse" cx="200" cy="150" r="100" fx="158" fy="93" fr="10">
|
|
</radialGradient>
|
|
</defs>
|
|
<rect x="0" y="0" width="400" height="300" fill="url(#test0)"></rect>
|
|
</svg>
|
|
<svg width="400" height="300" version="1.1" xmlns="http://www.w3.org/2000/svg">
|
|
<defs>
|
|
<!-- Start circle outside end circle -->
|
|
<radialGradient href="#baseGrad" id="test1" gradientUnits="userSpaceOnUse" cx="200" cy="150" r="100" fx="370" fy="44" fr="10">
|
|
</radialGradient>
|
|
</defs>
|
|
<rect x="0" y="0" width="400" height="300" fill="url(#test1)"></rect>
|
|
</svg>
|
|
<svg width="400" height="300" version="1.1" xmlns="http://www.w3.org/2000/svg">
|
|
<defs>
|
|
<!-- Start circle radius == end circle radius -->
|
|
<radialGradient href="#baseGrad" id="test2" gradientUnits="userSpaceOnUse" cx="200" cy="150" r="10" fx="40" fy="225" fr="10">
|
|
</radialGradient>
|
|
</defs>
|
|
<rect x="0" y="0" width="400" height="300" fill="url(#test2)"></rect>
|
|
</svg>
|
|
<svg width="400" height="300" version="1.1" xmlns="http://www.w3.org/2000/svg">
|
|
<defs>
|
|
<!-- Start circle larger than end circle (inside end circle) -->
|
|
<radialGradient href="#baseGrad" id="test3" gradientUnits="userSpaceOnUse" cx="200" cy="150" r="30" fx="200" fy="182" fr="70">
|
|
</radialGradient>
|
|
</defs>
|
|
<rect x="0" y="0" width="400" height="300" fill="url(#test3)"></rect>
|
|
</svg>
|
|
<svg width="400" height="300" version="1.1" xmlns="http://www.w3.org/2000/svg">
|
|
<defs>
|
|
<!-- Start circle larger than end circle (outside end circle) -->
|
|
<radialGradient href="#baseGrad" id="test4" gradientUnits="userSpaceOnUse" cx="200" cy="150" r="30" fx="242" fy="150" fr="70">
|
|
</radialGradient>
|
|
</defs>
|
|
<rect x="0" y="0" width="400" height="300" fill="url(#test4)"></rect>
|
|
</svg>
|
|
<svg width="400" height="300" version="1.1" xmlns="http://www.w3.org/2000/svg">
|
|
<defs>
|
|
<!-- Start circle radius == 0 (inside end circle) -->
|
|
<radialGradient href="#baseGrad" id="test5" gradientUnits="userSpaceOnUse" cx="200" cy="150" r="120" fx="144" fy="186" fr="0">
|
|
</radialGradient>
|
|
</defs>
|
|
<rect x="0" y="0" width="400" height="300" fill="url(#test5)"></rect>
|
|
</svg>
|
|
<svg width="400" height="300" version="1.1" xmlns="http://www.w3.org/2000/svg">
|
|
<defs>
|
|
<!-- Start circle radius == 0 (outside end circle) -->
|
|
<radialGradient href="#baseGrad" id="test6" gradientUnits="userSpaceOnUse" cx="200" cy="150" r="120" fx="23" fy="40" fr="0">
|
|
</radialGradient>
|
|
</defs>
|
|
<rect x="0" y="0" width="400" height="300" fill="url(#test6)"></rect>
|
|
</svg>
|
|
<!-- spreadMethod=reflect -->
|
|
<svg width="400" height="300" version="1.1" xmlns="http://www.w3.org/2000/svg">
|
|
<defs>
|
|
<!-- Start circle inside end circle -->
|
|
<radialGradient href="#test0" id="reflectTest0" spreadMethod="reflect">
|
|
</radialGradient>
|
|
</defs>
|
|
<rect x="0" y="0" width="400" height="300" fill="url(#reflectTest0)"></rect>
|
|
</svg>
|
|
<svg width="400" height="300" version="1.1" xmlns="http://www.w3.org/2000/svg">
|
|
<defs>
|
|
<!-- Start circle outside end circle -->
|
|
<radialGradient href="#test1" id="reflectTest1" spreadMethod="reflect">
|
|
</radialGradient>
|
|
</defs>
|
|
<rect x="0" y="0" width="400" height="300" fill="url(#reflectTest1)"></rect>
|
|
</svg>
|
|
<svg width="400" height="300" version="1.1" xmlns="http://www.w3.org/2000/svg">
|
|
<defs>
|
|
<!-- Start circle radius == end circle radius -->
|
|
<radialGradient href="#test2" id="reflectTest2" spreadMethod="reflect">
|
|
</radialGradient>
|
|
</defs>
|
|
<rect x="0" y="0" width="400" height="300" fill="url(#reflectTest2)"></rect>
|
|
</svg>
|
|
<svg width="400" height="300" version="1.1" xmlns="http://www.w3.org/2000/svg">
|
|
<defs>
|
|
<!-- Start circle larger than end circle (inside end circle) -->
|
|
<radialGradient href="#test3" id="reflectTest3" spreadMethod="reflect">
|
|
</radialGradient>
|
|
</defs>
|
|
<rect x="0" y="0" width="400" height="300" fill="url(#reflectTest3)"></rect>
|
|
</svg>
|
|
<svg width="400" height="300" version="1.1" xmlns="http://www.w3.org/2000/svg">
|
|
<defs>
|
|
<!-- Start circle larger than end circle (outside end circle) -->
|
|
<radialGradient href="#test4" id="reflectTest4" spreadMethod="reflect">
|
|
</radialGradient>
|
|
</defs>
|
|
<rect x="0" y="0" width="400" height="300" fill="url(#reflectTest4)"></rect>
|
|
</svg>
|
|
<svg width="400" height="300" version="1.1" xmlns="http://www.w3.org/2000/svg">
|
|
<defs>
|
|
<!-- Start circle radius == 0 (inside end circle) -->
|
|
<radialGradient href="#test5" id="reflectTest5" spreadMethod="reflect">
|
|
</radialGradient>
|
|
</defs>
|
|
<rect x="0" y="0" width="400" height="300" fill="url(#reflectTest5)"></rect>
|
|
</svg>
|
|
<svg width="400" height="300" version="1.1" xmlns="http://www.w3.org/2000/svg">
|
|
<defs>
|
|
<!-- Start circle radius == 0 (outside end circle) -->
|
|
<radialGradient href="#test6" id="reflectTest6" spreadMethod="reflect">
|
|
</radialGradient>
|
|
</defs>
|
|
<rect x="0" y="0" width="400" height="300" fill="url(#reflectTest6)"></rect>
|
|
</svg>
|
|
<!-- spreadMethod=repeat -->
|
|
<svg width="400" height="300" version="1.1" xmlns="http://www.w3.org/2000/svg">
|
|
<defs>
|
|
<!-- Start circle inside end circle -->
|
|
<radialGradient href="#test0" id="repeatTest0" spreadMethod="repeat">
|
|
</radialGradient>
|
|
</defs>
|
|
<rect x="0" y="0" width="400" height="300" fill="url(#repeatTest0)"></rect>
|
|
</svg>
|
|
<svg width="400" height="300" version="1.1" xmlns="http://www.w3.org/2000/svg">
|
|
<defs>
|
|
<!-- Start circle outside end circle -->
|
|
<radialGradient href="#test1" id="repeatTest1" spreadMethod="repeat">
|
|
</radialGradient>
|
|
</defs>
|
|
<rect x="0" y="0" width="400" height="300" fill="url(#repeatTest1)"></rect>
|
|
</svg>
|
|
<svg width="400" height="300" version="1.1" xmlns="http://www.w3.org/2000/svg">
|
|
<defs>
|
|
<!-- Start circle radius == end circle radius -->
|
|
<radialGradient href="#test2" id="repeatTest2" spreadMethod="repeat">
|
|
</radialGradient>
|
|
</defs>
|
|
<rect x="0" y="0" width="400" height="300" fill="url(#repeatTest2)"></rect>
|
|
</svg>
|
|
<svg width="400" height="300" version="1.1" xmlns="http://www.w3.org/2000/svg">
|
|
<defs>
|
|
<!-- Start circle larger than end circle (inside end circle) -->
|
|
<radialGradient href="#test3" id="repeatTest3" spreadMethod="repeat">
|
|
</radialGradient>
|
|
</defs>
|
|
<rect x="0" y="0" width="400" height="300" fill="url(#repeatTest3)"></rect>
|
|
</svg>
|
|
<svg width="400" height="300" version="1.1" xmlns="http://www.w3.org/2000/svg">
|
|
<defs>
|
|
<!-- Start circle larger than end circle (outside end circle) -->
|
|
<radialGradient href="#test4" id="repeatTest4" spreadMethod="repeat">
|
|
</radialGradient>
|
|
</defs>
|
|
<rect x="0" y="0" width="400" height="300" fill="url(#repeatTest4)"></rect>
|
|
</svg>
|
|
<svg width="400" height="300" version="1.1" xmlns="http://www.w3.org/2000/svg">
|
|
<defs>
|
|
<!-- Start circle radius == 0 (inside end circle) -->
|
|
<radialGradient href="#test5" id="repeatTest5" spreadMethod="repeat">
|
|
</radialGradient>
|
|
</defs>
|
|
<rect x="0" y="0" width="400" height="300" fill="url(#repeatTest5)"></rect>
|
|
</svg>
|
|
<svg width="400" height="300" version="1.1" xmlns="http://www.w3.org/2000/svg">
|
|
<defs>
|
|
<!-- Start circle radius == 0 (outside end circle) -->
|
|
<radialGradient href="#test6" id="repeatTest6" spreadMethod="repeat">
|
|
</radialGradient>
|
|
</defs>
|
|
<rect x="0" y="0" width="400" height="300" fill="url(#repeatTest6)"></rect>
|
|
</svg>
|