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

Add remaining longhand flexbox style properties

Browse source 
Add the remaining longhand CSS properties of flexbox for servo,
including `flex-wrap`, `flex-grow`, `flex-shrink`, `justify-content`,
`align-items`, `align-self` and `align-content`.

tests for the remaining longhand properties are also enabled. Test for
default value of `align-self` is modified because the new default value
for this property is "auto" is current flexbox CR.
This commit is contained in:
Pu Xingyu 2016-05-06 08:10:43 +08:00
parent 52f17a8814
commit a7733b38d4
42 changed files with 44 additions and 111 deletions
Download patch file Download diff file Expand all files Collapse all files

9
components/layout/incremental.rs
View file

@ -219,8 +219,15 @@ pub fn compute_damage(old: Option<&Arc<ServoComputedValues>>, new: &ServoCompute
get_inheritedtable.border_spacing,
get_column.column_gap,
get_position.flex_direction,
get_position.flex_wrap,
get_position.justify_content,
get_position.align_items,
get_position.align_content,
get_position.order,
get_position.flex_basis,
get_position.order
get_position.flex_grow,
get_position.flex_shrink,
get_position.align_self
]) || add_if_not_equal!(old, new, damage,
[ REPAINT, STORE_OVERFLOW, REFLOW_OUT_OF_FLOW ], [
get_position.top, get_position.left,

16
components/script/dom/webidls/CSSStyleDeclaration.webidl
View file

@ -310,7 +310,21 @@ partial interface CSSStyleDeclaration {
[SetterThrows, TreatNullAs=EmptyString] attribute DOMString flexDirection;
[SetterThrows, TreatNullAs=EmptyString] attribute DOMString flex-direction;
[SetterThrows, TreatNullAs=EmptyString] attribute DOMString flexWrap;
[SetterThrows, TreatNullAs=EmptyString] attribute DOMString flex-wrap;
[SetterThrows, TreatNullAs=EmptyString] attribute DOMString justifyContent;
[SetterThrows, TreatNullAs=EmptyString] attribute DOMString justify-content;
[SetterThrows, TreatNullAs=EmptyString] attribute DOMString alignItems;
[SetterThrows, TreatNullAs=EmptyString] attribute DOMString align-items;
[SetterThrows, TreatNullAs=EmptyString] attribute DOMString alignContent;
[SetterThrows, TreatNullAs=EmptyString] attribute DOMString align-content;
[SetterThrows, TreatNullAs=EmptyString] attribute DOMString order;
[SetterThrows, TreatNullAs=EmptyString] attribute DOMString flexBasis;
[SetterThrows, TreatNullAs=EmptyString] attribute DOMString flex-basis;
[SetterThrows, TreatNullAs=EmptyString] attribute DOMString order;
[SetterThrows, TreatNullAs=EmptyString] attribute DOMString flexGrow;
[SetterThrows, TreatNullAs=EmptyString] attribute DOMString flex-grow;
[SetterThrows, TreatNullAs=EmptyString] attribute DOMString flexShrink;
[SetterThrows, TreatNullAs=EmptyString] attribute DOMString flex-shrink;
[SetterThrows, TreatNullAs=EmptyString] attribute DOMString alignSelf;
[SetterThrows, TreatNullAs=EmptyString] attribute DOMString align-self;
};

18
components/style/properties/longhand/position.mako.rs
View file

@ -61,12 +61,22 @@
// http://www.w3.org/TR/css3-flexbox/
// Flex container properties
${helpers.single_keyword("flex-direction", "row row-reverse column column-reverse", experimental=True)}
${helpers.single_keyword("flex-direction", "row row-reverse column column-reverse")}
${helpers.single_keyword("flex-wrap", "nowrap wrap wrap-reverse")}
${helpers.single_keyword("justify-content", "flex-start flex-end center space-between space-around")}
${helpers.single_keyword("align-items", "stretch flex-start flex-end center baseline")}
${helpers.single_keyword("align-content", "stretch flex-start flex-end center space-between space-around")}
// Flex item properties
${helpers.predefined_type("flex-grow", "Number", "0.0", "parse_non_negative", products="gecko")}
${helpers.predefined_type("flex-grow", "Number", "0.0", "parse_non_negative")}
${helpers.predefined_type("flex-shrink", "Number", "1.0", "parse_non_negative", products="gecko")}
${helpers.predefined_type("flex-shrink", "Number", "1.0", "parse_non_negative")}
${helpers.single_keyword("align-self", "auto stretch flex-start flex-end center baseline")}
// https://drafts.csswg.org/css-flexbox/#propdef-order
<%helpers:longhand name="order">
@ -94,8 +104,6 @@ ${helpers.predefined_type("flex-basis",
"LengthOrPercentageOrAutoOrContent",
"computed::LengthOrPercentageOrAutoOrContent::Auto")}
${helpers.single_keyword("flex-wrap", "nowrap wrap wrap-reverse", products="gecko")}
${helpers.predefined_type("width",
"LengthOrPercentageOrAuto",
"computed::LengthOrPercentageOrAuto::Auto",