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

gfx: Add elliptical border-radius shorthand parsing

Browse source 
Adds elliptical border-radius shorthand parsing, e.g.:

    /* The syntax of the second radius allows one to four values */
    /* (first radius values) / radius */
    border-radius: 10px 5% / 20px;

    /* (first radius values) / top-left-and-bottom-right | top-right-and-bottom-left */
    border-radius: 10px 5% / 20px 30px;

    /* (first radius values) / top-left | top-right-and-bottom-left | bottom-right */
    border-radius: 10px 5px 2em / 20px 25px 30%;

    /* (first radius values) / top-left | top-right | bottom-right | bottom-left */
    border-radius: 10px 5% / 20px 25em 30px 35em;
This commit is contained in:
Bryan Bell 2015-09-15 13:27:30 -07:00
parent 67cf241acd
commit 48f1159845
5 changed files with 83 additions and 27 deletions
Download patch file Download diff file Expand all files Collapse all files

26
components/style/properties.mako.rs
View file

@ -5135,16 +5135,18 @@ pub mod shorthands {
'border-%s-radius' % (corner)
for corner in ['top-left', 'top-right', 'bottom-right', 'bottom-left']
)}">
use util::geometry::Au;
use values::specified::{Length, LengthOrPercentage};
use values::specified::BorderRadiusSize;
let _ignored = context;
fn parse_one_set_of_border_radii(mut input: &mut Parser)
-> Result<[BorderRadiusSize; 4], ()> {
fn parse_one_set_of_border_values(mut input: &mut Parser)
-> Result<[LengthOrPercentage; 4], ()> {
let mut count = 0;
let mut values = [BorderRadiusSize::zero(); 4];
let mut values = [LengthOrPercentage::Length(Length::Absolute(Au(0))); 4];
while count < 4 {
if let Ok(value) = input.try(BorderRadiusSize::parse_one_radii) {
if let Ok(value) = input.try(LengthOrPercentage::parse) {
values[count] = value;
count += 1;
} else {
@ -5161,9 +5163,21 @@ pub mod shorthands {
}
}
let radii = try!(parse_one_set_of_border_radii(input));
// TODO(bjwbell): Finish parsing code for elliptical borders.
fn parse_one_set_of_border_radii(mut input: &mut Parser)
-> Result<[BorderRadiusSize; 4], ()> {
let widths = try!(parse_one_set_of_border_values(input));
let mut heights = widths.clone();
let mut radii_values = [BorderRadiusSize::zero(); 4];
if input.try(|input| input.expect_delim('/')).is_ok() {
heights = try!(parse_one_set_of_border_values(input));
}
for i in 0..radii_values.len() {
radii_values[i] = BorderRadiusSize::new(widths[i], heights[i]);
}
Ok(radii_values)
}
let radii = try!(parse_one_set_of_border_radii(input));
Ok(Longhands {
border_top_left_radius: Some(radii[0]),
border_top_right_radius: Some(radii[1]),

36
components/style/values.rs
View file

@ -842,6 +842,21 @@ pub mod specified {
let zero = LengthOrPercentage::Length(Length::Absolute(Au(0)));
BorderRadiusSize(Size2D::new(zero, zero))
}
pub fn new(width: LengthOrPercentage, height: LengthOrPercentage) -> BorderRadiusSize {
BorderRadiusSize(Size2D::new(width, height))
}
pub fn circle(radius: LengthOrPercentage) -> BorderRadiusSize {
BorderRadiusSize(Size2D::new(radius, radius))
}
#[inline]
pub fn parse(input: &mut Parser) -> Result<BorderRadiusSize, ()> {
let first = try!(LengthOrPercentage::parse_non_negative(input));
let second = input.try(LengthOrPercentage::parse_non_negative).unwrap_or(first);
Ok(BorderRadiusSize(Size2D::new(first, second)))
}
}
impl ToCss for BorderRadiusSize {
@ -852,27 +867,6 @@ pub mod specified {
size.height.to_css(dest)
}
}
impl BorderRadiusSize {
pub fn circle(radius: LengthOrPercentage) -> BorderRadiusSize {
BorderRadiusSize(Size2D::new(radius, radius))
}
pub fn parse_one_radii(input: &mut Parser) -> Result<BorderRadiusSize, ()> {
if let Ok(first) = LengthOrPercentage::parse_non_negative(input) {
Ok(BorderRadiusSize(Size2D::new(first, first)))
} else {
Err(())
}
}
#[allow(dead_code)]
#[inline]
pub fn parse(input: &mut Parser) -> Result<BorderRadiusSize, ()> {
let first = try!(LengthOrPercentage::parse_non_negative(input));
let second = input.try(LengthOrPercentage::parse_non_negative).unwrap_or(first);
Ok(BorderRadiusSize(Size2D::new(first, second)))
}
}
// http://dev.w3.org/csswg/css2/colors.html#propdef-background-position
#[derive(Clone, PartialEq, Copy)]

1
tests/ref/basic.list
View file

@ -68,6 +68,7 @@ flaky_cpu == append_style_a.html append_style_b.html
!= border_radius_dashed_a.html border_radius_dashed_ref.html
== border_radius_elliptical_a.html border_radius_elliptical_ref.html
== border_radius_overlapping_a.html border_radius_overlapping_ref.html
== border_radius_shorthand_a.html border_radius_shorthand_ref.html
== border_rounding_1px_invisible_issue_7184_a.html border_rounding_1px_invisible_issue_7184_ref.html
== border_spacing_a.html border_spacing_ref.html
== border_spacing_auto_layout_a.html border_spacing_ref.html

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

@ -0,0 +1,22 @@
<!DOCTYPE html>
<html>
<head>
<meta content="text/html;charset=utf-8" http-equiv="Content-Type">
<meta content="utf-8" http-equiv="encoding">
<style type="text/css">
div.box {
background: white;
border-width: 15px 15px 15px 15px;
border-color: yellow red green blue;
border-style: solid;
border-radius: 100px 150px / 50px 100px 200px;
height: 500px;
width: 500px;
}
</style>
</head>
<body>
<h2>Shorthand Border Radius - Elliptical</h2>
<div class="box"></div><br>
</body>
</html>

25
tests/ref/border_radius_shorthand_ref.html Normal file
View file

@ -0,0 +1,25 @@
<!DOCTYPE html>
<html>
<head>
<meta content="text/html;charset=utf-8" http-equiv="Content-Type">
<meta content="utf-8" http-equiv="encoding">
<style type="text/css">
div.box {
background: white;
border-width: 15px 15px 15px 15px;
border-color: yellow red green blue;
border-style: solid;
border-top-left-radius: 100px 50px;
border-top-right-radius: 150px 100px;
border-bottom-right-radius: 100px 200px;
border-bottom-left-radius: 150px 100px;
height: 500px;
width: 500px;
}
</style>
</head>
<body>
<h2>Shorthand Border Radius - Elliptical</h2>
<div class="box"></div><br>
</body>
</html>