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

layout: Implement outline-offset per CSS-UI-3 § 5.5.

Browse source
This commit is contained in:
Patrick Walton 2015-01-01 13:27:50 -05:00
parent a88e668091
commit af7cf26e76
6 changed files with 62 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

9
components/layout/display_list_builder.rs
View file

@ -569,10 +569,11 @@ impl FragmentDisplayListBuilding for Fragment {
// Outlines are not accounted for in the dimensions of the border box, so adjust the // Outlines are not accounted for in the dimensions of the border box, so adjust the
// absolute bounds. // absolute bounds.
let mut bounds = *bounds; let mut bounds = *bounds;
bounds.origin.x = bounds.origin.x - width; let offset = width + style.get_outline().outline_offset;
bounds.origin.y = bounds.origin.y - width; bounds.origin.x = bounds.origin.x - offset;
bounds.size.width = bounds.size.width + width + width; bounds.origin.y = bounds.origin.y - offset;
bounds.size.height = bounds.size.height + width + width; bounds.size.width = bounds.size.width + offset + offset;
bounds.size.height = bounds.size.height + offset + offset;
// Append the outline to the display list. // Append the outline to the display list.
let color = style.resolve_color(style.get_outline().outline_color).to_gfx_color(); let color = style.resolve_color(style.get_outline().outline_color).to_gfx_color();

8
components/style/properties/common_types.rs
View file

@ -933,6 +933,14 @@ pub mod computed {
} }
} }
} }
#[allow(non_snake_case)]
#[inline]
pub fn compute_Length(value: specified::Length, context: &Context) -> Au {
compute_Au(value, context)
}
pub type Length = Au;
} }
pub fn parse_url(input: &str, base_url: &Url) -> Url { pub fn parse_url(input: &str, base_url: &Url) -> Url {

2
components/style/properties/mod.rs.mako
View file

@ -381,6 +381,8 @@ pub mod longhands {
} }
</%self:longhand> </%self:longhand>
${predefined_type("outline-offset", "Length", "Au(0)")}
${new_style_struct("PositionOffsets", is_inherited=False)} ${new_style_struct("PositionOffsets", is_inherited=False)}
% for side in ["top", "right", "bottom", "left"]: % for side in ["top", "right", "bottom", "left"]:

1
tests/ref/basic.list
View file

@ -225,3 +225,4 @@ fragment=top != ../html/acid2.html acid2_ref.html
== stacking_context_overflow_a.html stacking_context_overflow_ref.html == stacking_context_overflow_a.html stacking_context_overflow_ref.html
== stacking_context_overflow_relative_outline_a.html stacking_context_overflow_relative_outline_ref.html == stacking_context_overflow_relative_outline_a.html stacking_context_overflow_relative_outline_ref.html
== word_break_a.html word_break_ref.html == word_break_a.html word_break_ref.html
== outline_offset_a.html outline_offset_ref.html

22
tests/ref/outline_offset_a.html Normal file
View file

@ -0,0 +1,22 @@
<!DOCTYPE html>
<html>
<head>
<style>
html, body {
margin: 0;
}
section {
background: red;
outline: solid green 32px;
outline-offset: 32px;
width: 32px;
height: 32px;
margin: 64px;
}
</style>
</head>
<body>
<section></section>
</body>
</html>

24
tests/ref/outline_offset_ref.html Normal file
View file

@ -0,0 +1,24 @@
<!DOCTYPE html>
<html>
<head>
<style>
html, body {
margin: 0;
}
section {
border: solid green 32px;
width: 96px;
}
div {
width: 32px;
height: 32px;
border: solid white 32px;
background: red;
}
</style>
</head>
<body>
<section><div></div></section>
</body>
</html>