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

LibWeb: Improve justify-content in abspos static position of flex child

Browse source 
Also, add a test so we know these actually work correctly now. :^)
This commit is contained in:
Andreas Kling 2023-07-04 13:28:47 +02:00 • committed by Jelle Raaijmakers
parent 859ac200b7
commit 80a734d42e
3 changed files with 300 additions and 28 deletions
Download patch file Download diff file Expand all files Collapse all files

38
Userland/Libraries/LibWeb/Layout/FlexFormattingContext.cpp
View file

@ -2150,40 +2150,22 @@ CSSPixelPoint FlexFormattingContext::calculate_static_position(Box const& box) c
CSSPixels main_offset = 0;
switch (flex_container().computed_values().justify_content()) {
case CSS::JustifyContent::Start:
if (is_direction_reverse()) {
main_offset = inner_main_size(flex_container());
} else {
main_offset = 0;
}
case CSS::JustifyContent::FlexStart:
main_offset = 0;
pack_from_end = is_direction_reverse();
break;
case CSS::JustifyContent::End:
if (is_direction_reverse()) {
main_offset = 0;
} else {
main_offset = inner_main_size(flex_container());
}
break;
case CSS::JustifyContent::FlexStart:
if (is_direction_reverse()) {
pack_from_end = false;
main_offset = inner_main_size(flex_container());
} else {
main_offset = 0;
}
break;
case CSS::JustifyContent::FlexEnd:
if (is_direction_reverse()) {
main_offset = 0;
} else {
pack_from_end = false;
main_offset = inner_main_size(flex_container());
}
main_offset = 0;
pack_from_end = !is_direction_reverse();
break;
case CSS::JustifyContent::SpaceBetween:
pack_from_end = false;
main_offset = 0;
break;
case CSS::JustifyContent::Center:
case CSS::JustifyContent::SpaceAround:
pack_from_end = false;
main_offset = inner_main_size(flex_container()) / 2.0 - inner_main_size(box) / 2.0;
break;
}
@ -2191,12 +2173,12 @@ CSSPixelPoint FlexFormattingContext::calculate_static_position(Box const& box) c
// NOTE: Next, we add the flex container's padding since abspos boxes are placed relative to the padding edge
// of their abspos containing block.
if (pack_from_end) {
main_offset += is_row_layout() ? m_flex_container_state.padding_left : m_flex_container_state.padding_top;
} else {
main_offset += is_row_layout() ? m_flex_container_state.padding_right : m_flex_container_state.padding_bottom;
} else {
main_offset += is_row_layout() ? m_flex_container_state.padding_left : m_flex_container_state.padding_top;
}
if (!pack_from_end)
if (pack_from_end)
main_offset += inner_main_size(flex_container()) - inner_main_size(box);
auto static_position_offset = is_row_layout() ? CSSPixelPoint { main_offset, cross_offset } : CSSPixelPoint { cross_offset, main_offset };