Commit graph

198 commits

Author SHA1 Message Date
Aliaksandr Kalenik
c254de3509 LibWeb: Remove duplicated code in grid auto track counting
This refactoring simplifies the resolution of minimum and maximum sizes
during the counting of auto tracks.

No changes in behavior are intended.
2024-01-17 17:25:58 +01:00
Aliaksandr Kalenik
0a09ff698f LibWeb: Fix accounting for gaps in auto-fit count calculation in GFC
Fixes a bug where gaps between repeated tracks were accounted for only
once instead of multiple times, corresponding to the repeat count.

Fixes https://github.com/SerenityOS/serenity/issues/22823
2024-01-17 15:15:06 +01:00
Aliaksandr Kalenik
6a4dd8fa47 LibWeb: Account for gaps in grid container's intrinsic size calculation
Fixes https://github.com/SerenityOS/serenity/issues/22804
2024-01-16 21:54:23 +01:00
Aliaksandr Kalenik
9e23503c9c LibWeb: Align with spec "stretch auto tracks" step in GFC
Now, we will evenly distribute the remaining free space across tracks
using the auto max-tracks sizing function, exactly as the specification
states. Many tests are affected, but they are not visually broken.

Fixes https://github.com/SerenityOS/serenity/issues/22798
2024-01-16 13:13:47 +01:00
Aliaksandr Kalenik
6480ed20b8 LibWeb: Add support for implicit grid lines formed by grid areas in GFC
According to spec each grid area implicitly defines 4 additional named
lines that could be used to specify items position.
2024-01-08 09:28:37 +01:00
Aliaksandr Kalenik
92bf7d3ba7 LibWeb: Always add "ending" line during lines init in GFC
This moves us a bit toward correctly representing two separate concepts
from the spec: lines and tracks. Lines divide the grid into tracks, so
there should always be a line concluding the last track.
2024-01-08 09:28:37 +01:00
Aliaksandr Kalenik
903d3c92c8 LibWeb: Support auto-fill for rows in GFC
This change fixes the function that calculates the number of auto-fill
tracks, ensuring it uses height when applied to rows, instead of
assuming that it always operates on columns.
2024-01-07 11:12:35 +01:00
Aliaksandr Kalenik
042d3b79c2 LibWeb: Remove get_count_of_tracks() in GFC
This method is not needed, as we calculate the number of tracks in the
first step of grid layout by expanding the track definitions.
2024-01-07 09:57:13 +01:00
Aliaksandr Kalenik
a32046ea50 LibWeb: Fix auto-fill track counting to correctly handle gaps in GFC
Fixes the mistake that gaps are counted as if they exist after each
track, when actually gaps are present only between tracks.

Visual progression on https://kde.org/products/
2024-01-07 09:57:13 +01:00
Aliaksandr Kalenik
39abd9095e LibWeb: Return CSSPixels from calculate_inner_height()
Similar to calculate_inner_width(), let's make the caller responsible
for handling "auto" instead of returning the input height as is when
when it cannot be resolved.
2024-01-07 09:03:57 +01:00
Aliaksandr Kalenik
05a1dbeb91 LibWeb: Return CSSPixels from calculate_inner_width()
Initially, this function was made to return CSS::Length because some of
its callers were expecting it to ignore "auto" width on input and
return it as is. Instead, let's just forbid using "auto" for input
width and always return CSSPixels.
2024-01-07 09:03:57 +01:00
Andreas Kling
cc88a2657d LibWeb: Resolve grid item vertical margin/padding against CB width
Percentage vertical margin and padding values are relative to the
containing block *width*, not *height*. This has to be one of the most
commonly recurring mistakes we make :^)
2024-01-06 21:06:21 +01:00
Aliaksandr Kalenik
107bfbe283 LibWeb: Remove available space param from track init methods in GFC
Let's consistently use available space from `m_available_space`.

No behavior change expected.
2024-01-05 22:52:25 +01:00
Aliaksandr Kalenik
9c72807976 LibWeb: Account for auto-fill/fit when expanding grid lines in GFC
Named line placement now works when auto-fill or auto-fit is used to
define grid columns.
2024-01-05 22:52:25 +01:00
Aliaksandr Kalenik
90142ad307 LibWeb: Account for gap in auto-fill columns count calculation in GFC
Fixes https://github.com/SerenityOS/serenity/issues/22603
2024-01-05 22:52:25 +01:00
Aliaksandr Kalenik
cfcc459140 LibWeb: Fix grid line name placement when repeat() is used
Before this change, parsed grid-template-columns/grid-template-rows
were represented as two lists: line names and track sizes. The problem
with this approach is that it erases the relationship between tracks
and their names, which results in unnecessarily complicated code that
restores this data (incorrectly if repeat() is involved) during layout.
This change solves that by representing line definitions as a list of
sizes and names in the order they were defined.

Visual progression https://genius.com/
2024-01-05 13:21:09 +01:00
Aliaksandr Kalenik
bef9699cf4 LibWeb: Remove available space from track sizing method params in GFC
Let's consistently use available space from `m_available_space`.

