LibWeb: Parse the CSS align-content property

6 files changed, 30 insertions, 0 deletions

diff --git a/Userland/Libraries/LibWeb/CSS/ComputedValues.h b/Userland/Libraries/LibWeb/CSS/ComputedValues.h
index 3ae07316af..a7456e241f 100644
--- a/Userland/Libraries/LibWeb/CSS/ComputedValues.h
+++ b/Userland/Libraries/LibWeb/CSS/ComputedValues.h
@@ -42,6 +42,7 @@ public:
     static CSS::FlexWrap flex_wrap() { return CSS::FlexWrap::Nowrap; }
     static CSS::ImageRendering image_rendering() { return CSS::ImageRendering::Auto; }
     static CSS::JustifyContent justify_content() { return CSS::JustifyContent::FlexStart; }
+    static CSS::AlignContent align_content() { return CSS::AlignContent::Stretch; }
     static CSS::AlignItems align_items() { return CSS::AlignItems::Stretch; }
     static CSS::AlignSelf align_self() { return CSS::AlignSelf::Auto; }
     static CSS::Appearance appearance() { return CSS::Appearance::Auto; }
@@ -163,6 +164,7 @@ public:
     float flex_grow() const { return m_noninherited.flex_grow; }
     float flex_shrink() const { return m_noninherited.flex_shrink; }
     int order() const { return m_noninherited.order; }
+    CSS::AlignContent align_content() const { return m_noninherited.align_content; }
     CSS::AlignItems align_items() const { return m_noninherited.align_items; }
     CSS::AlignSelf align_self() const { return m_noninherited.align_self; }
     CSS::Appearance appearance() const { return m_noninherited.appearance; }
@@ -288,6 +290,7 @@ protected:
         float flex_grow { InitialValues::flex_grow() };
         float flex_shrink { InitialValues::flex_shrink() };
         int order { InitialValues::order() };
+        CSS::AlignContent align_content { InitialValues::align_content() };
         CSS::AlignItems align_items { InitialValues::align_items() };
         CSS::AlignSelf align_self { InitialValues::align_self() };
         CSS::Appearance appearance { InitialValues::appearance() };
@@ -367,6 +370,7 @@ public:
     void set_flex_grow(float value) { m_noninherited.flex_grow = value; }
     void set_flex_shrink(float value) { m_noninherited.flex_shrink = value; }
     void set_order(int value) { m_noninherited.order = value; }
+    void set_align_content(CSS::AlignContent value) { m_noninherited.align_content = value; }
     void set_align_items(CSS::AlignItems value) { m_noninherited.align_items = value; }
     void set_align_self(CSS::AlignSelf value) { m_noninherited.align_self = value; }
     void set_appearance(CSS::Appearance value) { m_noninherited.appearance = value; }
diff --git a/Userland/Libraries/LibWeb/CSS/Enums.json b/Userland/Libraries/LibWeb/CSS/Enums.json
index 20cd77adbd..0ddd90f0ce 100644
--- a/Userland/Libraries/LibWeb/CSS/Enums.json
+++ b/Userland/Libraries/LibWeb/CSS/Enums.json
@@ -1,4 +1,12 @@
 {
+    "align-content": [
+        "flex-start",
+        "flex-end",
+        "center",
+        "space-between",
+        "space-around",
+        "stretch"
+    ],
     "align-items": [
         "baseline",
         "center",
diff --git a/Userland/Libraries/LibWeb/CSS/Properties.json b/Userland/Libraries/LibWeb/CSS/Properties.json
index 5550db5357..dc5d4bc74c 100644
--- a/Userland/Libraries/LibWeb/CSS/Properties.json
+++ b/Userland/Libraries/LibWeb/CSS/Properties.json
@@ -1,4 +1,11 @@
 {
+  "align-content": {
+    "inherited": false,
+    "initial": "stretch",
+    "valid-types": [
+      "align-content"
+    ]
+  },
   "align-items": {
     "inherited": false,
     "initial": "stretch",
diff --git a/Userland/Libraries/LibWeb/CSS/StyleProperties.cpp b/Userland/Libraries/LibWeb/CSS/StyleProperties.cpp
index ed2d2bafbd..68a726d8cb 100644
--- a/Userland/Libraries/LibWeb/CSS/StyleProperties.cpp
+++ b/Userland/Libraries/LibWeb/CSS/StyleProperties.cpp
@@ -349,6 +349,12 @@ CSS::TransformOrigin StyleProperties::transform_origin() const
     return { x_value.value(), y_value.value() };
 }
 
+Optional<CSS::AlignContent> StyleProperties::align_content() const
+{
+    auto value = property(CSS::PropertyID::AlignContent);
+    return value_id_to_align_content(value->to_identifier());
+}
+
 Optional<CSS::AlignItems> StyleProperties::align_items() const
 {
     auto value = property(CSS::PropertyID::AlignItems);
diff --git a/Userland/Libraries/LibWeb/CSS/StyleProperties.h b/Userland/Libraries/LibWeb/CSS/StyleProperties.h
index 81dbe2619b..316709dca7 100644
--- a/Userland/Libraries/LibWeb/CSS/StyleProperties.h
+++ b/Userland/Libraries/LibWeb/CSS/StyleProperties.h
@@ -68,6 +68,7 @@ public:
     float flex_grow() const;
     float flex_shrink() const;
     int order() const;
+    Optional<CSS::AlignContent> align_content() const;
     Optional<CSS::AlignItems> align_items() const;
     Optional<CSS::AlignSelf> align_self() const;
     Optional<CSS::Appearance> appearance() const;
diff --git a/Userland/Libraries/LibWeb/Layout/Node.cpp b/Userland/Libraries/LibWeb/Layout/Node.cpp
index af6662d0e8..bcca562761 100644
--- a/Userland/Libraries/LibWeb/Layout/Node.cpp
+++ b/Userland/Libraries/LibWeb/Layout/Node.cpp
@@ -398,6 +398,10 @@ void NodeWithStyle::apply_style(const CSS::StyleProperties& computed_style)
     if (justify_content.has_value())
         computed_values.set_justify_content(justify_content.value());
 
+    auto align_content = computed_style.align_content();
+    if (align_content.has_value())
+        computed_values.set_align_content(align_content.value());
+
     auto align_items = computed_style.align_items();
     if (align_items.has_value())
         computed_values.set_align_items(align_items.value());