aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorYuri Kobets <yuri.kobets@gmail.com>2023-12-29 03:46:49 +0300
committerYuri Kobets <yuri.kobets@gmail.com>2023-12-29 03:46:49 +0300
commita230188b31095987d8919e328629eac8aa4f88ea (patch)
tree6784398dd104f613574b751d788e914b5fe21464
parent23a8523cdf4f478deae78b89af9e87a2736a4010 (diff)
flex: fixes in rendering of the justify-content css property
-rw-r--r--include/litehtml/types.h11
-rw-r--r--src/render_flex.cpp51
-rw-r--r--test/render/flex/--flexbox_width-overflow.htm (renamed from test/render/flex/flexbox_width-overflow.htm)0
-rw-r--r--test/render/flex/flexbox-flex-flow-001.htm.pngbin2077 -> 2059 bytes
-rw-r--r--test/render/flex/flexbox-justify-content-horiz-001a.htm (renamed from test/render/flex/--flexbox-justify-content-horiz-001a.htm)0
-rw-r--r--test/render/flex/flexbox-justify-content-horiz-001a.htm.pngbin0 -> 334 bytes
-rw-r--r--test/render/flex/flexbox-justify-content-horiz-001b.htm (renamed from test/render/flex/--flexbox-justify-content-horiz-001b.htm)0
-rw-r--r--test/render/flex/flexbox-justify-content-horiz-001b.htm.pngbin0 -> 334 bytes
-rw-r--r--test/render/flex/flexbox-justify-content-horiz-002.htm (renamed from test/render/flex/--flexbox-justify-content-horiz-002.htm)0
-rw-r--r--test/render/flex/flexbox-justify-content-horiz-002.htm.pngbin0 -> 1288 bytes
-rw-r--r--test/render/flex/flexbox-justify-content-horiz-003.htm (renamed from test/render/flex/--flexbox-justify-content-horiz-003.htm)0
-rw-r--r--test/render/flex/flexbox-justify-content-horiz-003.htm.pngbin0 -> 429 bytes
-rw-r--r--test/render/flex/flexbox-justify-content-horiz-004.htm (renamed from test/render/flex/--flexbox-justify-content-horiz-004.htm)0
-rw-r--r--test/render/flex/flexbox-justify-content-horiz-004.htm.pngbin0 -> 914 bytes
-rw-r--r--test/render/flex/flexbox-justify-content-horiz-005.htm (renamed from test/render/flex/--flexbox-justify-content-horiz-005.htm)0
-rw-r--r--test/render/flex/flexbox-justify-content-horiz-005.htm.pngbin0 -> 865 bytes
-rw-r--r--test/render/flex/flexbox-justify-content-horiz-006.htm (renamed from test/render/flex/--flexbox-justify-content-horiz-006.htm)0
-rw-r--r--test/render/flex/flexbox-justify-content-horiz-006.htm.pngbin0 -> 391 bytes
-rw-r--r--test/render/flex/flexbox-justify-content-vert-001a.htm (renamed from test/render/flex/--flexbox-justify-content-vert-001a.htm)0
-rw-r--r--test/render/flex/flexbox-justify-content-vert-001a.htm.pngbin0 -> 439 bytes
-rw-r--r--test/render/flex/flexbox-justify-content-vert-001b.htm (renamed from test/render/flex/--flexbox-justify-content-vert-001b.htm)0
-rw-r--r--test/render/flex/flexbox-justify-content-vert-001b.htm.pngbin0 -> 439 bytes
-rw-r--r--test/render/flex/flexbox-justify-content-vert-002.htm (renamed from test/render/flex/--flexbox-justify-content-vert-002.htm)0
-rw-r--r--test/render/flex/flexbox-justify-content-vert-002.htm.pngbin0 -> 919 bytes
-rw-r--r--test/render/flex/flexbox-justify-content-vert-003.htm (renamed from test/render/flex/--flexbox-justify-content-vert-003.htm)0
-rw-r--r--test/render/flex/flexbox-justify-content-vert-003.htm.pngbin0 -> 312 bytes
-rw-r--r--test/render/flex/flexbox-justify-content-vert-004.htm (renamed from test/render/flex/--flexbox-justify-content-vert-004.htm)0
-rw-r--r--test/render/flex/flexbox-justify-content-vert-004.htm.pngbin0 -> 982 bytes
-rw-r--r--test/render/flex/flexbox-justify-content-vert-005.htm (renamed from test/render/flex/--flexbox-justify-content-vert-005.htm)0
-rw-r--r--test/render/flex/flexbox-justify-content-vert-005.htm.pngbin0 -> 696 bytes
-rw-r--r--test/render/flex/flexbox-justify-content-vert-006.htm (renamed from test/render/flex/--flexbox-justify-content-vert-006.htm)0
-rw-r--r--test/render/flex/flexbox-justify-content-vert-006.htm.pngbin0 -> 461 bytes
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
index eecf11f3..d210b04d 100644
--- a/test/render/flex/flexbox-flex-flow-001.htm.png
+++ b/test/render/flex/flexbox-flex-flow-001.htm.png
Binary files differ
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
new file mode 100644
index 00000000..4ec7ba5c
--- /dev/null
+++ b/test/render/flex/flexbox-justify-content-horiz-001a.htm.png
Binary files differ
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
new file mode 100644
index 00000000..d3e3d1da
--- /dev/null
+++ b/test/render/flex/flexbox-justify-content-horiz-001b.htm.png
Binary files differ
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
new file mode 100644
index 00000000..e42aa749
--- /dev/null
+++ b/test/render/flex/flexbox-justify-content-horiz-002.htm.png
Binary files differ
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
new file mode 100644
index 00000000..ddc56250
--- /dev/null
+++ b/test/render/flex/flexbox-justify-content-horiz-003.htm.png
Binary files differ
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
new file mode 100644
index 00000000..0e949ed0
--- /dev/null
+++ b/test/render/flex/flexbox-justify-content-horiz-004.htm.png
Binary files differ
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
new file mode 100644
index 00000000..567f0c61
--- /dev/null
+++ b/test/render/flex/flexbox-justify-content-horiz-005.htm.png
Binary files differ
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
new file mode 100644
index 00000000..6e4120a1
--- /dev/null
+++ b/test/render/flex/flexbox-justify-content-horiz-006.htm.png
Binary files differ
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
new file mode 100644
index 00000000..4b954841
--- /dev/null
+++ b/test/render/flex/flexbox-justify-content-vert-001a.htm.png
Binary files differ
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
new file mode 100644
index 00000000..4b954841
--- /dev/null
+++ b/test/render/flex/flexbox-justify-content-vert-001b.htm.png
Binary files differ
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
new file mode 100644
index 00000000..3edd4083
--- /dev/null
+++ b/test/render/flex/flexbox-justify-content-vert-002.htm.png
Binary files differ
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
new file mode 100644
index 00000000..3f2fe791
--- /dev/null
+++ b/test/render/flex/flexbox-justify-content-vert-003.htm.png
Binary files differ
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
new file mode 100644
index 00000000..b162fab6
--- /dev/null
+++ b/test/render/flex/flexbox-justify-content-vert-004.htm.png
Binary files differ
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
new file mode 100644
index 00000000..0b6fd66b
--- /dev/null
+++ b/test/render/flex/flexbox-justify-content-vert-005.htm.png
Binary files differ
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
new file mode 100644
index 00000000..69fb0e32
--- /dev/null
+++ b/test/render/flex/flexbox-justify-content-vert-006.htm.png
Binary files differ