diff --git a/Userland/Libraries/LibWeb/CSS/ComputedValues.h b/Userland/Libraries/LibWeb/CSS/ComputedValues.h index 9dc0229afc..9710ba96f3 100644 --- a/Userland/Libraries/LibWeb/CSS/ComputedValues.h +++ b/Userland/Libraries/LibWeb/CSS/ComputedValues.h @@ -46,6 +46,7 @@ public: static Color background_color() { return Color::Transparent; } static CSS::ListStyleType list_style_type() { return CSS::ListStyleType::Disc; } static CSS::FlexDirection flex_direction() { return CSS::FlexDirection::Row; } + static CSS::Overflow overflow() { return CSS::Overflow::Visible; } }; struct BorderData { @@ -83,6 +84,9 @@ public: const BorderData& border_right() const { return m_noninherited.border_right; } const BorderData& border_bottom() const { return m_noninherited.border_bottom; } + CSS::Overflow overflow_x() const { return m_noninherited.overflow_x; } + CSS::Overflow overflow_y() const { return m_noninherited.overflow_y; } + Color color() const { return m_inherited.color; } Color background_color() const { return m_noninherited.background_color; } @@ -126,6 +130,8 @@ protected: BorderData border_bottom; Color background_color { InitialValues::background_color() }; CSS::FlexDirection flex_direction { InitialValues::flex_direction() }; + CSS::Overflow overflow_x { InitialValues::overflow() }; + CSS::Overflow overflow_y { InitialValues::overflow() }; } m_noninherited; }; @@ -153,6 +159,8 @@ public: void set_offset(const CSS::LengthBox& offset) { m_noninherited.offset = offset; } void set_margin(const CSS::LengthBox& margin) { m_noninherited.margin = margin; } void set_padding(const CSS::LengthBox& padding) { m_noninherited.padding = padding; } + void set_overflow_x(CSS::Overflow value) { m_noninherited.overflow_x = value; } + void set_overflow_y(CSS::Overflow value) { m_noninherited.overflow_y = value; } void set_list_style_type(CSS::ListStyleType value) { m_inherited.list_style_type = value; } void set_display(CSS::Display value) { m_noninherited.display = value; } BorderData& border_left() { return m_noninherited.border_left; } diff --git a/Userland/Libraries/LibWeb/CSS/Identifiers.json b/Userland/Libraries/LibWeb/CSS/Identifiers.json index 32f742692c..143905cf75 100644 --- a/Userland/Libraries/LibWeb/CSS/Identifiers.json +++ b/Userland/Libraries/LibWeb/CSS/Identifiers.json @@ -56,6 +56,7 @@ "-libweb-palette-window", "-libweb-palette-window-text", "absolute", + "auto", "blink", "block", "bold", @@ -64,6 +65,7 @@ "capitalize", "center", "circle", + "clip", "column", "column-reverse", "dashed", @@ -102,6 +104,7 @@ "right", "row", "row-reverse", + "scroll", "small", "smaller", "solid", @@ -119,6 +122,7 @@ "table-row-group", "underline", "uppercase", + "visible", "x-large", "x-small", "xx-large", diff --git a/Userland/Libraries/LibWeb/CSS/Properties.json b/Userland/Libraries/LibWeb/CSS/Properties.json index 00fdcb27e6..3fa5add4f5 100644 --- a/Userland/Libraries/LibWeb/CSS/Properties.json +++ b/Userland/Libraries/LibWeb/CSS/Properties.json @@ -271,6 +271,22 @@ "inherited": false, "initial": "0" }, + "overflow": { + "longhands": [ + "overflow-x", + "overflow-y" + ], + "inherited": false, + "initial": "visible" + }, + "overflow-x": { + "inherited": false, + "initial": "visible" + }, + "overflow-y": { + "inherited": false, + "initial": "visible" + }, "padding": { "longhands": [ "padding-top", diff --git a/Userland/Libraries/LibWeb/CSS/StyleProperties.cpp b/Userland/Libraries/LibWeb/CSS/StyleProperties.cpp index 1d0301cfae..bcf79e9ae6 100644 --- a/Userland/Libraries/LibWeb/CSS/StyleProperties.cpp +++ b/Userland/Libraries/LibWeb/CSS/StyleProperties.cpp @@ -497,4 +497,36 @@ Optional StyleProperties::list_style_type() const } } +Optional StyleProperties::overflow_x() const +{ + return overflow(CSS::PropertyID::OverflowX); +} + +Optional StyleProperties::overflow_y() const +{ + return overflow(CSS::PropertyID::OverflowY); +} + +Optional StyleProperties::overflow(CSS::PropertyID property_id) const +{ + auto value = property(property_id); + if (!value.has_value()) + return {}; + + switch (value.value()->to_identifier()) { + case CSS::ValueID::Auto: + return CSS::Overflow::Auto; + case CSS::ValueID::Visible: + return CSS::Overflow::Visible; + case CSS::ValueID::Hidden: + return CSS::Overflow::Hidden; + case CSS::ValueID::Clip: + return CSS::Overflow::Clip; + case CSS::ValueID::Scroll: + return CSS::Overflow::Scroll; + default: + return {}; + } +} + } diff --git a/Userland/Libraries/LibWeb/CSS/StyleProperties.h b/Userland/Libraries/LibWeb/CSS/StyleProperties.h index 24e286b6f7..9777162850 100644 --- a/Userland/Libraries/LibWeb/CSS/StyleProperties.h +++ b/Userland/Libraries/LibWeb/CSS/StyleProperties.h @@ -70,6 +70,8 @@ public: Optional text_transform() const; Optional list_style_type() const; Optional flex_direction() const; + Optional overflow_x() const; + Optional overflow_y() const; const Gfx::Font& font() const { @@ -88,6 +90,7 @@ public: private: HashMap> m_property_values; + Optional overflow(CSS::PropertyID) const; void load_font() const; diff --git a/Userland/Libraries/LibWeb/CSS/StyleResolver.cpp b/Userland/Libraries/LibWeb/CSS/StyleResolver.cpp index aee19b1c12..da6f2a6fd9 100644 --- a/Userland/Libraries/LibWeb/CSS/StyleResolver.cpp +++ b/Userland/Libraries/LibWeb/CSS/StyleResolver.cpp @@ -243,6 +243,12 @@ static void set_property_expanding_shorthands(StyleProperties& style, CSS::Prope return; } + if (property_id == CSS::PropertyID::Overflow) { + style.set_property(CSS::PropertyID::OverflowX, value); + style.set_property(CSS::PropertyID::OverflowY, value); + return; + } + if (property_id == CSS::PropertyID::Border) { set_property_expanding_shorthands(style, CSS::PropertyID::BorderTop, value, document); set_property_expanding_shorthands(style, CSS::PropertyID::BorderRight, value, document); diff --git a/Userland/Libraries/LibWeb/CSS/StyleValue.h b/Userland/Libraries/LibWeb/CSS/StyleValue.h index fa37685dd0..bd41ce925a 100644 --- a/Userland/Libraries/LibWeb/CSS/StyleValue.h +++ b/Userland/Libraries/LibWeb/CSS/StyleValue.h @@ -142,6 +142,14 @@ enum class ListStyleType { Decimal, }; +enum class Overflow : u8 { + Auto, + Clip, + Hidden, + Scroll, + Visible, +}; + class StyleValue : public RefCounted { public: virtual ~StyleValue(); diff --git a/Userland/Libraries/LibWeb/Layout/Node.cpp b/Userland/Libraries/LibWeb/Layout/Node.cpp index cd282b4d69..e44cd2db74 100644 --- a/Userland/Libraries/LibWeb/Layout/Node.cpp +++ b/Userland/Libraries/LibWeb/Layout/Node.cpp @@ -260,6 +260,14 @@ void NodeWithStyle::apply_style(const CSS::StyleProperties& specified_style) if (clear.has_value()) computed_values.set_clear(clear.value()); + auto overflow_x = specified_style.overflow_x(); + if (overflow_x.has_value()) + computed_values.set_overflow_x(overflow_x.value()); + + auto overflow_y = specified_style.overflow_y(); + if (overflow_y.has_value()) + computed_values.set_overflow_y(overflow_y.value()); + auto text_decoration_line = specified_style.text_decoration_line(); if (text_decoration_line.has_value()) computed_values.set_text_decoration_line(text_decoration_line.value());