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

LibWeb: Implement flex reverse layouts

Browse source 
This builds on the work done by implementing the flex order CSS
property and implements flex reverse layouts by just reversing
the order and the items within each order bucket.
This commit is contained in:
Enver Balalic 2022-04-02 11:29:55 +02:00 • committed by Andreas Kling
parent 645d49fa53
commit 747f347b75
3 changed files with 22 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -48,8 +48,6 @@ void FlexFormattingContext::run(Box const& run_box, LayoutMode)
// This implements https://www.w3.org/TR/css-flexbox-1/#layout-algorithm
// FIXME: Implement reverse and ordering.
// 1. Generate anonymous flex items
generate_anonymous_flex_items();
@ -203,13 +201,25 @@ void FlexFormattingContext::generate_anonymous_flex_items()
});
auto keys = order_item_bucket.keys();
quick_sort(keys, [](auto& a, auto& b) { return a < b; });
if (is_direction_reverse()) {
quick_sort(keys, [](auto& a, auto& b) { return a > b; });
} else {
quick_sort(keys, [](auto& a, auto& b) { return a < b; });
}
for (auto key : keys) {
auto order_bucket = order_item_bucket.get(key);
if (order_bucket.has_value()) {
for (auto flex_item : order_bucket.value()) {
m_flex_items.append(move(flex_item));
auto items = order_bucket.value();
if (is_direction_reverse()) {
for (auto flex_item : items.in_reverse()) {
m_flex_items.append(move(flex_item));
}
} else {
for (auto flex_item : items) {
m_flex_items.append(move(flex_item));
}
}
}
}