No behavior change expected.
2024-01-04 21:50:09 +01:00
Aliaksandr Kalenik
b6123df492 LibWeb: Add support for start, center and end justify-content in GFC
Fixes https://github.com/SerenityOS/serenity/issues/22555
2024-01-04 09:47:20 +01:00
Aliaksandr Kalenik
cd56ec6e5c LibWeb: Redo "tracks maximize" if initial run is over max-size in GFC
Implements missing "redo" step defined in the spec.
2023-12-26 19:19:50 +01:00
Aliaksandr Kalenik
ed42b12123 LibWeb: Respect box-sizing in min-height calculation of grid container 2023-12-26 11:13:38 +01:00
Aliaksandr Kalenik
4c81414b14 LibWeb: Fix division by zero in auto-fit/fill track calculation in GFC
Fixes https://github.com/SerenityOS/serenity/issues/22319
2023-12-16 19:39:44 +01:00
Tim Schumacher
a2f60911fe AK: Rename GenericTraits to DefaultTraits
This feels like a more fitting name for something that provides the
default values for Traits.
2023-11-09 10:05:51 -05:00
Aliaksandr Kalenik
2fb0cede9a LibWeb: Account for box-sizing in grid-items width calculation
Visual improvement on (now there is a gap between grid items):
https://twinings.co.uk/collections/earl-grey-tea
2023-11-02 07:37:11 +01:00
Aliaksandr Kalenik
141f56accc LibWeb: Position abspos items inside grid relative to their grid area
Since grid item's containing block is not grid container but
corresponding grid area, it affect positioning of abspos items.
2023-10-31 08:46:17 +01:00
Aliaksandr Kalenik
44001d2178 LibWeb: Separate grid item's area rect calculation in a function in GFC
We would also have to find grid area rect while abspos items layout so
it makes sense to have this code in a separate function.
2023-10-31 08:46:17 +01:00
Aliaksandr Kalenik
549dee4db1 LibWeb: Call prepare_for_replaced_layout() on replaced boxes in GFC
We need to call prepare_for_replaced_layout() on grid items to populate
their natural sizes and aspect ration.
2023-10-31 07:08:30 +01:00
Aliaksandr Kalenik
f75186ec8f LibWeb: Add support for grid item's min-height and max-height in GFC 2023-10-29 08:46:51 +01:00
Aliaksandr Kalenik
d1a01c4c65 LibWeb: Fix box alignment when it has min-width or max-width in GFC
Changing `try_compute_width()` to return width and margins, instead of
mutating them in the box's state makes it works in cases when box has
min-width or max-width and this function needs to be called multiple
times.

Fixes https://github.com/SerenityOS/serenity/issues/21598
2023-10-27 07:14:34 +02:00
Aliaksandr Kalenik
58f8068853 LibWeb: Handle fit-content in calculate_max_content_contribution in GFC
Fixes https://github.com/SerenityOS/serenity/issues/21569
2023-10-26 08:37:42 +02:00
Aliaksandr Kalenik
4dab17427f LibWeb: Use max content contribution in flex_fraction in GFC
As spec comment in the code says we should use item’s max-content
contribution to calculate flex fraction.

Likely, it was calculate_max_content_size() because we didn't have
calculate_max_content_contribution() when this function was implemented
initially.
2023-10-24 07:26:25 +02:00
Aliaksandr Kalenik
802b58d7e1 LibWeb: Resolve grid item's min-width and max-width in GFC
Now min-width and max-width properties affect resulting width of grid
item instead of being ignored.
2023-10-24 07:25:20 +02:00
Aliaksandr Kalenik
122d847720 LibWeb: Fix building of areas spanning multiple rows in GFC
Rewrites the grid area building to accurately identify areas that span
multiple rows. Also now we can recognize invalid areas but do not
handle them yet.
2023-10-22 19:38:18 +02:00
Aliaksandr Kalenik
719b12b19d LibWeb: Support alignment of abspos grid items
Grid items should respect alignment properties if top/right/bottom/left
are not specified.

This change adds a separate implementation of
layout_absolutely_positioned_element that is extended with support for
alignment.
2023-10-21 09:08:51 +02:00
Aliaksandr Kalenik
2def1de4be LibWeb: Rerun rows sizings if grid auto height is less than min-height
If the first pass of rows sizing results in the container's automatic
height being less than the specified min-height, we need to run a
second pass using the updated available space.
2023-10-21 09:08:11 +02:00
Sam Atkins
b66ff21379 LibWeb: Add missing check for flexible grid tracks
Previously this didn't cause issues because the default flex-factor is
0, but once we only store a flex-factor for FlexibleLength-type
GridSizes, this causes a crash.
2023-09-28 20:33:20 +01:00
Aliaksandr Kalenik
693d602b2f LibWeb: Fix infinite loop in GFC growth limit distribution
This change is bd85e1b30b ported from
base size to growth limit distribution.

