RGBCube/serenity
1
Fork 0
mirror of https://github.com/RGBCube/serenity synced 2025-07-26 16:37:47 +00:00
Code Issues Activity Actions

LibWeb: Support x and y attributes on nested SVGs

Browse source 
This allows positioning a child SVG relative to its parent SVG.

Note: These have been implemented as CSS properties as in SVG 2, these
are geometry properties that can be used in CSS (see
https://www.w3.org/TR/SVG/geometry.html), but there is not much browser
support for this. It is nicer to implement than the ad-hoc SVG
attribute parsing though, so I feel it may make sense to port the rest
of the attributes specified here (which should fix some issues with
viewport relative sizes).
This commit is contained in:
MacDue 2024-01-28 17:48:59 +00:00 • committed by Sam Atkins
parent 556679fedd
commit b10f58a1fe
8 changed files with 91 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

4
Userland/Libraries/LibWeb/Layout/Node.cpp
View file

@ -751,6 +751,10 @@ void NodeWithStyle::apply_style(const CSS::StyleProperties& computed_style)
computed_values.set_grid_template_areas(computed_style.grid_template_areas());
computed_values.set_grid_auto_flow(computed_style.grid_auto_flow());
if (auto x_value = computed_style.length_percentage(CSS::PropertyID::X); x_value.has_value())
computed_values.set_x(*x_value);
if (auto y_value = computed_style.length_percentage(CSS::PropertyID::Y); y_value.has_value())
computed_values.set_y(*y_value);
auto fill = computed_style.property(CSS::PropertyID::Fill);
if (fill->has_color())
computed_values.set_fill(fill->to_color(*this));

4
Userland/Libraries/LibWeb/Layout/SVGFormattingContext.cpp
View file

@ -285,9 +285,11 @@ void SVGFormattingContext::run(Box const& box, LayoutMode layout_mode, Available
return size.to_px(node, reference_value);
};
// FIXME: Support the x/y attributes to calculate the offset.
auto nested_viewport_x = descendant.computed_values().x().to_px(descendant, viewport_width);
auto nested_viewport_y = descendant.computed_values().y().to_px(descendant, viewport_height);
auto nested_viewport_width = resolve_dimension(descendant, descendant.computed_values().width(), viewport_width);
auto nested_viewport_height = resolve_dimension(descendant, descendant.computed_values().height(), viewport_height);
nested_viewport_state.set_content_offset({ nested_viewport_x, nested_viewport_y });
nested_viewport_state.set_content_width(nested_viewport_width);
nested_viewport_state.set_content_height(nested_viewport_height);
nested_context.run(static_cast<Box const&>(descendant), layout_mode, available_space);