1
Fork 0
mirror of https://github.com/RGBCube/serenity synced 2025-07-25 17:17:44 +00:00

LibWeb: Apply the CSS transform-origin property

We don't have transform-box yet, so this applies to the border-box
for now.

This also makes us pass a couple Web Platform Tests as well :^)
For example:
https://wpt.live/css/css-transforms/css3-transform-scale-002.html
This commit is contained in:
Simon Wanner 2022-03-21 19:38:00 +01:00 committed by Andreas Kling
parent 63055ff5ad
commit 145efbe07a
6 changed files with 46 additions and 4 deletions

View file

@ -347,6 +347,29 @@ Vector<CSS::Transformation> StyleProperties::transformations() const
return transformations;
}
static Optional<LengthPercentage> length_percentage_for_style_value(StyleValue const& value)
{
if (value.is_length())
return value.to_length();
if (value.is_percentage())
return value.as_percentage().percentage();
return {};
}
CSS::TransformOrigin StyleProperties::transform_origin() const
{
auto value = property(CSS::PropertyID::TransformOrigin);
if (!value.has_value() || !value.value()->is_value_list() || value.value()->as_value_list().size() != 2)
return {};
auto const& list = value.value()->as_value_list();
auto x_value = length_percentage_for_style_value(list.values()[0]);
auto y_value = length_percentage_for_style_value(list.values()[1]);
if (!x_value.has_value() || !y_value.has_value()) {
return {};
}
return { x_value.value(), y_value.value() };
}
Optional<CSS::AlignItems> StyleProperties::align_items() const
{
auto value = property(CSS::PropertyID::AlignItems);