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

auto merge of #4393 : Adenilson/servo/fixInsetOutsetColor01, r=pcwalton

Browse source
This commit is contained in:
bors-servo 2014-12-16 17:03:43 -07:00
commit df4c3ff284
8 changed files with 140 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

3
components/gfx/paint_context.rs
View file

@ -642,8 +642,7 @@ impl<'a> PaintContext<'a> {
let original_bounds = self.get_scaled_bounds(bounds, border, 0.0); let original_bounds = self.get_scaled_bounds(bounds, border, 0.0);
// select and scale the color appropriately. // select and scale the color appropriately.
let scaled_color = match direction { let scaled_color = match direction {
Top => self.scale_color(color, if is_inset { 2.0/3.0 } else { 1.0 }), Top | Left => self.scale_color(color, if is_inset { 2.0/3.0 } else { 1.0 }),
Left => self.scale_color(color, if is_inset { 1.0/6.0 } else { 0.5 }),
Right | Bottom => self.scale_color(color, if is_inset { 1.0 } else { 2.0/3.0 }) Right | Bottom => self.scale_color(color, if is_inset { 1.0 } else { 2.0/3.0 })
}; };
self.draw_border_path(&original_bounds, direction, border, radius, scaled_color); self.draw_border_path(&original_bounds, direction, border, radius, scaled_color);

2
tests/ref/basic.list
View file

@ -213,3 +213,5 @@ fragment=top != ../html/acid2.html acid2_ref.html
== table_colspan_fixed_a.html table_colspan_fixed_ref.html == table_colspan_fixed_a.html table_colspan_fixed_ref.html
== legacy_td_bgcolor_attribute_a.html legacy_td_bgcolor_attribute_ref.html == legacy_td_bgcolor_attribute_a.html legacy_td_bgcolor_attribute_ref.html
== legacy_table_border_attribute_a.html legacy_table_border_attribute_ref.html == legacy_table_border_attribute_a.html legacy_table_border_attribute_ref.html
== inset.html inset_ref.html
== outset.html outset_ref.html

53
tests/ref/inset.html Normal file
View file

@ -0,0 +1,53 @@
<!DOCTYPE html>
<html>
<head>
<style>
body {
margin: 0px;
}
.test {
color: #f0f;
}
.inset {
border: 10px inset;
width: 100px;
height: 100px;
line-height: 100px;
text-align: center;
}
.hack1 {
width: 20px;
height: 20px;
background-color: white;
border-color: white;
border-style: solid;
position: relative;
top: -20px;
right: 8px;
}
.hack2 {
width: 20px;
height: 20px;
background-color: white;
border-color: white;
border-style: solid;
position: relative;
top: -155px;
right: -100px;
}
</style>
</head>
<body>
<section class="test">
<div class="inset"></div>
</section>
<div class="hack1"></div>
<div class="hack2"></div>
</body>
</html>

BIN
tests/ref/inset.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 315 B

13
tests/ref/inset_ref.html Normal file
View file

@ -0,0 +1,13 @@
<!DOCTYPE html>
<html>
<style>
img {
position: absolute;
left: 0px;
top: 0px;
}
</style>
<body>
<img src="inset.png"/>
</body>
</html>

52
tests/ref/outset.html Normal file
View file

@ -0,0 +1,52 @@
<!DOCTYPE html>
<html>
<head>
<style>
body {
margin: 0px;
}
.test {
color: #f0f;
}
.outset {
border: 10px outset;
width: 100px;
height: 100px;
line-height: 100px;
text-align: center;
}
.hack1 {
width: 20px;
height: 20px;
background-color: white;
border-color: white;
border-style: solid;
position: relative;
top: -20px;
right: 8px;
}
.hack2 {
width: 20px;
height: 20px;
background-color: white;
border-color: white;
border-style: solid;
position: relative;
top: -155px;
right: -100px;
}
</style>
</head>
<body>
<section class="test">
<div class="outset"></div>
</section>
<div class="hack1"></div>
<div class="hack2"></div>
</body>
</html>

BIN
tests/ref/outset.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 312 B

19
tests/ref/outset_ref.html Normal file
View file

@ -0,0 +1,19 @@
<!DOCTYPE html>
<html>
<style>
html {
margin: 0;
padding: 0;
background-color: white;
border: none;
}
body {
margin: 0;
padding: 0;
border: none;
}
</style>
<body>
<img src="outset.png"/>
</body>
</html>