diff options
| author | Sam Atkins <atkinssj@serenityos.org> | 2023-04-11 15:48:06 +0100 |
|---|---|---|
| committer | Andreas Kling <kling@serenityos.org> | 2023-04-13 09:53:47 +0200 |
| commit | d0f80b40b2a662c9cdd697c1f4880cef83cb205d (patch) | |
| tree | 4773a1586273275c58ff2c6578f73108cd60ce9e /Base | |
| parent | 5f2f780662a493bf33d2fd799483a2ff2c62f5ea (diff) | |
| download | serenity-d0f80b40b2a662c9cdd697c1f4880cef83cb205d.zip | |
LibWeb: Reimplement CalculatedStyleValue as a calculation node tree
VALUES-4 defines the internal representation of `calc()` as a tree of
calculation nodes. ( https://www.w3.org/TR/css-values-4/#calc-internal )
VALUES-3 lacked any definition here, so we had our own ad-hoc
implementation based around the spec grammar. This commit replaces that
with CalculationNodes representing each possible node in the tree.
There are no intended functional changes, though we do now support
nested calc() which previously did not work. For example:
`width: calc( 42 * calc(3 + 7) );`
I have added an example of this to our test page.
A couple of the layout tests that used `calc()` now return values that
are 0.5px different from before. There's no visual difference, so I
have updated the tests to use the new results.
Diffstat (limited to 'Base')
| -rw-r--r-- | Base/res/html/misc/calc.html | 5 |
1 files changed, 5 insertions, 0 deletions
diff --git a/Base/res/html/misc/calc.html b/Base/res/html/misc/calc.html index 1141afdb3c..030af4519b 100644 --- a/Base/res/html/misc/calc.html +++ b/Base/res/html/misc/calc.html @@ -34,6 +34,11 @@ <div class="box" style="width: calc(100px + 30% - (120px / (2*4 + 3 )));"></div> </div> + <p>calc(100px + 30% - calc(120px / calc(2*4 + 3 )))</p> + <div class="container"> + <div class="box" style="width: calc(100px + 30% - calc(120px / calc(2*4 + 3 )));"></div> + </div> + <p>calc(50% + 60px)</p> <div class="container"> <div class="box" style="width: calc(50% + 60px);"></div> |