Mirrors/servo
1
0
Fork 0
mirror of https://github.com/servo/servo.git synced 2025-08-07 06:25:32 +01:00
Code Issues Projects Releases Packages Wiki Activity

Auto merge of #15905 - mephisto41:add-border-gradient, r=emilio

Browse source 
Add gradient border support.

webrender add gradient border support in https://github.com/servo/webrender/pull/953. This pr add support in servo.

---
<!-- Thank you for contributing to Servo! Please replace each `[ ]` by `[X]` when the step is complete, and replace `__` with appropriate data: -->
- [X] `./mach build -d` does not report any errors
- [X] `./mach test-tidy` does not report any errors

<!-- Either: -->
- [X] These changes do not require tests because it should be covered by wpt

<!-- Pull requests that do not address these steps are welcome, but they will require additional verification as part of the review process. -->

<!-- Reviewable:start -->
---
This change is [<img src="https://reviewable.io/review_button.svg" height="34" align="absmiddle" alt="Reviewable"/>](https://reviewable.io/reviews/servo/servo/15905)
<!-- Reviewable:end -->
This commit is contained in:
bors-servo 2017-03-26 02:29:16 -07:00 • committed by GitHub
commit fd8127b23b
6 changed files with 174 additions and 31 deletions
Download patch file Download diff file Expand all files Collapse all files

25
tests/wpt/mozilla/meta/MANIFEST.json
View file

@ -755,6 +755,18 @@
{}
]
],
"css/border-image-linear-gradient.html": [
[
"/_mozilla/css/border-image-linear-gradient.html",
[
[
"/_mozilla/css/border-image-linear-gradient-ref.html",
"=="
]
],
{}
]
],
"css/border_black_ridge_a.html": [
[
"/_mozilla/css/border_black_ridge_a.html",
@ -6993,6 +7005,11 @@
{}
]
],
"css/border-image-linear-gradient-ref.html": [
[
{}
]
],
"css/border_black_solid.html": [
[
{}
@ -20351,6 +20368,14 @@
"d0bf8fafec5ff2c0cfde8f0d47083ca23b745588",
"support"
],
"css/border-image-linear-gradient-ref.html": [
"3c1b61477c8a3cb7befc3ab81b80a128b142e3f1",
"support"
],
"css/border-image-linear-gradient.html": [
"40ea388a8a920eaecb2d0d12f998ed60ac3b56e8",
"reftest"
],
"css/border_black_groove.html": [
"42912352ee8f09ae0ddbac3dce35294dc8608bbe",
"reftest_node"

32
tests/wpt/mozilla/tests/css/border-image-linear-gradient-ref.html Normal file
View file

@ -0,0 +1,32 @@
<!DOCTYPE html>
<html lang="en-US">
<head>
<title>test of border-image-source: linear-gradient</title>
<style>
table { margin: 0; padding: 0; border-spacing: 0; empty-cells: show; }
td { padding: 0; }
</style>
</head>
<body>
<table>
<col style="width: 30px">
<col style="width: 90px">
<col style="width: 30px">
<tr style="height: 30px">
<td style="background-image: linear-gradient(red, #CC0033); background-size:30px 30px;"></td>
<td style="background-image: linear-gradient(red, #CC0033); background-size:90px 30px;"></td>
<td style="background-image: linear-gradient(red, #CC0033); background-size:30px 30px;"></td>
</tr>
<tr style="height: 90px">
<td style="background-image: linear-gradient(#CC0033, #3300CC); background-size:30px 90px;"></td>
<td style="background: white"></td>
<td style="background-image: linear-gradient(#CC0033, #3300CC); background-size:30px 90px;"></td>
</tr>
<tr style="height: 30px">
<td style="background-image: linear-gradient(#3300CC, blue); background-size:30px 30px;"></td>
<td style="background-image: linear-gradient(#3300CC, blue); background-size:90px 30px;"></td>
<td style="background-image: linear-gradient(#3300CC, blue); background-size:30px 30px;"></td>
</tr>
</table>
</body>
</html>

19
tests/wpt/mozilla/tests/css/border-image-linear-gradient.html Normal file
View file

@ -0,0 +1,19 @@
<!doctype html>
<meta charset="utf-8">
<link rel="match" href="border-image-linear-gradient-ref.html">
<html lang="en-US">
<head>
<title>test of border-image-source: linear-gradient</title>
<style>
div.border {
border: 30px solid black;
border-image: linear-gradient(red, blue) 10;
width: 90px;
height: 90px;
}
</style>
</head>
<body>
<div class="border"></div>
</body>
</html>