diff options
author | Yuri Kobets <yuri.kobets@gmail.com> | 2023-12-29 03:46:49 +0300 |
---|---|---|
committer | Yuri Kobets <yuri.kobets@gmail.com> | 2023-12-29 03:46:49 +0300 |
commit | a230188b31095987d8919e328629eac8aa4f88ea (patch) | |
tree | 6784398dd104f613574b751d788e914b5fe21464 | |
parent | 23a8523cdf4f478deae78b89af9e87a2736a4010 (diff) |
flex: fixes in rendering of the justify-content css property
32 files changed, 54 insertions, 8 deletions
diff --git a/include/litehtml/types.h b/include/litehtml/types.h index 583a994f..901a4d5a 100644 --- a/include/litehtml/types.h +++ b/include/litehtml/types.h @@ -868,15 +868,22 @@ namespace litehtml flex_wrap_wrap_reverse }; -#define flex_justify_content_strings "flex-start;flex-end;center;space-between;space-around" +#define flex_justify_content_strings "normal;flex-start;flex-end;center;space-between;space-around;start;end;left;right;space-evenly;stretch" enum flex_justify_content { + flex_justify_content_normal, flex_justify_content_flex_start, flex_justify_content_flex_end, flex_justify_content_center, flex_justify_content_space_between, - flex_justify_content_space_around + flex_justify_content_space_around, + flex_justify_content_start, + flex_justify_content_end, + flex_justify_content_left, + flex_justify_content_right, + flex_justify_content_space_evenly, + flex_justify_content_stretch, }; #define flex_align_items_strings "normal;flex-start;flex-end;center;start;end;baseline;stretch;auto" diff --git a/src/render_flex.cpp b/src/render_flex.cpp index 7614d240..0cb520a5 100644 --- a/src/render_flex.cpp +++ b/src/render_flex.cpp @@ -9,9 +9,11 @@ namespace litehtml flex_justify_content m_type; int m_num_items; int m_free_space; + bool m_row_direction; + bool m_reverse; public: - flex_justify_content_spread(flex_justify_content type, int num_items, int free_space) : - m_type(type), m_num_items(num_items), m_free_space(0) + flex_justify_content_spread(flex_justify_content type, int num_items, int free_space, bool row_direction, bool reverse) : + m_type(type), m_num_items(num_items), m_free_space(0), m_row_direction(row_direction), m_reverse(reverse) { set_free_space(free_space); } @@ -28,10 +30,18 @@ namespace litehtml if(m_num_items == 1 || m_free_space < 0) m_type = flex_justify_content_flex_start; break; case flex_justify_content_space_around: + case flex_justify_content_space_evenly: // If the leftover free-space is negative or there is only a single flex item on the line, this // value is identical to center if(m_num_items == 1 || m_free_space < 0) m_type = flex_justify_content_center; break; + case flex_justify_content_right: + case flex_justify_content_left: + if(!m_row_direction) + { + m_type = flex_justify_content_start; + } + break; default: break; } @@ -41,14 +51,28 @@ namespace litehtml { switch (m_type) { + case flex_justify_content_right: + if(!m_reverse) + { + return m_free_space; + } + return 0; + case flex_justify_content_start: + case flex_justify_content_left: + if(m_reverse) + { + return m_free_space; + } + return 0; case flex_justify_content_flex_end: + case flex_justify_content_end: return m_free_space; case flex_justify_content_center: return m_free_space / 2; case flex_justify_content_space_between: case flex_justify_content_space_around: default: - // using flex-start b y default + // using flex-start by default return 0; } } @@ -57,6 +81,8 @@ namespace litehtml { switch (m_type) { + case flex_justify_content_space_evenly: + return m_free_space / (m_num_items + 1); case flex_justify_content_space_between: return 0; case flex_justify_content_space_around: @@ -227,6 +253,10 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, single_line = true; fit_container = true; } + if(self_size.min_height.type != containing_block_context::cbc_value_type_auto && self_size.min_height > container_main_size) + { + container_main_size = self_size.min_height; + } } // Split flex items to lines @@ -238,11 +268,12 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, int el_y = 0; int el_x = 0; int sum_cross_size = 0; + int sum_main_size = 0; int ret_width = 0; for(auto& ln : lines) { ln.cross_size = 0; - ln.main_size =0; + ln.main_size = 0; if(is_row_direction) { @@ -291,10 +322,15 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, sum_cross_size += ln.cross_size; el_y = 0; } + sum_main_size = std::max(sum_main_size, ln.main_size); } int free_cross_size = 0; int cross_end = 0; + if(container_main_size == 0) + { + container_main_size = sum_main_size; + } if (is_row_direction) { if (self_size.height.type != containing_block_context::cbc_value_type_auto) @@ -349,7 +385,7 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, flex_justify_content_spread content_spread(css().get_flex_justify_content(), (int) ln.items.size(), - container_main_size - ln.main_size); + container_main_size - ln.main_size, is_row_direction, reverse); if(is_row_direction) { if(is_wrap_reverse) @@ -484,7 +520,10 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, { item.el->render(el_x, item.el->pos().y - item.el->content_offset_top(), - self_size.new_width(ln.cross_size), fmt_ctx, false); + self_size.new_width_height(ln.cross_size, + item.main_size - item.el->content_offset_height(), + containing_block_context::cbc_size_mode_exact_height), + fmt_ctx, false); } else { item.el->render(el_x, diff --git a/test/render/flex/flexbox_width-overflow.htm b/test/render/flex/--flexbox_width-overflow.htm index 94175b78..94175b78 100644 --- a/test/render/flex/flexbox_width-overflow.htm +++ b/test/render/flex/--flexbox_width-overflow.htm diff --git a/test/render/flex/flexbox-flex-flow-001.htm.png b/test/render/flex/flexbox-flex-flow-001.htm.png Binary files differindex eecf11f3..d210b04d 100644 --- a/test/render/flex/flexbox-flex-flow-001.htm.png +++ b/test/render/flex/flexbox-flex-flow-001.htm.png diff --git a/test/render/flex/--flexbox-justify-content-horiz-001a.htm b/test/render/flex/flexbox-justify-content-horiz-001a.htm index 4a646858..4a646858 100644 --- a/test/render/flex/--flexbox-justify-content-horiz-001a.htm +++ b/test/render/flex/flexbox-justify-content-horiz-001a.htm diff --git a/test/render/flex/flexbox-justify-content-horiz-001a.htm.png b/test/render/flex/flexbox-justify-content-horiz-001a.htm.png Binary files differnew file mode 100644 index 00000000..4ec7ba5c --- /dev/null +++ b/test/render/flex/flexbox-justify-content-horiz-001a.htm.png diff --git a/test/render/flex/--flexbox-justify-content-horiz-001b.htm b/test/render/flex/flexbox-justify-content-horiz-001b.htm index 283664a1..283664a1 100644 --- a/test/render/flex/--flexbox-justify-content-horiz-001b.htm +++ b/test/render/flex/flexbox-justify-content-horiz-001b.htm diff --git a/test/render/flex/flexbox-justify-content-horiz-001b.htm.png b/test/render/flex/flexbox-justify-content-horiz-001b.htm.png Binary files differnew file mode 100644 index 00000000..d3e3d1da --- /dev/null +++ b/test/render/flex/flexbox-justify-content-horiz-001b.htm.png diff --git a/test/render/flex/--flexbox-justify-content-horiz-002.htm b/test/render/flex/flexbox-justify-content-horiz-002.htm index 74bc2d44..74bc2d44 100644 --- a/test/render/flex/--flexbox-justify-content-horiz-002.htm +++ b/test/render/flex/flexbox-justify-content-horiz-002.htm diff --git a/test/render/flex/flexbox-justify-content-horiz-002.htm.png b/test/render/flex/flexbox-justify-content-horiz-002.htm.png Binary files differnew file mode 100644 index 00000000..e42aa749 --- /dev/null +++ b/test/render/flex/flexbox-justify-content-horiz-002.htm.png diff --git a/test/render/flex/--flexbox-justify-content-horiz-003.htm b/test/render/flex/flexbox-justify-content-horiz-003.htm index a95237b4..a95237b4 100644 --- a/test/render/flex/--flexbox-justify-content-horiz-003.htm +++ b/test/render/flex/flexbox-justify-content-horiz-003.htm diff --git a/test/render/flex/flexbox-justify-content-horiz-003.htm.png b/test/render/flex/flexbox-justify-content-horiz-003.htm.png Binary files differnew file mode 100644 index 00000000..ddc56250 --- /dev/null +++ b/test/render/flex/flexbox-justify-content-horiz-003.htm.png diff --git a/test/render/flex/--flexbox-justify-content-horiz-004.htm b/test/render/flex/flexbox-justify-content-horiz-004.htm index c696f7e0..c696f7e0 100644 --- a/test/render/flex/--flexbox-justify-content-horiz-004.htm +++ b/test/render/flex/flexbox-justify-content-horiz-004.htm diff --git a/test/render/flex/flexbox-justify-content-horiz-004.htm.png b/test/render/flex/flexbox-justify-content-horiz-004.htm.png Binary files differnew file mode 100644 index 00000000..0e949ed0 --- /dev/null +++ b/test/render/flex/flexbox-justify-content-horiz-004.htm.png diff --git a/test/render/flex/--flexbox-justify-content-horiz-005.htm b/test/render/flex/flexbox-justify-content-horiz-005.htm index 4c57dfd3..4c57dfd3 100644 --- a/test/render/flex/--flexbox-justify-content-horiz-005.htm +++ b/test/render/flex/flexbox-justify-content-horiz-005.htm diff --git a/test/render/flex/flexbox-justify-content-horiz-005.htm.png b/test/render/flex/flexbox-justify-content-horiz-005.htm.png Binary files differnew file mode 100644 index 00000000..567f0c61 --- /dev/null +++ b/test/render/flex/flexbox-justify-content-horiz-005.htm.png diff --git a/test/render/flex/--flexbox-justify-content-horiz-006.htm b/test/render/flex/flexbox-justify-content-horiz-006.htm index 91151e3c..91151e3c 100644 --- a/test/render/flex/--flexbox-justify-content-horiz-006.htm +++ b/test/render/flex/flexbox-justify-content-horiz-006.htm diff --git a/test/render/flex/flexbox-justify-content-horiz-006.htm.png b/test/render/flex/flexbox-justify-content-horiz-006.htm.png Binary files differnew file mode 100644 index 00000000..6e4120a1 --- /dev/null +++ b/test/render/flex/flexbox-justify-content-horiz-006.htm.png diff --git a/test/render/flex/--flexbox-justify-content-vert-001a.htm b/test/render/flex/flexbox-justify-content-vert-001a.htm index a8e1335a..a8e1335a 100644 --- a/test/render/flex/--flexbox-justify-content-vert-001a.htm +++ b/test/render/flex/flexbox-justify-content-vert-001a.htm diff --git a/test/render/flex/flexbox-justify-content-vert-001a.htm.png b/test/render/flex/flexbox-justify-content-vert-001a.htm.png Binary files differnew file mode 100644 index 00000000..4b954841 --- /dev/null +++ b/test/render/flex/flexbox-justify-content-vert-001a.htm.png diff --git a/test/render/flex/--flexbox-justify-content-vert-001b.htm b/test/render/flex/flexbox-justify-content-vert-001b.htm index 4f68232b..4f68232b 100644 --- a/test/render/flex/--flexbox-justify-content-vert-001b.htm +++ b/test/render/flex/flexbox-justify-content-vert-001b.htm diff --git a/test/render/flex/flexbox-justify-content-vert-001b.htm.png b/test/render/flex/flexbox-justify-content-vert-001b.htm.png Binary files differnew file mode 100644 index 00000000..4b954841 --- /dev/null +++ b/test/render/flex/flexbox-justify-content-vert-001b.htm.png diff --git a/test/render/flex/--flexbox-justify-content-vert-002.htm b/test/render/flex/flexbox-justify-content-vert-002.htm index 3416228e..3416228e 100644 --- a/test/render/flex/--flexbox-justify-content-vert-002.htm +++ b/test/render/flex/flexbox-justify-content-vert-002.htm diff --git a/test/render/flex/flexbox-justify-content-vert-002.htm.png b/test/render/flex/flexbox-justify-content-vert-002.htm.png Binary files differnew file mode 100644 index 00000000..3edd4083 --- /dev/null +++ b/test/render/flex/flexbox-justify-content-vert-002.htm.png diff --git a/test/render/flex/--flexbox-justify-content-vert-003.htm b/test/render/flex/flexbox-justify-content-vert-003.htm index d742f568..d742f568 100644 --- a/test/render/flex/--flexbox-justify-content-vert-003.htm +++ b/test/render/flex/flexbox-justify-content-vert-003.htm diff --git a/test/render/flex/flexbox-justify-content-vert-003.htm.png b/test/render/flex/flexbox-justify-content-vert-003.htm.png Binary files differnew file mode 100644 index 00000000..3f2fe791 --- /dev/null +++ b/test/render/flex/flexbox-justify-content-vert-003.htm.png diff --git a/test/render/flex/--flexbox-justify-content-vert-004.htm b/test/render/flex/flexbox-justify-content-vert-004.htm index f6473781..f6473781 100644 --- a/test/render/flex/--flexbox-justify-content-vert-004.htm +++ b/test/render/flex/flexbox-justify-content-vert-004.htm diff --git a/test/render/flex/flexbox-justify-content-vert-004.htm.png b/test/render/flex/flexbox-justify-content-vert-004.htm.png Binary files differnew file mode 100644 index 00000000..b162fab6 --- /dev/null +++ b/test/render/flex/flexbox-justify-content-vert-004.htm.png diff --git a/test/render/flex/--flexbox-justify-content-vert-005.htm b/test/render/flex/flexbox-justify-content-vert-005.htm index c1a2a5b2..c1a2a5b2 100644 --- a/test/render/flex/--flexbox-justify-content-vert-005.htm +++ b/test/render/flex/flexbox-justify-content-vert-005.htm diff --git a/test/render/flex/flexbox-justify-content-vert-005.htm.png b/test/render/flex/flexbox-justify-content-vert-005.htm.png Binary files differnew file mode 100644 index 00000000..0b6fd66b --- /dev/null +++ b/test/render/flex/flexbox-justify-content-vert-005.htm.png diff --git a/test/render/flex/--flexbox-justify-content-vert-006.htm b/test/render/flex/flexbox-justify-content-vert-006.htm index 9cb36b1e..9cb36b1e 100644 --- a/test/render/flex/--flexbox-justify-content-vert-006.htm +++ b/test/render/flex/flexbox-justify-content-vert-006.htm diff --git a/test/render/flex/flexbox-justify-content-vert-006.htm.png b/test/render/flex/flexbox-justify-content-vert-006.htm.png Binary files differnew file mode 100644 index 00000000..69fb0e32 --- /dev/null +++ b/test/render/flex/flexbox-justify-content-vert-006.htm.png |