diff --git a/Userland/Libraries/LibWeb/CSS/ComputedValues.h b/Userland/Libraries/LibWeb/CSS/ComputedValues.h index 2a49a49464c..69d912ef83d 100644 --- a/Userland/Libraries/LibWeb/CSS/ComputedValues.h +++ b/Userland/Libraries/LibWeb/CSS/ComputedValues.h @@ -62,6 +62,10 @@ public: static CSS::Length max_height() { return CSS::Length::make_auto(); } static Vector grid_template_columns() { return Vector {}; } static Vector grid_template_rows() { return Vector {}; } + static CSS::GridTrackPlacement grid_column_end() { return CSS::GridTrackPlacement::make_auto(); } + static CSS::GridTrackPlacement grid_column_start() { return CSS::GridTrackPlacement::make_auto(); } + static CSS::GridTrackPlacement grid_row_end() { return CSS::GridTrackPlacement::make_auto(); } + static CSS::GridTrackPlacement grid_row_start() { return CSS::GridTrackPlacement::make_auto(); } }; struct BackgroundLayerData { @@ -174,6 +178,10 @@ public: Variant const& vertical_align() const { return m_noninherited.vertical_align; } Vector const& grid_template_columns() const { return m_noninherited.grid_template_columns; } Vector const& grid_template_rows() const { return m_noninherited.grid_template_rows; } + CSS::GridTrackPlacement const& grid_column_end() const { return m_noninherited.grid_column_end; } + CSS::GridTrackPlacement const& grid_column_start() const { return m_noninherited.grid_column_start; } + CSS::GridTrackPlacement const& grid_row_end() const { return m_noninherited.grid_row_end; } + CSS::GridTrackPlacement const& grid_row_start() const { return m_noninherited.grid_row_start; } CSS::LengthBox const& inset() const { return m_noninherited.inset; } const CSS::LengthBox& margin() const { return m_noninherited.margin; } @@ -290,6 +298,10 @@ protected: Variant vertical_align { InitialValues::vertical_align() }; Vector grid_template_columns; Vector grid_template_rows; + CSS::GridTrackPlacement grid_column_end { InitialValues::grid_column_end() }; + CSS::GridTrackPlacement grid_column_start { InitialValues::grid_column_start() }; + CSS::GridTrackPlacement grid_row_end { InitialValues::grid_row_end() }; + CSS::GridTrackPlacement grid_row_start { InitialValues::grid_row_start() }; } m_noninherited; }; @@ -362,6 +374,10 @@ public: void set_visibility(CSS::Visibility value) { m_inherited.visibility = value; } void set_grid_template_columns(Vector value) { m_noninherited.grid_template_columns = value; } void set_grid_template_rows(Vector value) { m_noninherited.grid_template_rows = value; } + void set_grid_column_end(CSS::GridTrackPlacement value) { m_noninherited.grid_column_end = value; } + void set_grid_column_start(CSS::GridTrackPlacement value) { m_noninherited.grid_column_start = value; } + void set_grid_row_end(CSS::GridTrackPlacement value) { m_noninherited.grid_row_end = value; } + void set_grid_row_start(CSS::GridTrackPlacement value) { m_noninherited.grid_row_start = value; } void set_fill(Color value) { m_inherited.fill = value; } void set_stroke(Color value) { m_inherited.stroke = value; } diff --git a/Userland/Libraries/LibWeb/CSS/Parser/Parser.cpp b/Userland/Libraries/LibWeb/CSS/Parser/Parser.cpp index 12f1ae4eb0f..d7a4b563b91 100644 --- a/Userland/Libraries/LibWeb/CSS/Parser/Parser.cpp +++ b/Userland/Libraries/LibWeb/CSS/Parser/Parser.cpp @@ -5325,6 +5325,33 @@ RefPtr Parser::parse_grid_track_sizes(Vector const& return GridTrackSizeStyleValue::create(params); } +RefPtr Parser::parse_grid_track_placement(Vector const& component_values) +{ + auto tokens = TokenStream { component_values }; + auto current_token = tokens.next_token().token(); + + if (!tokens.has_next_token()) { + if (current_token.to_string() == "auto"sv) + return GridTrackPlacementStyleValue::create(CSS::GridTrackPlacement()); + if (current_token.is(Token::Type::Number) && current_token.number().is_integer()) + return GridTrackPlacementStyleValue::create(CSS::GridTrackPlacement(static_cast(current_token.number_value()))); + return {}; + } + + auto first_grid_track_placement = CSS::GridTrackPlacement(); + if (current_token.to_string() == "span"sv) { + first_grid_track_placement.set_has_span(true); + tokens.skip_whitespace(); + current_token = tokens.next_token().token(); + } + if (current_token.is(Token::Type::Number) && current_token.number().is_integer()) + first_grid_track_placement.set_position(static_cast(current_token.number_value())); + + if (!tokens.has_next_token()) + return GridTrackPlacementStyleValue::create(first_grid_track_placement); + return {}; +} + Parser::ParseErrorOr> Parser::parse_css_value(PropertyID property_id, TokenStream& tokens) { auto function_contains_var_or_attr = [](Function const& function, auto&& recurse) -> bool { @@ -5455,6 +5482,22 @@ Parser::ParseErrorOr> Parser::parse_css_value(Property if (auto parsed_value = parse_font_family_value(component_values)) return parsed_value.release_nonnull(); return ParseError::SyntaxError; + case PropertyID::GridColumnEnd: + if (auto parsed_value = parse_grid_track_placement(component_values)) + return parsed_value.release_nonnull(); + return ParseError::SyntaxError; + case PropertyID::GridColumnStart: + if (auto parsed_value = parse_grid_track_placement(component_values)) + return parsed_value.release_nonnull(); + return ParseError::SyntaxError; + case PropertyID::GridRowEnd: + if (auto parsed_value = parse_grid_track_placement(component_values)) + return parsed_value.release_nonnull(); + return ParseError::SyntaxError; + case PropertyID::GridRowStart: + if (auto parsed_value = parse_grid_track_placement(component_values)) + return parsed_value.release_nonnull(); + return ParseError::SyntaxError; case PropertyID::GridTemplateColumns: if (auto parsed_value = parse_grid_track_sizes(component_values)) return parsed_value.release_nonnull(); diff --git a/Userland/Libraries/LibWeb/CSS/Parser/Parser.h b/Userland/Libraries/LibWeb/CSS/Parser/Parser.h index 521f69153c6..2e9c1453f41 100644 --- a/Userland/Libraries/LibWeb/CSS/Parser/Parser.h +++ b/Userland/Libraries/LibWeb/CSS/Parser/Parser.h @@ -360,6 +360,7 @@ private: RefPtr parse_transform_value(Vector const&); RefPtr parse_transform_origin_value(Vector const&); RefPtr parse_grid_track_sizes(Vector const&); + RefPtr parse_grid_track_placement(Vector const&); // calc() parsing, according to https://www.w3.org/TR/css-values-3/#calc-syntax OwnPtr parse_calc_sum(TokenStream&); diff --git a/Userland/Libraries/LibWeb/CSS/Properties.json b/Userland/Libraries/LibWeb/CSS/Properties.json index 4a63d5528b8..e32e724bbad 100644 --- a/Userland/Libraries/LibWeb/CSS/Properties.json +++ b/Userland/Libraries/LibWeb/CSS/Properties.json @@ -694,6 +694,46 @@ "normal" ] }, + "grid-column-end": { + "inherited": false, + "initial": "auto", + "valid-identifiers": [ + "auto" + ], + "valid-types": [ + "string" + ] + }, + "grid-column-start": { + "inherited": false, + "initial": "auto", + "valid-identifiers": [ + "auto" + ], + "valid-types": [ + "string" + ] + }, + "grid-row-end": { + "inherited": false, + "initial": "auto", + "valid-identifiers": [ + "auto" + ], + "valid-types": [ + "string" + ] + }, + "grid-row-start": { + "inherited": false, + "initial": "auto", + "valid-identifiers": [ + "auto" + ], + "valid-types": [ + "string" + ] + }, "grid-template-columns": { "inherited": false, "initial": "auto", diff --git a/Userland/Libraries/LibWeb/CSS/ResolvedCSSStyleDeclaration.cpp b/Userland/Libraries/LibWeb/CSS/ResolvedCSSStyleDeclaration.cpp index f2127aaec91..21edc2f84d2 100644 --- a/Userland/Libraries/LibWeb/CSS/ResolvedCSSStyleDeclaration.cpp +++ b/Userland/Libraries/LibWeb/CSS/ResolvedCSSStyleDeclaration.cpp @@ -295,6 +295,14 @@ RefPtr ResolvedCSSStyleDeclaration::style_value_for_property(Layout: return IdentifierStyleValue::create(to_value_id(layout_node.computed_values().flex_wrap())); case CSS::PropertyID::Float: return IdentifierStyleValue::create(to_value_id(layout_node.computed_values().float_())); + case CSS::PropertyID::GridColumnEnd: + return GridTrackPlacementStyleValue::create(layout_node.computed_values().grid_column_end()); + case CSS::PropertyID::GridColumnStart: + return GridTrackPlacementStyleValue::create(layout_node.computed_values().grid_column_start()); + case CSS::PropertyID::GridRowEnd: + return GridTrackPlacementStyleValue::create(layout_node.computed_values().grid_row_end()); + case CSS::PropertyID::GridRowStart: + return GridTrackPlacementStyleValue::create(layout_node.computed_values().grid_row_start()); case CSS::PropertyID::GridTemplateColumns: return GridTrackSizeStyleValue::create(layout_node.computed_values().grid_template_columns()); case CSS::PropertyID::GridTemplateRows: diff --git a/Userland/Libraries/LibWeb/CSS/StyleProperties.cpp b/Userland/Libraries/LibWeb/CSS/StyleProperties.cpp index 2b53473f4bf..24b4a46dea6 100644 --- a/Userland/Libraries/LibWeb/CSS/StyleProperties.cpp +++ b/Userland/Libraries/LibWeb/CSS/StyleProperties.cpp @@ -667,4 +667,28 @@ Vector StyleProperties::grid_template_rows() const return value->as_grid_track_size().grid_track_size(); } +CSS::GridTrackPlacement StyleProperties::grid_column_end() const +{ + auto value = property(CSS::PropertyID::GridColumnEnd); + return value->as_grid_track_placement().grid_track_placement(); +} + +CSS::GridTrackPlacement StyleProperties::grid_column_start() const +{ + auto value = property(CSS::PropertyID::GridColumnStart); + return value->as_grid_track_placement().grid_track_placement(); +} + +CSS::GridTrackPlacement StyleProperties::grid_row_end() const +{ + auto value = property(CSS::PropertyID::GridRowEnd); + return value->as_grid_track_placement().grid_track_placement(); +} + +CSS::GridTrackPlacement StyleProperties::grid_row_start() const +{ + auto value = property(CSS::PropertyID::GridRowStart); + return value->as_grid_track_placement().grid_track_placement(); +} + } diff --git a/Userland/Libraries/LibWeb/CSS/StyleProperties.h b/Userland/Libraries/LibWeb/CSS/StyleProperties.h index 4ddd366f024..72c0db8e378 100644 --- a/Userland/Libraries/LibWeb/CSS/StyleProperties.h +++ b/Userland/Libraries/LibWeb/CSS/StyleProperties.h @@ -83,6 +83,10 @@ public: Optional font_variant() const; Vector grid_template_columns() const; Vector grid_template_rows() const; + CSS::GridTrackPlacement grid_column_end() const; + CSS::GridTrackPlacement grid_column_start() const; + CSS::GridTrackPlacement grid_row_end() const; + CSS::GridTrackPlacement grid_row_start() const; Vector transformations() const; CSS::TransformOrigin transform_origin() const; diff --git a/Userland/Libraries/LibWeb/Layout/Node.cpp b/Userland/Libraries/LibWeb/Layout/Node.cpp index 00a0413253d..23402951e54 100644 --- a/Userland/Libraries/LibWeb/Layout/Node.cpp +++ b/Userland/Libraries/LibWeb/Layout/Node.cpp @@ -527,6 +527,10 @@ void NodeWithStyle::apply_style(const CSS::StyleProperties& computed_style) computed_values.set_content(computed_style.content()); computed_values.set_grid_template_columns(computed_style.grid_template_columns()); computed_values.set_grid_template_rows(computed_style.grid_template_rows()); + computed_values.set_grid_column_end(computed_style.grid_column_end()); + computed_values.set_grid_column_start(computed_style.grid_column_start()); + computed_values.set_grid_row_end(computed_style.grid_row_end()); + computed_values.set_grid_row_start(computed_style.grid_row_start()); if (auto fill = computed_style.property(CSS::PropertyID::Fill); fill->has_color()) computed_values.set_fill(fill->to_color(*this));