From f9d66bef5d098504b15fb59ee4e874c70f6a7a85 Mon Sep 17 00:00:00 2001 From: Karol Kosek Date: Sun, 6 Mar 2022 00:25:42 +0100 Subject: [PATCH] LibWeb: Compute `text-decoration-color` values Previosly, we used only the text color as a line decoration color. The FIXME comment has been directly copy-pasted from the border color note a few lines below. --- Userland/Libraries/LibWeb/CSS/ComputedValues.h | 3 +++ Userland/Libraries/LibWeb/Layout/Node.cpp | 5 +++++ Userland/Libraries/LibWeb/Layout/TextNode.cpp | 6 ++++-- 3 files changed, 12 insertions(+), 2 deletions(-) diff --git a/Userland/Libraries/LibWeb/CSS/ComputedValues.h b/Userland/Libraries/LibWeb/CSS/ComputedValues.h index 9b1b057f18..0989f731af 100644 --- a/Userland/Libraries/LibWeb/CSS/ComputedValues.h +++ b/Userland/Libraries/LibWeb/CSS/ComputedValues.h @@ -112,6 +112,7 @@ public: CSS::TextAlign text_align() const { return m_inherited.text_align; } CSS::TextDecorationLine text_decoration_line() const { return m_noninherited.text_decoration_line; } CSS::TextDecorationStyle text_decoration_style() const { return m_noninherited.text_decoration_style; } + Color text_decoration_color() const { return m_noninherited.text_decoration_color; } CSS::TextTransform text_transform() const { return m_inherited.text_transform; } CSS::Position position() const { return m_noninherited.position; } CSS::WhiteSpace white_space() const { return m_inherited.white_space; } @@ -198,6 +199,7 @@ protected: Optional z_index; CSS::TextDecorationLine text_decoration_line { InitialValues::text_decoration_line() }; CSS::TextDecorationStyle text_decoration_style { InitialValues::text_decoration_style() }; + Color text_decoration_color { InitialValues::color() }; CSS::Position position { InitialValues::position() }; Optional width; Optional min_width; @@ -256,6 +258,7 @@ public: void set_text_align(CSS::TextAlign text_align) { m_inherited.text_align = text_align; } void set_text_decoration_line(CSS::TextDecorationLine value) { m_noninherited.text_decoration_line = value; } void set_text_decoration_style(CSS::TextDecorationStyle value) { m_noninherited.text_decoration_style = value; } + void set_text_decoration_color(Color value) { m_noninherited.text_decoration_color = value; } void set_text_transform(CSS::TextTransform value) { m_inherited.text_transform = value; } void set_position(CSS::Position position) { m_noninherited.position = position; } void set_white_space(CSS::WhiteSpace value) { m_inherited.white_space = value; } diff --git a/Userland/Libraries/LibWeb/Layout/Node.cpp b/Userland/Libraries/LibWeb/Layout/Node.cpp index ed677e153e..c4fde9780a 100644 --- a/Userland/Libraries/LibWeb/Layout/Node.cpp +++ b/Userland/Libraries/LibWeb/Layout/Node.cpp @@ -426,6 +426,11 @@ void NodeWithStyle::apply_style(const CSS::StyleProperties& specified_style) computed_values.set_color(specified_style.color_or_fallback(CSS::PropertyID::Color, *this, CSS::InitialValues::color())); + // FIXME: The default text decoration color value is `currentcolor`, but since we can't resolve that easily, + // we just manually grab the value from `color`. This makes it dependent on `color` being + // specified first, so it's far from ideal. + computed_values.set_text_decoration_color(specified_style.color_or_fallback(CSS::PropertyID::TextDecorationColor, *this, computed_values.color())); + computed_values.set_z_index(specified_style.z_index()); computed_values.set_opacity(specified_style.opacity()); if (computed_values.opacity() == 0) diff --git a/Userland/Libraries/LibWeb/Layout/TextNode.cpp b/Userland/Libraries/LibWeb/Layout/TextNode.cpp index 149e1e9318..f1634e6e28 100644 --- a/Userland/Libraries/LibWeb/Layout/TextNode.cpp +++ b/Userland/Libraries/LibWeb/Layout/TextNode.cpp @@ -68,17 +68,19 @@ void TextNode::paint_text_decoration(Gfx::Painter& painter, LineBoxFragment cons return; } + auto line_color = computed_values().text_decoration_color(); + switch (computed_values().text_decoration_style()) { // FIXME: Implement the other styles case CSS::TextDecorationStyle::Solid: case CSS::TextDecorationStyle::Double: case CSS::TextDecorationStyle::Dashed: case CSS::TextDecorationStyle::Dotted: - painter.draw_line(line_start_point, line_end_point, computed_values().color()); + painter.draw_line(line_start_point, line_end_point, line_color); break; case CSS::TextDecorationStyle::Wavy: // FIXME: There is a thing called text-decoration-thickness which also affects the amplitude here. - painter.draw_triangle_wave(line_start_point, line_end_point, computed_values().color(), 2); + painter.draw_triangle_wave(line_start_point, line_end_point, line_color, 2); break; } }