LibWeb: Use reverse direction on flex containers with rtl direction

If a flex container has `direction: rtl` set, reverse the row direction.
This commit is contained in:
BenJilks 2024-08-10 23:13:26 +01:00 committed by Sam Atkins
commit 82989554ab
Notes: github-actions[bot] 2024-08-13 14:20:49 +00:00
10 changed files with 92 additions and 4 deletions

View file

@ -194,6 +194,19 @@ void FlexFormattingContext::parent_context_did_dimension_child_root_box()
});
}
// https://www.w3.org/TR/css-flexbox-1/#flex-direction-property
bool FlexFormattingContext::is_direction_reverse() const
{
switch (flex_container().computed_values().direction()) {
case CSS::Direction::Ltr:
return m_flex_direction == CSS::FlexDirection::ColumnReverse || m_flex_direction == CSS::FlexDirection::RowReverse;
case CSS::Direction::Rtl:
return m_flex_direction == CSS::FlexDirection::ColumnReverse || m_flex_direction == CSS::FlexDirection::Row;
default:
VERIFY_NOT_REACHED();
}
}
void FlexFormattingContext::populate_specified_margins(FlexItem& item, CSS::FlexDirection flex_direction) const
{
auto width_of_containing_block = m_flex_container_state.content_width();