mirror of
https://github.com/servo/servo.git
synced 2025-07-30 02:30:21 +01:00
Add style property for flex-basis
Add the style property for flex-basis. The property should allow all values acceptable for `width`|`height` with the addition of `content`.
This commit is contained in:
parent
1946c71a96
commit
2d9d31ee04
8 changed files with 117 additions and 18 deletions
|
@ -218,7 +218,9 @@ pub fn compute_damage(old: Option<&Arc<ServoComputedValues>>, new: &ServoCompute
|
||||||
get_inheritedtable.border_collapse,
|
get_inheritedtable.border_collapse,
|
||||||
get_inheritedtable.border_spacing,
|
get_inheritedtable.border_spacing,
|
||||||
get_column.column_gap,
|
get_column.column_gap,
|
||||||
get_position.flex_direction
|
get_position.flex_direction,
|
||||||
|
get_position.flex_basis,
|
||||||
|
get_position.order
|
||||||
]) || add_if_not_equal!(old, new, damage,
|
]) || add_if_not_equal!(old, new, damage,
|
||||||
[ REPAINT, STORE_OVERFLOW, REFLOW_OUT_OF_FLOW ], [
|
[ REPAINT, STORE_OVERFLOW, REFLOW_OUT_OF_FLOW ], [
|
||||||
get_position.top, get_position.left,
|
get_position.top, get_position.left,
|
||||||
|
|
|
@ -310,5 +310,7 @@ partial interface CSSStyleDeclaration {
|
||||||
|
|
||||||
[SetterThrows, TreatNullAs=EmptyString] attribute DOMString flexDirection;
|
[SetterThrows, TreatNullAs=EmptyString] attribute DOMString flexDirection;
|
||||||
[SetterThrows, TreatNullAs=EmptyString] attribute DOMString flex-direction;
|
[SetterThrows, TreatNullAs=EmptyString] attribute DOMString flex-direction;
|
||||||
|
[SetterThrows, TreatNullAs=EmptyString] attribute DOMString flexBasis;
|
||||||
|
[SetterThrows, TreatNullAs=EmptyString] attribute DOMString flex-basis;
|
||||||
[SetterThrows, TreatNullAs=EmptyString] attribute DOMString order;
|
[SetterThrows, TreatNullAs=EmptyString] attribute DOMString order;
|
||||||
};
|
};
|
||||||
|
|
|
@ -4360,6 +4360,9 @@ pub mod longhands {
|
||||||
}
|
}
|
||||||
</%helpers:longhand>
|
</%helpers:longhand>
|
||||||
|
|
||||||
|
${helpers.predefined_type("flex-basis", "LengthOrPercentageOrAutoOrContent",
|
||||||
|
"computed::LengthOrPercentageOrAutoOrContent::Auto")}
|
||||||
|
|
||||||
${helpers.single_keyword("flex-wrap", "nowrap wrap wrap-reverse", products="gecko")}
|
${helpers.single_keyword("flex-wrap", "nowrap wrap wrap-reverse", products="gecko")}
|
||||||
|
|
||||||
// SVG 1.1 (Second Edition)
|
// SVG 1.1 (Second Edition)
|
||||||
|
|
|
@ -1050,6 +1050,50 @@ pub mod specified {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#[derive(Clone, PartialEq, Copy, Debug, HeapSizeOf)]
|
||||||
|
pub enum LengthOrPercentageOrAutoOrContent {
|
||||||
|
Length(Length),
|
||||||
|
Percentage(Percentage),
|
||||||
|
Calc(CalcLengthOrPercentage),
|
||||||
|
Auto,
|
||||||
|
Content
|
||||||
|
}
|
||||||
|
|
||||||
|
impl ToCss for LengthOrPercentageOrAutoOrContent {
|
||||||
|
fn to_css<W>(&self, dest: &mut W) -> fmt::Result where W: fmt::Write {
|
||||||
|
match *self {
|
||||||
|
LengthOrPercentageOrAutoOrContent::Length(len) => len.to_css(dest),
|
||||||
|
LengthOrPercentageOrAutoOrContent::Percentage(perc) => perc.to_css(dest),
|
||||||
|
LengthOrPercentageOrAutoOrContent::Auto => dest.write_str("auto"),
|
||||||
|
LengthOrPercentageOrAutoOrContent::Content => dest.write_str("content"),
|
||||||
|
LengthOrPercentageOrAutoOrContent::Calc(calc) => calc.to_css(dest),
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
impl LengthOrPercentageOrAutoOrContent {
|
||||||
|
pub fn parse(input: &mut Parser) -> Result<LengthOrPercentageOrAutoOrContent, ()> {
|
||||||
|
let context = AllowedNumericType::NonNegative;
|
||||||
|
match try!(input.next()) {
|
||||||
|
Token::Dimension(ref value, ref unit) if context.is_ok(value.value) =>
|
||||||
|
Length::parse_dimension(value.value, unit).map(LengthOrPercentageOrAutoOrContent::Length),
|
||||||
|
Token::Percentage(ref value) if context.is_ok(value.unit_value) =>
|
||||||
|
Ok(LengthOrPercentageOrAutoOrContent::Percentage(Percentage(value.unit_value))),
|
||||||
|
Token::Number(ref value) if value.value == 0. =>
|
||||||
|
Ok(LengthOrPercentageOrAutoOrContent::Length(Length::Absolute(Au(0)))),
|
||||||
|
Token::Ident(ref value) if value.eq_ignore_ascii_case("auto") =>
|
||||||
|
Ok(LengthOrPercentageOrAutoOrContent::Auto),
|
||||||
|
Token::Ident(ref value) if value.eq_ignore_ascii_case("content") =>
|
||||||
|
Ok(LengthOrPercentageOrAutoOrContent::Content),
|
||||||
|
Token::Function(ref name) if name.eq_ignore_ascii_case("calc") => {
|
||||||
|
let calc = try!(input.parse_nested_block(CalcLengthOrPercentage::parse_length_or_percentage));
|
||||||
|
Ok(LengthOrPercentageOrAutoOrContent::Calc(calc))
|
||||||
|
},
|
||||||
|
_ => Err(())
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
#[derive(Clone, PartialEq, Copy, Debug, HeapSizeOf)]
|
#[derive(Clone, PartialEq, Copy, Debug, HeapSizeOf)]
|
||||||
pub struct BorderRadiusSize(pub Size2D<LengthOrPercentage>);
|
pub struct BorderRadiusSize(pub Size2D<LengthOrPercentage>);
|
||||||
|
|
||||||
|
@ -1771,6 +1815,64 @@ pub mod computed {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#[derive(PartialEq, Clone, Copy, HeapSizeOf)]
|
||||||
|
pub enum LengthOrPercentageOrAutoOrContent {
|
||||||
|
Length(Au),
|
||||||
|
Percentage(CSSFloat),
|
||||||
|
Calc(CalcLengthOrPercentage),
|
||||||
|
Auto,
|
||||||
|
Content
|
||||||
|
}
|
||||||
|
impl fmt::Debug for LengthOrPercentageOrAutoOrContent {
|
||||||
|
fn fmt(&self, f: &mut fmt::Formatter) -> fmt::Result {
|
||||||
|
match *self {
|
||||||
|
LengthOrPercentageOrAutoOrContent::Length(length) => write!(f, "{:?}", length),
|
||||||
|
LengthOrPercentageOrAutoOrContent::Percentage(percentage) => write!(f, "{}%", percentage * 100.),
|
||||||
|
LengthOrPercentageOrAutoOrContent::Calc(calc) => write!(f, "{:?}", calc),
|
||||||
|
LengthOrPercentageOrAutoOrContent::Auto => write!(f, "auto"),
|
||||||
|
LengthOrPercentageOrAutoOrContent::Content => write!(f, "content")
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
impl ToComputedValue for specified::LengthOrPercentageOrAutoOrContent {
|
||||||
|
type ComputedValue = LengthOrPercentageOrAutoOrContent;
|
||||||
|
|
||||||
|
#[inline]
|
||||||
|
fn to_computed_value<Cx: TContext>(&self, context: &Cx) -> LengthOrPercentageOrAutoOrContent {
|
||||||
|
match *self {
|
||||||
|
specified::LengthOrPercentageOrAutoOrContent::Length(value) => {
|
||||||
|
LengthOrPercentageOrAutoOrContent::Length(value.to_computed_value(context))
|
||||||
|
},
|
||||||
|
specified::LengthOrPercentageOrAutoOrContent::Percentage(value) => {
|
||||||
|
LengthOrPercentageOrAutoOrContent::Percentage(value.0)
|
||||||
|
},
|
||||||
|
specified::LengthOrPercentageOrAutoOrContent::Calc(calc) => {
|
||||||
|
LengthOrPercentageOrAutoOrContent::Calc(calc.to_computed_value(context))
|
||||||
|
},
|
||||||
|
specified::LengthOrPercentageOrAutoOrContent::Auto => {
|
||||||
|
LengthOrPercentageOrAutoOrContent::Auto
|
||||||
|
},
|
||||||
|
specified::LengthOrPercentageOrAutoOrContent::Content => {
|
||||||
|
LengthOrPercentageOrAutoOrContent::Content
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
impl ::cssparser::ToCss for LengthOrPercentageOrAutoOrContent {
|
||||||
|
fn to_css<W>(&self, dest: &mut W) -> fmt::Result where W: fmt::Write {
|
||||||
|
match *self {
|
||||||
|
LengthOrPercentageOrAutoOrContent::Length(length) => length.to_css(dest),
|
||||||
|
LengthOrPercentageOrAutoOrContent::Percentage(percentage)
|
||||||
|
=> write!(dest, "{}%", percentage * 100.),
|
||||||
|
LengthOrPercentageOrAutoOrContent::Calc(calc) => calc.to_css(dest),
|
||||||
|
LengthOrPercentageOrAutoOrContent::Auto => dest.write_str("auto"),
|
||||||
|
LengthOrPercentageOrAutoOrContent::Content => dest.write_str("content")
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
#[derive(PartialEq, Clone, Copy, HeapSizeOf)]
|
#[derive(PartialEq, Clone, Copy, HeapSizeOf)]
|
||||||
pub enum LengthOrPercentageOrNone {
|
pub enum LengthOrPercentageOrNone {
|
||||||
Length(Au),
|
Length(Au),
|
||||||
|
|
|
@ -5,24 +5,23 @@
|
||||||
<link href="reference/ref-pass-body.htm" rel="match">
|
<link href="reference/ref-pass-body.htm" rel="match">
|
||||||
<meta content="dom" name="flags">
|
<meta content="dom" name="flags">
|
||||||
<style>
|
<style>
|
||||||
html {
|
body {
|
||||||
display: flex;
|
display: flex;
|
||||||
width: 100px;
|
width: 100px;
|
||||||
}
|
}
|
||||||
body {
|
div {
|
||||||
color: red;
|
color: red;
|
||||||
margin: 0;
|
|
||||||
flex-basis: 100%;
|
flex-basis: 100%;
|
||||||
}
|
}
|
||||||
.PASS {color: black;}
|
.PASS {color: black;}
|
||||||
</style>
|
</style>
|
||||||
</head><body><h1>FAIL, enable javascript</h1>
|
</head><body><div id="test"><h1>FAIL, enable javascript</h1>
|
||||||
<script>
|
<script>
|
||||||
var body = document.body;
|
var test = document.getElementById("test");
|
||||||
|
|
||||||
var passed =
|
var passed =
|
||||||
getComputedStyle(body).getPropertyValue("flex-basis") ==
|
getComputedStyle(test).getPropertyValue("flex-basis") ==
|
||||||
"100%";
|
"100%";
|
||||||
body.textContent = body.className = passed ? "PASS" : "FAIL";
|
test.textContent = test.className = passed ? "PASS" : "FAIL";
|
||||||
</script>
|
</script>
|
||||||
</body></html>
|
</body></html>
|
||||||
|
|
|
@ -1,3 +0,0 @@
|
||||||
[flexbox_computedstyle_flex-basis-0.htm]
|
|
||||||
type: reftest
|
|
||||||
expected: FAIL
|
|
|
@ -1,3 +0,0 @@
|
||||||
[flexbox_computedstyle_flex-basis-auto.htm]
|
|
||||||
type: reftest
|
|
||||||
expected: FAIL
|
|
|
@ -1,3 +0,0 @@
|
||||||
[flexbox_computedstyle_flex-basis-percent.htm]
|
|
||||||
type: reftest
|
|
||||||
expected: FAIL
|
|
Loading…
Add table
Add a link
Reference in a new issue