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

LibWeb: Obey CSS aspect-ratio property during layout

Browse source 
Calculate a "preferred aspect ratio" based on the value of
`aspect-ratio` and the presence of a natural aspect ratio, and use that
in layout.

This is by no means complete or perfect, but we do now apply the given
aspect-ratio to things.

The spec is a bit vague, just saying to calculate sizes for
aspect-ratio'ed boxes the same as you would for replaced elements. My
naive solution here is to find everywhere we were checking for a
ReplacedBox, and then also accept a regular Box with a preferred aspect
ratio. This gets us pretty far. :^)

https://www.w3.org/TR/css-sizing-4/#aspect-ratio-minimum is not at all
implemented.
This commit is contained in:
Sam Atkins 2023-06-08 16:47:50 +01:00 • committed by Andreas Kling
parent 84e7216603
commit 1051624084
14 changed files with 131 additions and 55 deletions
Download patch file Download diff file Expand all files Collapse all files

8
Userland/Libraries/LibWeb/Layout/Box.cpp
View file

@ -91,4 +91,12 @@ Painting::PaintableBox const* Box::paintable_box() const
return static_cast<Painting::PaintableBox const*>(Node::paintable());
}
Optional<float> Box::preferred_aspect_ratio() const
{
auto computed_aspect_ratio = computed_values().aspect_ratio();
if (computed_aspect_ratio.use_natural_aspect_ratio_if_available && natural_aspect_ratio().has_value())
return natural_aspect_ratio();
return computed_aspect_ratio.preferred_ratio.map([](CSS::Ratio const& ratio) { return ratio.value(); });
}
}