auto merge of #4324 : Adenilson/servo/grooveBorderColor01, r=pcwalton

Groove and Ridge rendering shows a solid border when color is black, that is broken and the current patch will implement a similar behavior as Firefox.
This commit is contained in:
bors-servo 2014-12-12 15:30:56 -07:00
commit e74a57821f
5 changed files with 80 additions and 3 deletions

View file

@ -598,10 +598,22 @@ impl<'a> PaintContext<'a> {
border_style::ridge => false,
_ => panic!("invalid border style")
};
let darker_color = self.scale_color(color, if is_groove { 1.0/3.0 } else { 2.0/3.0 });
let mut lighter_color;
let mut darker_color;
if color.r != 0.0 || color.g != 0.0 || color.b != 0.0 {
darker_color = self.scale_color(color, if is_groove { 1.0/3.0 } else { 2.0/3.0 });
lighter_color = color;
} else {
// You can't scale black color (i.e. 'scaled = 0 * scale', equals black).
darker_color = Color::new(0.3, 0.3, 0.3, color.a);
lighter_color = Color::new(0.7, 0.7, 0.7, color.a);
}
let (outer_color, inner_color) = match (direction, is_groove) {
(Top, true) | (Left, true) | (Right, false) | (Bottom, false) => (darker_color, color),
(Top, false) | (Left, false) | (Right, true) | (Bottom, true) => (color, darker_color)
(Top, true) | (Left, true) | (Right, false) | (Bottom, false) => (darker_color, lighter_color),
(Top, false) | (Left, false) | (Right, true) | (Bottom, true) => (lighter_color, darker_color)
};
// outer portion of the border
self.draw_border_path(&original_bounds, direction, scaled_border, radius, outer_color);

View file

@ -194,3 +194,6 @@ fragment=top != ../html/acid2.html acid2_ref.html
== outlines_simple_a.html outlines_simple_ref.html
== outlines_wrap_a.html outlines_wrap_ref.html
== letter_spacing_a.html letter_spacing_ref.html
!= border_black_groove.html border_black_solid.html
!= border_black_ridge.html border_black_solid.html
!= border_black_ridge.html border_black_groove.html

View file

@ -0,0 +1,21 @@
<!DOCTYPE html>
<html>
<head>
<style>
.box {
width: 100px;
height: 100px;
margin: 10px;
border-width: 20px;
border-color: black;
border-style: groove;
}
</style>
</head>
<body>
<!-- Test mixed border styles. Expect a square with borders with
2 colors (dark/lighter), it fails if it has a solid dark border.
-->
<div class="box"></div>
</body>
</html>

View file

@ -0,0 +1,21 @@
<!DOCTYPE html>
<html>
<head>
<style>
.box {
width: 100px;
height: 100px;
margin: 10px;
border-width: 20px;
border-color: black;
border-style: ridge;
}
</style>
</head>
<body>
<!-- Test mixed border styles. Expect a square with borders with
2 colors (lighter/dark), it fails if it has a solid dark border.
-->
<div class="box"></div>
</body>
</html>

View file

@ -0,0 +1,20 @@
<!DOCTYPE html>
<html>
<head>
<style>
.box {
width: 100px;
height: 100px;
margin: 10px;
border-width: 20px;
border-color: black;
border-style: solid;
}
</style>
</head>
<body>
<!-- Test mixed border styles. Expect a square with solid dark border.
-->
<div class="box"></div>
</body>
</html>