Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(379)

Side by Side Diff: third_party/WebKit/LayoutTests/fast/gradients/css3-radial-gradients.html

Issue 2746583003: Send deprecation messages for prefixed gradients now that it's possible. (Closed)
Patch Set: recommit Created 3 years, 7 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 2
3 <html> 3 <html>
4 <head> 4 <head>
5 <style type="text/css" media="screen"> 5 <style type="text/css" media="screen">
6 .box { 6 .box {
7 display: inline-block; 7 display: inline-block;
8 height: 120px; 8 height: 120px;
9 width: 200px; 9 width: 200px;
10 margin: 10px; 10 margin: 10px;
11 border: 1px solid black; 11 border: 1px solid black;
12 background-repeat: no-repeat; 12 background-repeat: no-repeat;
13 } 13 }
14 14
15 .gradient1 { 15 .gradient1 {
16 background-image: -webkit-radial-gradient(ellipse closest-corner, white, b lack); 16 background-image: radial-gradient(ellipse closest-corner, white, black);
17 background-image: -moz-radial-gradient(ellipse closest-corner, white, blac k);
18 } 17 }
19 18
20 .gradient2 { 19 .gradient2 {
21 background-image: -webkit-radial-gradient(50px 50%, circle closest-side, w hite, black); 20 background-image: radial-gradient(circle closest-side at 50px 50%, white, black);
22 background-image: -moz-radial-gradient(50px 50%, circle closest-side, whit e, black);
23 } 21 }
24 22
25 .gradient3 { 23 .gradient3 {
26 background-image: -webkit-radial-gradient(20px 50px, ellipse closest-corne r, white, black); 24 background-image: radial-gradient(ellipse closest-corner at 20px 50px, whi te, black);
27 background-image: -moz-radial-gradient(20px 50px, ellipse closest-corner, white, black);
28 } 25 }
29 26
30 .gradient4 { 27 .gradient4 {
31 background-image: -webkit-radial-gradient(20% 20%, circle closest-corner, white, black); 28 background-image: radial-gradient(circle closest-corner at 20% 20%, white, black);
32 background-image: -moz-radial-gradient(20% 20%, circle closest-corner, whi te, black);
33 } 29 }
34 30
35 .gradient5 { 31 .gradient5 {
36 background-image: -webkit-radial-gradient(circle cover, red, green, blue); 32 background-image: radial-gradient(circle farthest-corner, red, green, blue );
37 background-image: -moz-radial-gradient(circle cover, red, green, blue);
38 } 33 }
39 34
40 .gradient6 { 35 .gradient6 {
41 background-image: -webkit-radial-gradient(left, circle cover, red, green 3 0%, blue); 36 background-image: radial-gradient(circle farthest-corner at left, red, gre en 30%, blue);
42 background-image: -moz-radial-gradient(left, circle cover, red, green 30%, blue);
43 } 37 }
44 38
45 .gradient7 { 39 .gradient7 {
46 background-image: -webkit-radial-gradient(ellipse cover, red, green 80px, blue); 40 background-image: radial-gradient(ellipse farthest-corner, red, green 80px , blue);
47 background-image: -moz-radial-gradient(ellipse cover, red, green 80px, blu e);
48 } 41 }
49 42
50 .gradient8 { 43 .gradient8 {
51 background-image: -webkit-radial-gradient(circle cover, red 20%, green, bl ue 150%); 44 background-image: radial-gradient(circle farthest-corner, red 20%, green, blue 150%);
52 background-image: -moz-radial-gradient(circle cover, red 20%, green, blue 150%);
53 } 45 }
54 46
55 .gradient9 { 47 .gradient9 {
56 background-image: -webkit-radial-gradient(20% 20%, circle closest-corner, red -50%, green, blue 150%); 48 background-image: radial-gradient(circle closest-corner at 20% 20%, red -5 0%, green, blue 150%);
57 background-image: -moz-radial-gradient(20% 20%, circle closest-corner, red -50%, green, blue 150%);
58 } 49 }
59 50
60 </style> 51 </style>
61 <script type="text/javascript" charset="utf-8"> 52 <script type="text/javascript" charset="utf-8">
62 if (window.testRunner) { 53 if (window.testRunner) {
63 testRunner.dumpAsTextWithPixelResults(); 54 testRunner.dumpAsTextWithPixelResults();
64 } 55 }
65 </script> 56 </script>
66 </head> 57 </head>
67 <body> 58 <body>
68 59
69 <div class="gradient1 box"></div> 60 <div class="gradient1 box"></div>
70 <div class="gradient2 box"></div> 61 <div class="gradient2 box"></div>
71 <div class="gradient3 box"></div> 62 <div class="gradient3 box"></div>
72 <br> 63 <br>
73 <div class="gradient4 box"></div> 64 <div class="gradient4 box"></div>
74 <div class="gradient5 box"></div> 65 <div class="gradient5 box"></div>
75 <div class="gradient6 box"></div> 66 <div class="gradient6 box"></div>
76 <br> 67 <br>
77 <div class="gradient7 box"></div> 68 <div class="gradient7 box"></div>
78 <div class="gradient8 box"></div> 69 <div class="gradient8 box"></div>
79 <div class="gradient9 box"></div> 70 <div class="gradient9 box"></div>
80 71
81 </body> 72 </body>
82 </html> 73 </html>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698