diff options
| author | Sam Atkins <atkinssj@gmail.com> | 2021-07-18 21:20:40 +0100 |
|---|---|---|
| committer | Andreas Kling <kling@serenityos.org> | 2021-07-22 23:09:01 +0200 |
| commit | 7abfb18656d7ecf389b10b1a75d2f1e8f5f2a718 (patch) | |
| tree | c36b87d6a8984c8b0fbf73e2129311a4b1d8daf6 /Base/res | |
| parent | fabbd06de4b1155064b34019eb11bd587d3de4a2 (diff) | |
| download | serenity-7abfb18656d7ecf389b10b1a75d2f1e8f5f2a718.zip | |
LibWeb: Implement CSS color parsing from Tokens
This was broken when we switched away from using StringStyleValues.
While I was at it, I have implemented hsl/a() and the percentage
syntax for rgb/a().
As a bonus, added `colors.html` as a test page for the various CSS
color syntaxes, since nothing was testing rgb() or rgba() before.
Much of the parsing code in LibGFX/Color.h seems to be centered
around CSS color values, but this is not used by the new Parser.
(And can't be used, because it requires a String value and we have
a list of Tokens of some kind instead.) Maybe that should be removed
from there when the new CSS parser is operational.
Diffstat (limited to 'Base/res')
| -rw-r--r-- | Base/res/html/misc/colors.html | 29 | ||||
| -rw-r--r-- | Base/res/html/misc/welcome.html | 1 |
2 files changed, 30 insertions, 0 deletions
diff --git a/Base/res/html/misc/colors.html b/Base/res/html/misc/colors.html new file mode 100644 index 0000000000..df0d67de1a --- /dev/null +++ b/Base/res/html/misc/colors.html @@ -0,0 +1,29 @@ +<html> + <head> + <title>CSS test</title> + <style type="text/css"> + #a { background-color: lime; } + #b { background-color: #0F0; } + #c { background-color: #00ff00; } + #d { background-color: rgb(0, 255, 0); } + #e { background-color: rgb(0%, 100%, 0%); } + #e2 { background-color: rgb(-5%, 120%, -42%); } + #f { background-color: rgba(0, 255, 0, 1); } + #g { background-color: rgba(0%, 100%, 0%, 1); } + #h { background-color: hsl(120, 100%, 50%); } + #i { background-color: hsla(120, 100%, 50%, 1); } + </style> + </head> + <body> + <div id="a">This is green, using a named color.</div> + <div id="b">This is green, using #0F0.</div> + <div id="c">This is green, using #00ff00.</div> + <div id="d">This is green, using rgb(0, 255, 0).</div> + <div id="e">This is green, using rgb(0%, 100%, 0%).</div> + <div id="e2">This is green, using rgb(-5%, 120%, -42%).</div> + <div id="f">This is green, using rgba(0, 255, 0, 1).</div> + <div id="g">This is green, using rgba(0%, 100%, 0%, 1).</div> + <div id="h">This is green, using hsl(120, 100%, 50%).</div> + <div id="i">This is green, using hsla(120, 100%, 50%, 1).</div> + </body> +</html> diff --git a/Base/res/html/misc/welcome.html b/Base/res/html/misc/welcome.html index fdaafa4972..e13f9b9f84 100644 --- a/Base/res/html/misc/welcome.html +++ b/Base/res/html/misc/welcome.html @@ -114,6 +114,7 @@ <li><a href="form.html">form</a></li> <li><a href="borders.html">borders</a></li> <li><a href="css.html">css</a></li> + <li><a href="colors.html">css colors</a></li> <li><a href="acid1.html">acid1</a></li> <li><a href="acid2.html">acid2</a></li> <li><a href="attrselectors.html">attribute selectors</a></li> |