LibHTML: Implement the <hr> element

This also meant I had to implement basic support for the border-styles
"inset" and "outset". If it's neither of those, we default to "solid".

Libraries/LibHTML/CSS/Default.css

@@ -89,3 +89,9 @@ a {
     color: #0000ff;
     text-decoration: underline;
 }
+
+hr {
+    border-width: 1;
+    border-color: #888888;
+    border-style: inset;
+}

Libraries/LibHTML/DOM/HTMLHRElement.cpp

@@ -0,0 +1,10 @@
+#include <LibHTML/DOM/HTMLHRElement.h>
+
+HTMLHRElement::HTMLHRElement(Document& document, const String& tag_name)
+    : HTMLElement(document, tag_name)
+{
+}
+
+HTMLHRElement::~HTMLHRElement()
+{
+}

Libraries/LibHTML/DOM/HTMLHRElement.h

@@ -0,0 +1,9 @@
+#pragma once
+
+#include <LibHTML/DOM/HTMLElement.h>
+
+class HTMLHRElement : public HTMLElement {
+public:
+    HTMLHRElement(Document&, const String& tag_name);
+    virtual ~HTMLHRElement() override;
+};

Libraries/LibHTML/Layout/LayoutNode.cpp

@@ -56,13 +56,34 @@ void LayoutNode::render(RenderingContext& context)
 
     auto border_width_value = style_properties().property("border-width");
     auto border_color_value = style_properties().property("border-color");
+    auto border_style_value = style_properties().property("border-style");
     if (border_width_value.has_value() && border_color_value.has_value()) {
         int border_width = border_width_value.value()->to_length().to_px();
         Color border_color = border_color_value.value()->to_color();
-        context.painter().draw_line(padded_rect.top_left(), padded_rect.top_right(), border_color, border_width);
+
-        context.painter().draw_line(padded_rect.top_right(), padded_rect.bottom_right(), border_color, border_width);
+        if (border_style_value.has_value() && border_style_value.value()->to_string() == "inset") {
-        context.painter().draw_line(padded_rect.bottom_right(), padded_rect.bottom_left(), border_color, border_width);
+            // border-style: inset
-        context.painter().draw_line(padded_rect.bottom_left(), padded_rect.top_left(), border_color, border_width);
+            auto shadow_color = Color::from_rgb(0x888888);
+            auto highlight_color = Color::from_rgb(0x5a5a5a);
+            context.painter().draw_line(padded_rect.top_left(), padded_rect.top_right(), highlight_color, border_width);
+            context.painter().draw_line(padded_rect.top_right(), padded_rect.bottom_right(), shadow_color, border_width);
+            context.painter().draw_line(padded_rect.bottom_right(), padded_rect.bottom_left(), shadow_color, border_width);
+            context.painter().draw_line(padded_rect.bottom_left(), padded_rect.top_left(), highlight_color, border_width);
+        } else if (border_style_value.has_value() && border_style_value.value()->to_string() == "outset") {
+            // border-style: outset
+            auto highlight_color = Color::from_rgb(0x888888);
+            auto shadow_color = Color::from_rgb(0x5a5a5a);
+            context.painter().draw_line(padded_rect.top_left(), padded_rect.top_right(), highlight_color, border_width);
+            context.painter().draw_line(padded_rect.top_right(), padded_rect.bottom_right(), shadow_color, border_width);
+            context.painter().draw_line(padded_rect.bottom_right(), padded_rect.bottom_left(), shadow_color, border_width);
+            context.painter().draw_line(padded_rect.bottom_left(), padded_rect.top_left(), highlight_color, border_width);
+        } else {
+            // border-style: solid
+            context.painter().draw_line(padded_rect.top_left(), padded_rect.top_right(), border_color, border_width);
+            context.painter().draw_line(padded_rect.top_right(), padded_rect.bottom_right(), border_color, border_width);
+            context.painter().draw_line(padded_rect.bottom_right(), padded_rect.bottom_left(), border_color, border_width);
+            context.painter().draw_line(padded_rect.bottom_left(), padded_rect.top_left(), border_color, border_width);
+        }
     }
 
     // TODO: render our border

Libraries/LibHTML/Makefile.shared

@@ -6,6 +6,7 @@ LIBHTML_OBJS = \
     DOM/HTMLAnchorElement.o \
     DOM/HTMLHeadingElement.o \
     DOM/HTMLHeadElement.o \
+    DOM/HTMLHRElement.o \
     DOM/HTMLHtmlElement.o \
     DOM/HTMLStyleElement.o \
     DOM/HTMLTitleElement.o \

Libraries/LibHTML/Parser/HTMLParser.cpp

@@ -3,6 +3,7 @@
 #include <AK/StringBuilder.h>
 #include <LibHTML/DOM/Element.h>
 #include <LibHTML/DOM/HTMLAnchorElement.h>
+#include <LibHTML/DOM/HTMLHRElement.h>
 #include <LibHTML/DOM/HTMLHeadElement.h>
 #include <LibHTML/DOM/HTMLHeadingElement.h>
 #include <LibHTML/DOM/HTMLHtmlElement.h>
@@ -22,6 +23,8 @@ static NonnullRefPtr<Element> create_element(Document& document, const String& t
         return adopt(*new HTMLHtmlElement(document, tag_name));
     if (lowercase_tag_name == "head")
         return adopt(*new HTMLHeadElement(document, tag_name));
+    if (lowercase_tag_name == "hr")
+        return adopt(*new HTMLHRElement(document, tag_name));
     if (lowercase_tag_name == "style")
         return adopt(*new HTMLStyleElement(document, tag_name));
     if (lowercase_tag_name == "title")