LibWeb: Put final foreground/background colors in LayoutStyle

This way we don't have to look them up in the CSS::StyleProperties
every time we want to paint with them.

Libraries/LibWeb/DOM/Document.cpp

@@ -327,11 +327,10 @@ Color Document::background_color(const Palette& palette) const
     if (!body_layout_node)
         return default_color;
 
-    auto background_color = body_layout_node->specified_style().property(CSS::PropertyID::BackgroundColor);
-    if (!background_color.has_value() || !background_color.value()->is_color())
+    auto color = body_layout_node->style().background_color();
+    if (!color.alpha())
         return default_color;
-
-    return background_color.value()->to_color(*this);
+    return color;
 }
 
 RefPtr<Gfx::Bitmap> Document::background_image() const

Libraries/LibWeb/Layout/Box.cpp

@@ -50,11 +50,7 @@ void Box::paint(PaintContext& context, PaintPhase phase)
     padded_rect.set_height(height() + box_model().padding.top + box_model().padding.bottom);
 
     if (phase == PaintPhase::Background && !is_body()) {
-        // FIXME: We should paint the body here too, but that currently happens at the view layer.
-        auto bgcolor = specified_style().property(CSS::PropertyID::BackgroundColor);
-        if (bgcolor.has_value() && bgcolor.value()->is_color()) {
-            context.painter().fill_rect(enclosing_int_rect(padded_rect), bgcolor.value()->to_color(document()));
-        }
+        context.painter().fill_rect(enclosing_int_rect(padded_rect), style().background_color());
 
         auto bgimage = specified_style().property(CSS::PropertyID::BackgroundImage);
         if (bgimage.has_value() && bgimage.value()->is_image()) {

Libraries/LibWeb/Layout/InlineNode.cpp

@@ -64,9 +64,7 @@ void InlineNode::paint_fragment(PaintContext& context, const LineBoxFragment& fr
     auto& painter = context.painter();
 
     if (phase == PaintPhase::Background) {
-        auto background_color = specified_style().property(CSS::PropertyID::BackgroundColor);
-        if (background_color.has_value() && background_color.value()->is_color())
-            painter.fill_rect(enclosing_int_rect(fragment.absolute_rect()), background_color.value()->to_color(document()));
+        painter.fill_rect(enclosing_int_rect(fragment.absolute_rect()), style().background_color());
     }
 }
 

Libraries/LibWeb/Layout/LayoutStyle.h

@@ -41,6 +41,8 @@ public:
     static CSS::Position position() { return CSS::Position::Static; }
     static CSS::TextDecorationLine text_decoration_line() { return CSS::TextDecorationLine::None; }
     static CSS::TextTransform text_transform() { return CSS::TextTransform::None; }
+    static Color color() { return Color::Black; }
+    static Color background_color() { return Color::Transparent; }
 };
 
 struct BorderData {
@@ -76,6 +78,9 @@ public:
     const BorderData& border_right() const { return m_border_right; }
     const BorderData& border_bottom() const { return m_border_bottom; }
 
+    Color color() const { return m_color; }
+    Color background_color() const { return m_background_color; }
+
 protected:
     CSS::Float m_float { InitialValues::float_() };
     CSS::Clear m_clear { InitialValues::clear() };
@@ -98,6 +103,8 @@ protected:
     BorderData m_border_top;
     BorderData m_border_right;
     BorderData m_border_bottom;
+    Color m_color { InitialValues::color() };
+    Color m_background_color { InitialValues::background_color() };
 };
 
 class ImmutableLayoutStyle final : public LayoutStyle {
@@ -105,6 +112,8 @@ class ImmutableLayoutStyle final : public LayoutStyle {
 
 class MutableLayoutStyle final : public LayoutStyle {
 public:
+    void set_color(const Color& color) { m_color = color; }
+    void set_background_color(const Color& color) { m_background_color = color; }
     void set_float(CSS::Float value) { m_float = value; }
     void set_clear(CSS::Clear value) { m_clear = value; }
     void set_z_index(Optional<int> value) { m_z_index = value; }

Libraries/LibWeb/Layout/ListItemMarkerBox.cpp

@@ -45,7 +45,7 @@ void ListItemMarkerBox::paint(PaintContext& context, PaintPhase phase)
     Gfx::IntRect bullet_rect { 0, 0, 4, 4 };
     bullet_rect.center_within(enclosing_int_rect(absolute_rect()));
     // FIXME: It would be nicer to not have to go via the parent here to get our inherited style.
-    auto color = parent()->specified_style().color_or_fallback(CSS::PropertyID::Color, document(), context.palette().base_text());
+    auto color = parent()->style().color();
     context.painter().fill_rect(bullet_rect, color);
 }
 

Libraries/LibWeb/Layout/Node.cpp

@@ -247,6 +247,9 @@ void NodeWithStyle::apply_style(const CSS::StyleProperties& specified_style)
     if (text_transform.has_value())
         style.set_text_transform(text_transform.value());
 
+    style.set_color(specified_style.color_or_fallback(CSS::PropertyID::Color, document(), Color::Transparent));
+    style.set_background_color(specified_style.color_or_fallback(CSS::PropertyID::BackgroundColor, document(), Color::Transparent));
+
     style.set_z_index(specified_style.z_index());
     style.set_width(specified_style.length_or_fallback(CSS::PropertyID::Width, {}));
     style.set_min_width(specified_style.length_or_fallback(CSS::PropertyID::MinWidth, {}));

Libraries/LibWeb/Layout/TextNode.cpp

@@ -72,20 +72,17 @@ void TextNode::paint_fragment(PaintContext& context, const LineBoxFragment& frag
     auto& painter = context.painter();
 
     if (phase == PaintPhase::Background) {
-        auto background_color = specified_style().property(CSS::PropertyID::BackgroundColor);
-        if (background_color.has_value() && background_color.value()->is_color())
-            painter.fill_rect(enclosing_int_rect(fragment.absolute_rect()), background_color.value()->to_color(document()));
+        painter.fill_rect(enclosing_int_rect(fragment.absolute_rect()), style().background_color());
     }
 
     if (phase == PaintPhase::Foreground) {
         painter.set_font(specified_style().font());
-        auto color = specified_style().color_or_fallback(CSS::PropertyID::Color, document(), context.palette().base_text());
 
         if (document().inspected_node() == &dom_node())
             context.painter().draw_rect(enclosing_int_rect(fragment.absolute_rect()), Color::Magenta);
 
         if (style().text_decoration_line() == CSS::TextDecorationLine::Underline)
-            painter.draw_line(enclosing_int_rect(fragment.absolute_rect()).bottom_left().translated(0, 1), enclosing_int_rect(fragment.absolute_rect()).bottom_right().translated(0, 1), color);
+            painter.draw_line(enclosing_int_rect(fragment.absolute_rect()).bottom_left().translated(0, 1), enclosing_int_rect(fragment.absolute_rect()).bottom_right().translated(0, 1), style().color());
 
         // FIXME: text-transform should be done already in layout, since uppercase glyphs may be wider than lowercase, etc.
         auto text = m_text_for_rendering;
@@ -95,7 +92,7 @@ void TextNode::paint_fragment(PaintContext& context, const LineBoxFragment& frag
         if (text_transform == CSS::TextTransform::Lowercase)
             text = m_text_for_rendering.to_lowercase();
 
-        painter.draw_text(enclosing_int_rect(fragment.absolute_rect()), text.substring_view(fragment.start(), fragment.length()), Gfx::TextAlignment::CenterLeft, color);
+        painter.draw_text(enclosing_int_rect(fragment.absolute_rect()), text.substring_view(fragment.start(), fragment.length()), Gfx::TextAlignment::CenterLeft, style().color());
 
         auto selection_rect = fragment.selection_rect(specified_style().font());
         if (!selection_rect.is_empty()) {
@@ -133,8 +130,7 @@ void TextNode::paint_cursor_if_needed(PaintContext& context, const LineBoxFragme
     float cursor_height = fragment_rect.height();
     Gfx::IntRect cursor_rect(cursor_x, cursor_top, 1, cursor_height);
 
-    auto color = specified_style().color_or_fallback(CSS::PropertyID::Color, document(), context.palette().base_text());
-    context.painter().draw_rect(cursor_rect, color);
+    context.painter().draw_rect(cursor_rect, style().color());
 }
 
 template<typename Callback>