Fixes https://github.com/SerenityOS/serenity/issues/21056
2023-09-20 18:28:11 +02:00
Hendiadyoin1
d262670729 LibWeb: Use more CSSPixelFractions in GFC::expand_flexible_tracks
Also contains a drive-by expression simplification, and accidental
double truncation fix.
2023-09-18 18:02:51 +02:00
Zaggy1024
fc05cda8cf LibWeb: Make division of CSSPixels by integers create a fraction
This also adds some additional operators to `CSSPixelsFraction` to
allow this change to build, since some places were using equations like
`(a / b) + (c / d)` or `-(x / y)`.
2023-09-09 13:03:11 +02:00
Zaggy1024
bd85e1b30b LibWeb: Entirely and exactly distribute grids' extra space to tracks
Previously, the code assumed that in dividing up the space in the
affected tracks there would never be an overshoot. Instead, we can
check for each track how much extra space is left and never consume any
extra.

In the same way, we can ensure that all extra space is consumed by
distributing all remaining extra space starting from the first track.
Thus, if there is no growth limit, the space distribution should always
consume all the extra space.
2023-09-05 14:50:45 +02:00
Zaggy1024
eb7c2ee307 LibWeb: Limit affected size of grid tracks instead of only increase
The spec says that the sum of affected size + item-incurred increase
should reach the limit, rather than just the item-incurred increase.

This seems to improve layout on the testcase `row-span-2-with-gaps`.
The extra line of space at the bottom of the left div
(`div.grid-item.item-span-two`) is not present anymore, matching other
browsers' layout much more closely.
2023-09-05 14:50:45 +02:00
Aliaksandr Kalenik
2495302991 LibWeb: Reset auto_placement_cursor_x after adding new column in GFC
We need to start looking from the beginning of current row if adding
new implicit column track made enough space to accomodate spanning item

This fixes placement for spanning grid items when `grid-auto-flow` is
specified to `column`.
2023-08-29 12:35:21 +02:00
Aliaksandr Kalenik
b66f65dc9e LibWeb: Define if identifier represent area or line during layout [GFC]
This fixes regression introduced in
c03e025a32 by assuming that it is
possible to determine whether identifier stands for line or area
during parsing.
2023-08-28 09:19:41 +02:00
Aliaksandr Kalenik
d3d67857b2 LibWeb: Use containing block width to measure fit-content width in GFC
When the grid layout gets to
`resolve_items_box_metrics(GridDimension::Column)`, we've already
determined the width of each column. However, the widths of the
individual grid items themselves haven't been set. Rather than using
`get_available_space_for_item()`, which returns an indefinite size if
an item's width/height hasn't been set, we should use the already
known track width as the available size to calculate the fit-content
width.
2023-08-27 05:11:55 +02:00
MacDue
71baa8c31a LibWeb: Add CSSPixels::nearest_value_for(FloatingPoint)
This is intended to annotate conversions from unknown floating-point
values to CSSPixels, and make it more obvious the fp value will be
rounded to the nearest fixed-point value.
2023-08-26 23:53:45 +02:00
MacDue
360c0eb509 LibWeb: Remove implicit conversion from float and double to CSSPixels
In general it is not safe to convert any arbitrary floating-point value
to CSSPixels. CSSPixels has a resolution of 0.015625, which for small
values (e.g. scale factors between 0 and 1), can produce bad results
if converted to CSSPixels then scaled back up. In the worst case values
can underflow to zero and produce incorrect results.
2023-08-26 23:53:45 +02:00
Aliaksandr Kalenik
c03e025a32 LibWeb: Disambiguate GridTrackPlacement API
- Ambiguous `raw_value()` method is replaced with `line_number()` and
  `span()`.
- `line_name()` that before returned either line name or area name is
  replaced with `line_name()` and `area_name()`.
- `Position` type is replaced with `Line` and `Area` type so we don't
   have to guess while doing layout.

Affected test expectations:
- `template-lines-and-areas` - improvement over what we had before.
- `named-tracks` - rebaseline a giant test. will have to split it into
  smaller tests in the future.
2023-08-26 13:16:17 +02:00
Aliaksandr Kalenik
b4064320bd LibWeb: Add m_is_grid_item in Layout::Node
This information is going to be needed during painting to treat grid
items as stacking contexts.
2023-08-22 11:33:24 +02:00
Aliaksandr Kalenik
37f5253ec9 LibWeb/Layout: Add support for grid-auto-flow in GFC 2023-08-20 15:36:18 +02:00
Aliaksandr Kalenik
e9a718ff88 LibWeb/Layout: Replace INFINITY with CSSPixels::min() or max() 2023-08-17 20:03:13 +02:00
Aliaksandr Kalenik
af38f1cba4 LibWeb: Replace to_px() with to_px_or_zero() in GridFormattingContext
to_px() usage should be avoided because it might leak saturated
(infinite) values into layout calculations.
2023-08-12 20:06:01 +02:00