There's a subtle difference here. A "block box" in the spec is a
block-level box, while a "block container" is a box whose children are
either all inline-level boxes in an IFC, or all block-level boxes
participating in a BFC.
Notably, an "inline-block" box is a "block container" but not a "block
box" since it is itself inline-level.
The CSS spec uses the name "block formatting context root" when talking
about a box that establishes a BFC. So let's call it BFC::root() in our
code as well, instead of the less specific BFC::context_box().
Until now, we've internally thought of the CSS "display" property as a
single-value property. In practice, "display" is a much more complex
property that comes in a number of configurations.
The most interesting one is the two-part format that describes the
outside and inside behavior of a box. Switching our own internal
representation towards this model will allow for much cleaner
abstractions around layout and the various formatting contexts.
Note that we don't *parse* two-part "display" yet, this is only about
changing the internal representation of the property.
Spec: https://drafts.csswg.org/css-display
Auto margins are still not supported at all, but this is a good start
into supporting margins on flex items.
The way cross-before (top for row, left for column) is handled is very
naive.
Previously, if the parent of the container had a definite main size, it
would've been disregarded when calculating the main size of the
container if it had no definite size and neither min- nor max-main-size
constraints.
This patch fixes that behavior by additionally checking whether the main
size is not only not constrained but also infinite.
A flex-basis of zero doesn't actually mean that the preferred size of
the particular Box is 0. It means that the Box should take the least
amount of space possible while still accomodating the content inside.
We catch and circumvent this now right when the flex-basis property gets
read for the FlexFormattingContext.
This isn't mentioned anywhere in the seemingly relevant portions of the
spec, however thanks to this answer https://stackoverflow.com/a/47579078
(which is not entirely correct about width either) lead to the behavior
that is wanted and used by other Browsers.
If an element has a relative specified length on the cross axis, but in
the lineage there are no parents that have any fixed cross size, this
would have resulted in a 0 cross size.
We now catch that and check whether the relative length would result in
an actual definite length if resolved.
This does a few things, that are hard to separate. For a while now, it's
been confuzing what `StyleValue::is_foo()` actually means. It sometimes
was used to check the type, and sometimes to see if it could return a
certain value type. The new naming scheme is:
- `is_length()` - is it a LengthStyleValue?
- `as_length()` - casts it to LengthStyleValue
- `has_length()` - can it return a Length?
- `to_length()` - gets the internal value out (eg, Length)
This also means, no more `static_cast<LengthStyleValue const&>(*this)`
stuff when dealing with StyleValues. :^)
Hopefully this will be a bit clearer going forward. There are lots of
places using the original methods, so I'll be going through them to
hopefully catch any issues.
Previously any children would be layout using a BlockFormattingContext.
Now we at least differentiate between IFC and BFC if the sizes in
question are not constrained by other things.
Negative margins are a headache anyways, and allowing them to be
negative lead to weird behavior.
This patch avoids vasty wrong height-calculations by limiting the
allowed margins to positive numbers when evaluating the height of a
block.
This fixes the issue where an `<img>` set to its native size would
sometimes still appear blurry, because it had a fractional position,
causing `enclosing_int_rect()` to expand by 1px.
The logic here is needed by InlineNode too. Moving it into a
`paint_all_borders()` function makes it available to them both, as well
as anyone else who wants it. :^)
Doing so was causing the background to be painted twice, which looks
ugly if the background is semi-transparent. The painting is a bit of a
hack, as some situations apparently relied on it. This commit is ripping
the band-aid off to find where those are and fix them. :^)
We were computing the padded rect of the box during every paint phase,
despite only needing it in the Overlay phase.
Since this is an expensive call, let's take care not to make it
unnecessarily.
This is a hack, but it seems to do quite okay.
What we should do is to find the largest size the Box could want in its
main axis. To do that we have to layout the Box according to the needed
LayoutMode. For flex-rows we do as requested and try to make the Box as
wide as we want.
However, for flex-columns we simply assume the Box is a Block and we
calculate their height according to this.
Instead of trying to layout SVG boxes as if they are regular CSS boxes,
let's invent an "SVG formatting context" and let it manage SVG boxes.
To facilitate this, Layout::SVGBox no longer inherits from ReplacedBox,
and is instead a simple, "inline-block" style BlockBox.
If our parent in the FlexFormattingContext also was a flex-container, we
didn't give our children any meaningful width to play with into
layout_inside(), which resulted in way too narrow layouting.
Now the width of the parent gets borrowed if the own width isn't
specified.
The previous VERIFY_NOT_REACHED() could be reached when there were equal
coodinates. This could be the case for a small radius which lead to
rounding making the two coordinates equal.
This now uses the values in `InitialValues`, which is not ideal, but
it's better to have our defaults defined in two places, than in 3.
The default for `border-colors` is `currentcolor`, so we shortcut that
here and just grab the value of the `color` property. As noted, this is
not perfect, but it's somewhat better.
In the spec, `fill` and `stroke` are supposed to be a shorthands for
various properties. But since the spec is still a working draft, and
neither Firefox or Chrome support the `fill-color` or `stroke-color`
properties, we'll stick with `fill` and `stroke` as simple colors for
now.
Also, note that SVG expects things in "user units", and we are assuming
that 1px = 1 user unit for now.
