RGBCube/serenity
1
Fork 0
mirror of https://github.com/RGBCube/serenity synced 2025-07-27 15:07:45 +00:00
Code Issues Activity Actions

LibWeb: Apply the CSS transform-origin property

Browse source 
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
Download patch file Download diff file Expand all files Collapse all files

8
Userland/Libraries/LibWeb/CSS/ComputedValues.h
View file

@ -75,6 +75,11 @@ struct Transformation {
Vector<Variant<CSS::Length, float>> values;
};
struct TransformOrigin {
CSS::LengthPercentage x { Percentage(50) };
CSS::LengthPercentage y { Percentage(50) };
};
struct FlexBasisData {
CSS::FlexBasis type { CSS::FlexBasis::Auto };
Optional<CSS::LengthPercentage> length_percentage;
@ -169,6 +174,7 @@ public:
Optional<LengthPercentage> const& stroke_width() const { return m_inherited.stroke_width; }
Vector<CSS::Transformation> transformations() const { return m_noninherited.transformations; }
CSS::TransformOrigin transform_origin() const { return m_noninherited.transform_origin; }
float font_size() const { return m_inherited.font_size; }
int font_weight() const { return m_inherited.font_weight; }
@ -241,6 +247,7 @@ protected:
float opacity { InitialValues::opacity() };
Vector<BoxShadowData> box_shadow {};
Vector<CSS::Transformation> transformations {};
CSS::TransformOrigin transform_origin {};
CSS::BoxSizing box_sizing { InitialValues::box_sizing() };
CSS::ContentData content;
Variant<CSS::VerticalAlign, CSS::LengthPercentage> vertical_align { InitialValues::vertical_align() };
@ -304,6 +311,7 @@ public:
void set_justify_content(CSS::JustifyContent value) { m_noninherited.justify_content = value; }
void set_box_shadow(Vector<BoxShadowData>&& value) { m_noninherited.box_shadow = move(value); }
void set_transformations(Vector<CSS::Transformation> value) { m_noninherited.transformations = move(value); }
void set_transform_origin(CSS::TransformOrigin value) { m_noninherited.transform_origin = value; }
void set_box_sizing(CSS::BoxSizing value) { m_noninherited.box_sizing = value; }
void set_vertical_align(Variant<CSS::VerticalAlign, CSS::LengthPercentage> value) { m_noninherited.vertical_align = value; }
void set_visibility(CSS::Visibility value) { m_inherited.visibility = value; }

23
Userland/Libraries/LibWeb/CSS/StyleProperties.cpp
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);

1
Userland/Libraries/LibWeb/CSS/StyleProperties.h
View file

@ -77,6 +77,7 @@ public:
Variant<CSS::VerticalAlign, CSS::LengthPercentage> vertical_align() const;
Vector<CSS::Transformation> transformations() const;
CSS::TransformOrigin transform_origin() const;
Gfx::Font const& computed_font() const
{