1
Fork 0
mirror of https://github.com/RGBCube/serenity synced 2025-05-31 15:48:12 +00:00

LibWeb: Support x and y attributes on nested SVGs

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

View file

@ -47,9 +47,19 @@ JS::GCPtr<Layout::Node> SVGSVGElement::create_layout_node(NonnullRefPtr<CSS::Sty
void SVGSVGElement::apply_presentational_hints(CSS::StyleProperties& style) const
{
Base::apply_presentational_hints(style);
auto parsing_context = CSS::Parser::ParsingContext { document(), CSS::Parser::ParsingContext::Mode::SVGPresentationAttribute };
auto x_attribute = attribute(SVG::AttributeNames::x);
if (auto x_value = parse_css_value(parsing_context, x_attribute.value_or(String {}), CSS::PropertyID::X)) {
style.set_property(CSS::PropertyID::X, x_value.release_nonnull());
}
auto y_attribute = attribute(SVG::AttributeNames::y);
if (auto y_value = parse_css_value(parsing_context, y_attribute.value_or(String {}), CSS::PropertyID::Y)) {
style.set_property(CSS::PropertyID::Y, y_value.release_nonnull());
}
auto width_attribute = attribute(SVG::AttributeNames::width);
auto parsing_context = CSS::Parser::ParsingContext { document(), CSS::Parser::ParsingContext::Mode::SVGPresentationAttribute };
if (auto width_value = parse_css_value(parsing_context, width_attribute.value_or(String {}), CSS::PropertyID::Width)) {
style.set_property(CSS::PropertyID::Width, width_value.release_nonnull());
} else if (width_attribute == "") {