mirror of
https://github.com/RGBCube/serenity
synced 2025-05-31 03:08:11 +00:00
LibWeb: Use CSS::Size for computed size and max-size values
This patch changes the *computed* representation of the following CSS properties to use CSS::Size: - width, min-width, max-width - height, min-height, max-height A few things had to change in order for things to keep working, but I tried to keep the diff to a minimum. The main trouble was that `min-width` and `max-width` can't actually be `auto`, but they *can* be `none`. We previously treated `auto` as a valid value (and it behaved mostly like `none`).
This commit is contained in:
Andreas Kling
parent
844321d89f
commit
0843960235
9 changed files with 144 additions and 109 deletions
|
|
@ -10,6 +10,7 @@
|
|||
#include <LibWeb/CSS/BackdropFilter.h>
|
||||
#include <LibWeb/CSS/Clip.h>
|
||||
#include <LibWeb/CSS/LengthBox.h>
|
||||
#include <LibWeb/CSS/Size.h>
|
||||
#include <LibWeb/CSS/StyleValue.h>
|
||||
|
||||
namespace Web::CSS {
|
||||
|
|
@ -56,12 +57,12 @@ public:
|
|||
static CSS::LengthBox inset() { return { CSS::Length::make_auto(), CSS::Length::make_auto(), CSS::Length::make_auto(), CSS::Length::make_auto() }; }
|
||||
static CSS::LengthBox margin() { return { CSS::Length::make_px(0), CSS::Length::make_px(0), CSS::Length::make_px(0), CSS::Length::make_px(0) }; }
|
||||
static CSS::LengthBox padding() { return { CSS::Length::make_px(0), CSS::Length::make_px(0), CSS::Length::make_px(0), CSS::Length::make_px(0) }; }
|
||||
static CSS::Length width() { return CSS::Length::make_auto(); }
|
||||
static CSS::Length min_width() { return CSS::Length::make_auto(); }
|
||||
static CSS::Length max_width() { return CSS::Length::make_auto(); }
|
||||
static CSS::Length height() { return CSS::Length::make_auto(); }
|
||||
static CSS::Length min_height() { return CSS::Length::make_auto(); }
|
||||
static CSS::Length max_height() { return CSS::Length::make_auto(); }
|
||||
static CSS::Size width() { return CSS::Size::make_auto(); }
|
||||
static CSS::Size min_width() { return CSS::Size::make_auto(); }
|
||||
static CSS::Size max_width() { return CSS::Size::make_none(); }
|
||||
static CSS::Size height() { return CSS::Size::make_auto(); }
|
||||
static CSS::Size min_height() { return CSS::Size::make_auto(); }
|
||||
static CSS::Size max_height() { return CSS::Size::make_none(); }
|
||||
static Vector<CSS::GridTrackSize> grid_template_columns() { return Vector<CSS::GridTrackSize> {}; }
|
||||
static Vector<CSS::GridTrackSize> grid_template_rows() { return Vector<CSS::GridTrackSize> {}; }
|
||||
static CSS::GridTrackPlacement grid_column_end() { return CSS::GridTrackPlacement::make_auto(); }
|
||||
|
|
@ -172,12 +173,12 @@ public:
|
|||
CSS::BackdropFilter const& backdrop_filter() const { return m_noninherited.backdrop_filter; }
|
||||
Vector<ShadowData> const& box_shadow() const { return m_noninherited.box_shadow; }
|
||||
CSS::BoxSizing box_sizing() const { return m_noninherited.box_sizing; }
|
||||
CSS::LengthPercentage const& width() const { return m_noninherited.width; }
|
||||
CSS::LengthPercentage const& min_width() const { return m_noninherited.min_width; }
|
||||
CSS::LengthPercentage const& max_width() const { return m_noninherited.max_width; }
|
||||
CSS::LengthPercentage const& height() const { return m_noninherited.height; }
|
||||
CSS::LengthPercentage const& min_height() const { return m_noninherited.min_height; }
|
||||
CSS::LengthPercentage const& max_height() const { return m_noninherited.max_height; }
|
||||
CSS::Size const& width() const { return m_noninherited.width; }
|
||||
CSS::Size const& min_width() const { return m_noninherited.min_width; }
|
||||
CSS::Size const& max_width() const { return m_noninherited.max_width; }
|
||||
CSS::Size const& height() const { return m_noninherited.height; }
|
||||
CSS::Size const& min_height() const { return m_noninherited.min_height; }
|
||||
CSS::Size const& max_height() const { return m_noninherited.max_height; }
|
||||
Variant<CSS::VerticalAlign, CSS::LengthPercentage> const& vertical_align() const { return m_noninherited.vertical_align; }
|
||||
Vector<CSS::GridTrackSize> const& grid_template_columns() const { return m_noninherited.grid_template_columns; }
|
||||
Vector<CSS::GridTrackSize> const& grid_template_rows() const { return m_noninherited.grid_template_rows; }
|
||||
|
|
@ -261,12 +262,12 @@ protected:
|
|||
Color text_decoration_color { InitialValues::color() };
|
||||
Vector<ShadowData> text_shadow {};
|
||||
CSS::Position position { InitialValues::position() };
|
||||
CSS::LengthPercentage width { InitialValues::width() };
|
||||
CSS::LengthPercentage min_width { InitialValues::min_width() };
|
||||
CSS::LengthPercentage max_width { InitialValues::max_width() };
|
||||
CSS::LengthPercentage height { InitialValues::height() };
|
||||
CSS::LengthPercentage min_height { InitialValues::min_height() };
|
||||
CSS::LengthPercentage max_height { InitialValues::max_height() };
|
||||
CSS::Size width { InitialValues::width() };
|
||||
CSS::Size min_width { InitialValues::min_width() };
|
||||
CSS::Size max_width { InitialValues::max_width() };
|
||||
CSS::Size height { InitialValues::height() };
|
||||
CSS::Size min_height { InitialValues::min_height() };
|
||||
CSS::Size max_height { InitialValues::max_height() };
|
||||
CSS::LengthBox inset { InitialValues::inset() };
|
||||
CSS::LengthBox margin { InitialValues::margin() };
|
||||
CSS::LengthBox padding { InitialValues::padding() };
|
||||
|
|
@ -338,12 +339,12 @@ public:
|
|||
void set_text_shadow(Vector<ShadowData>&& value) { m_noninherited.text_shadow = move(value); }
|
||||
void set_position(CSS::Position position) { m_noninherited.position = position; }
|
||||
void set_white_space(CSS::WhiteSpace value) { m_inherited.white_space = value; }
|
||||
void set_width(CSS::LengthPercentage const& width) { m_noninherited.width = width; }
|
||||
void set_min_width(CSS::LengthPercentage const& width) { m_noninherited.min_width = width; }
|
||||
void set_max_width(CSS::LengthPercentage const& width) { m_noninherited.max_width = width; }
|
||||
void set_height(CSS::LengthPercentage const& height) { m_noninherited.height = height; }
|
||||
void set_min_height(CSS::LengthPercentage const& height) { m_noninherited.min_height = height; }
|
||||
void set_max_height(CSS::LengthPercentage const& height) { m_noninherited.max_height = height; }
|
||||
void set_width(CSS::Size const& width) { m_noninherited.width = width; }
|
||||
void set_min_width(CSS::Size const& width) { m_noninherited.min_width = width; }
|
||||
void set_max_width(CSS::Size const& width) { m_noninherited.max_width = width; }
|
||||
void set_height(CSS::Size const& height) { m_noninherited.height = height; }
|
||||
void set_min_height(CSS::Size const& height) { m_noninherited.min_height = height; }
|
||||
void set_max_height(CSS::Size const& height) { m_noninherited.max_height = height; }
|
||||
void set_inset(CSS::LengthBox const& inset) { m_noninherited.inset = inset; }
|
||||
void set_margin(const CSS::LengthBox& margin) { m_noninherited.margin = margin; }
|
||||
void set_padding(const CSS::LengthBox& padding) { m_noninherited.padding = padding; }
|
||||
|
|
|
|||
|
|
@ -138,6 +138,24 @@ static NonnullRefPtr<StyleValue> style_value_for_length_percentage(LengthPercent
|
|||
return length_percentage.calculated();
|
||||
}
|
||||
|
||||
static NonnullRefPtr<StyleValue> style_value_for_size(CSS::Size const& size)
|
||||
{
|
||||
if (size.is_none())
|
||||
return IdentifierStyleValue::create(ValueID::None);
|
||||
if (size.is_percentage())
|
||||
return PercentageStyleValue::create(size.percentage());
|
||||
if (size.is_length())
|
||||
return LengthStyleValue::create(size.length());
|
||||
if (size.is_auto())
|
||||
return IdentifierStyleValue::create(ValueID::Auto);
|
||||
if (size.is_min_content())
|
||||
return IdentifierStyleValue::create(ValueID::MinContent);
|
||||
if (size.is_max_content())
|
||||
return IdentifierStyleValue::create(ValueID::MaxContent);
|
||||
// FIXME: Support fit-content(<length>)
|
||||
TODO();
|
||||
}
|
||||
|
||||
RefPtr<StyleValue> ResolvedCSSStyleDeclaration::style_value_for_property(Layout::NodeWithStyle const& layout_node, PropertyID property_id) const
|
||||
{
|
||||
switch (property_id) {
|
||||
|
|
@ -349,7 +367,7 @@ RefPtr<StyleValue> ResolvedCSSStyleDeclaration::style_value_for_property(Layout:
|
|||
case CSS::PropertyID::GridTemplateRows:
|
||||
return GridTrackSizeStyleValue::create(layout_node.computed_values().grid_template_rows());
|
||||
case CSS::PropertyID::Height:
|
||||
return style_value_for_length_percentage(layout_node.computed_values().height());
|
||||
return style_value_for_size(layout_node.computed_values().height());
|
||||
case CSS::PropertyID::ImageRendering:
|
||||
return IdentifierStyleValue::create(to_value_id(layout_node.computed_values().image_rendering()));
|
||||
case CSS::PropertyID::JustifyContent:
|
||||
|
|
@ -374,13 +392,13 @@ RefPtr<StyleValue> ResolvedCSSStyleDeclaration::style_value_for_property(Layout:
|
|||
case CSS::PropertyID::MarginTop:
|
||||
return style_value_for_length_percentage(layout_node.computed_values().margin().top());
|
||||
case CSS::PropertyID::MaxHeight:
|
||||
return style_value_for_length_percentage(layout_node.computed_values().max_height());
|
||||
return style_value_for_size(layout_node.computed_values().max_height());
|
||||
case CSS::PropertyID::MaxWidth:
|
||||
return style_value_for_length_percentage(layout_node.computed_values().max_width());
|
||||
return style_value_for_size(layout_node.computed_values().max_width());
|
||||
case CSS::PropertyID::MinHeight:
|
||||
return style_value_for_length_percentage(layout_node.computed_values().min_height());
|
||||
return style_value_for_size(layout_node.computed_values().min_height());
|
||||
case CSS::PropertyID::MinWidth:
|
||||
return style_value_for_length_percentage(layout_node.computed_values().min_width());
|
||||
return style_value_for_size(layout_node.computed_values().min_width());
|
||||
case CSS::PropertyID::Opacity:
|
||||
return NumericStyleValue::create_float(layout_node.computed_values().opacity());
|
||||
case CSS::PropertyID::Order:
|
||||
|
|
@ -470,7 +488,7 @@ RefPtr<StyleValue> ResolvedCSSStyleDeclaration::style_value_for_property(Layout:
|
|||
case CSS::PropertyID::WhiteSpace:
|
||||
return IdentifierStyleValue::create(to_value_id(layout_node.computed_values().white_space()));
|
||||
case CSS::PropertyID::Width:
|
||||
return style_value_for_length_percentage(layout_node.computed_values().width());
|
||||
return style_value_for_size(layout_node.computed_values().width());
|
||||
case CSS::PropertyID::ZIndex: {
|
||||
auto maybe_z_index = layout_node.computed_values().z_index();
|
||||
if (!maybe_z_index.has_value())
|
||||
|
|
|
|||
|
|
@ -212,19 +212,19 @@ void BlockFormattingContext::compute_width(Box const& box, LayoutMode layout_mod
|
|||
|
||||
// 2. The tentative used width is greater than 'max-width', the rules above are applied again,
|
||||
// but this time using the computed value of 'max-width' as the computed value for 'width'.
|
||||
auto specified_max_width = computed_values.max_width().resolved(box, width_of_containing_block_as_length).resolved(box);
|
||||
if (!specified_max_width.is_auto()) {
|
||||
if (used_width.to_px(box) > specified_max_width.to_px(box)) {
|
||||
used_width = try_compute_width(specified_max_width);
|
||||
if (!computed_values.max_width().is_none()) {
|
||||
auto max_width = computed_values.max_width().resolved(box, width_of_containing_block_as_length).resolved(box);
|
||||
if (used_width.to_px(box) > max_width.to_px(box)) {
|
||||
used_width = try_compute_width(max_width);
|
||||
}
|
||||
}
|
||||
|
||||
// 3. If the resulting width is smaller than 'min-width', the rules above are applied again,
|
||||
// but this time using the value of 'min-width' as the computed value for 'width'.
|
||||
auto specified_min_width = computed_values.min_width().resolved(box, width_of_containing_block_as_length).resolved(box);
|
||||
if (!specified_min_width.is_auto()) {
|
||||
if (used_width.to_px(box) < specified_min_width.to_px(box)) {
|
||||
used_width = try_compute_width(specified_min_width);
|
||||
if (!computed_values.min_width().is_auto()) {
|
||||
auto min_width = computed_values.min_width().resolved(box, width_of_containing_block_as_length).resolved(box);
|
||||
if (used_width.to_px(box) < min_width.to_px(box)) {
|
||||
used_width = try_compute_width(min_width);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -292,18 +292,18 @@ void BlockFormattingContext::compute_width_for_floating_box(Box const& box, Layo
|
|||
|
||||
// 2. The tentative used width is greater than 'max-width', the rules above are applied again,
|
||||
// but this time using the computed value of 'max-width' as the computed value for 'width'.
|
||||
auto specified_max_width = computed_values.max_width().resolved(box, width_of_containing_block_as_length).resolved(box);
|
||||
if (!specified_max_width.is_auto()) {
|
||||
if (width.to_px(box) > specified_max_width.to_px(box))
|
||||
width = compute_width(specified_max_width);
|
||||
if (!computed_values.max_width().is_none()) {
|
||||
auto max_width = computed_values.max_width().resolved(box, width_of_containing_block_as_length).resolved(box);
|
||||
if (width.to_px(box) > max_width.to_px(box))
|
||||
width = compute_width(max_width);
|
||||
}
|
||||
|
||||
// 3. If the resulting width is smaller than 'min-width', the rules above are applied again,
|
||||
// but this time using the value of 'min-width' as the computed value for 'width'.
|
||||
auto specified_min_width = computed_values.min_width().resolved(box, width_of_containing_block_as_length).resolved(box);
|
||||
if (!specified_min_width.is_auto()) {
|
||||
if (width.to_px(box) < specified_min_width.to_px(box))
|
||||
width = compute_width(specified_min_width);
|
||||
if (!computed_values.min_width().is_auto()) {
|
||||
auto min_width = computed_values.min_width().resolved(box, width_of_containing_block_as_length).resolved(box);
|
||||
if (width.to_px(box) < min_width.to_px(box))
|
||||
width = compute_width(min_width);
|
||||
}
|
||||
|
||||
auto& box_state = m_state.get_mutable(box);
|
||||
|
|
@ -340,9 +340,11 @@ void BlockFormattingContext::compute_height(Box const& box, LayoutState& state)
|
|||
}
|
||||
}
|
||||
|
||||
auto specified_max_height = computed_values.max_height().resolved(box, containing_block_height).resolved(box);
|
||||
if (!specified_max_height.is_auto())
|
||||
height = min(height, specified_max_height.to_px(box));
|
||||
if (!computed_values.max_height().is_none()) {
|
||||
auto max_height = computed_values.max_height().resolved(box, containing_block_height).resolved(box);
|
||||
if (!max_height.is_auto())
|
||||
height = min(height, max_height.to_px(box));
|
||||
}
|
||||
auto specified_min_height = computed_values.min_height().resolved(box, containing_block_height).resolved(box);
|
||||
if (!specified_min_height.is_auto())
|
||||
height = max(height, specified_min_height.to_px(box));
|
||||
|
|
|
|||
|
|
@ -27,15 +27,25 @@ template<typename T>
|
|||
return ::max(min, ::min(value, max));
|
||||
}
|
||||
|
||||
float FlexFormattingContext::get_pixel_width(Box const& box, Optional<CSS::LengthPercentage> const& length_percentage) const
|
||||
// FIXME: This is a hack helper, remove it when no longer needed.
|
||||
static CSS::Size to_css_size(CSS::LengthPercentage const& length_percentage)
|
||||
{
|
||||
if (!length_percentage.has_value())
|
||||
return 0;
|
||||
auto inner_width = CSS::Length::make_px(containing_block_width_for(box));
|
||||
return length_percentage->resolved(box, inner_width).to_px(box);
|
||||
if (length_percentage.is_auto())
|
||||
return CSS::Size::make_auto();
|
||||
if (length_percentage.is_length())
|
||||
return CSS::Size::make_length(length_percentage.length());
|
||||
return CSS::Size::make_percentage(length_percentage.percentage());
|
||||
}
|
||||
|
||||
float FlexFormattingContext::get_pixel_height(Box const& box, Optional<CSS::LengthPercentage> const& length_percentage) const
|
||||
float FlexFormattingContext::get_pixel_width(Box const& box, Optional<CSS::Size> const& size) const
|
||||
{
|
||||
if (!size.has_value())
|
||||
return 0;
|
||||
auto inner_width = CSS::Length::make_px(containing_block_width_for(box));
|
||||
return size->resolved(box, inner_width).to_px(box);
|
||||
}
|
||||
|
||||
float FlexFormattingContext::get_pixel_height(Box const& box, Optional<CSS::Size> const& length_percentage) const
|
||||
{
|
||||
if (!length_percentage.has_value())
|
||||
return 0;
|
||||
|
|
@ -407,13 +417,13 @@ float FlexFormattingContext::specified_cross_min_size(Box const& box) const
|
|||
bool FlexFormattingContext::has_main_max_size(Box const& box) const
|
||||
{
|
||||
auto const& value = is_row_layout() ? box.computed_values().max_width() : box.computed_values().max_height();
|
||||
return !value.is_auto();
|
||||
return !value.is_none();
|
||||
}
|
||||
|
||||
bool FlexFormattingContext::has_cross_max_size(Box const& box) const
|
||||
{
|
||||
auto const& value = !is_row_layout() ? box.computed_values().max_width() : box.computed_values().max_height();
|
||||
return !value.is_auto();
|
||||
return !value.is_none();
|
||||
}
|
||||
|
||||
float FlexFormattingContext::specified_main_max_size(Box const& box) const
|
||||
|
|
@ -648,7 +658,15 @@ CSS::FlexBasisData FlexFormattingContext::used_flex_basis_for_item(FlexItem cons
|
|||
flex_basis.type = CSS::FlexBasis::Content;
|
||||
} else {
|
||||
flex_basis.type = CSS::FlexBasis::LengthPercentage;
|
||||
flex_basis.length_percentage = main_size;
|
||||
if (main_size.is_length()) {
|
||||
flex_basis.length_percentage = main_size.length();
|
||||
} else if (main_size.is_percentage()) {
|
||||
flex_basis.length_percentage = main_size.percentage();
|
||||
} else {
|
||||
// FIXME: Support other size values!
|
||||
dbgln("FIXME: Unsupported main size for flex-basis!");
|
||||
flex_basis.type = CSS::FlexBasis::Content;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -682,8 +700,8 @@ void FlexFormattingContext::determine_flex_base_size_and_hypothetical_main_size(
|
|||
// A. If the item has a definite used flex basis, that’s the flex base size.
|
||||
if (flex_item.used_flex_basis_is_definite) {
|
||||
if (is_row_layout())
|
||||
return get_pixel_width(child_box, flex_item.used_flex_basis.length_percentage.value());
|
||||
return get_pixel_height(child_box, flex_item.used_flex_basis.length_percentage.value());
|
||||
return get_pixel_width(child_box, to_css_size(flex_item.used_flex_basis.length_percentage.value()));
|
||||
return get_pixel_height(child_box, to_css_size(flex_item.used_flex_basis.length_percentage.value()));
|
||||
}
|
||||
|
||||
// B. If the flex item has ...
|
||||
|
|
@ -1049,7 +1067,7 @@ void FlexFormattingContext::determine_hypothetical_cross_size_of_item(FlexItem&
|
|||
auto const& computed_max_size = this->computed_cross_max_size(item.box);
|
||||
|
||||
auto clamp_min = (!computed_min_size.is_auto() && (resolve_percentage_min_max_sizes || !computed_min_size.contains_percentage())) ? specified_cross_min_size(item.box) : 0;
|
||||
auto clamp_max = (!computed_max_size.is_auto() && (resolve_percentage_min_max_sizes || !computed_max_size.contains_percentage())) ? specified_cross_max_size(item.box) : NumericLimits<float>::max();
|
||||
auto clamp_max = (!computed_max_size.is_none() && (resolve_percentage_min_max_sizes || !computed_max_size.contains_percentage())) ? specified_cross_max_size(item.box) : NumericLimits<float>::max();
|
||||
|
||||
// If we have a definite cross size, this is easy! No need to perform layout, we can just use it as-is.
|
||||
if (has_definite_cross_size(item.box)) {
|
||||
|
|
@ -1539,7 +1557,7 @@ float FlexFormattingContext::calculate_intrinsic_main_size_of_flex_container(Lay
|
|||
auto const& computed_max_size = this->computed_main_max_size(flex_item->box);
|
||||
|
||||
auto clamp_min = (!computed_min_size.is_auto() && (resolve_percentage_min_max_sizes || !computed_min_size.contains_percentage())) ? specified_main_min_size(flex_item->box) : automatic_minimum_size(*flex_item);
|
||||
auto clamp_max = (!computed_max_size.is_auto() && (resolve_percentage_min_max_sizes || !computed_max_size.contains_percentage())) ? specified_main_max_size(flex_item->box) : NumericLimits<float>::max();
|
||||
auto clamp_max = (!computed_max_size.is_none() && (resolve_percentage_min_max_sizes || !computed_max_size.contains_percentage())) ? specified_main_max_size(flex_item->box) : NumericLimits<float>::max();
|
||||
|
||||
result = css_clamp(result, clamp_min, clamp_max);
|
||||
|
||||
|
|
@ -1656,7 +1674,7 @@ float FlexFormattingContext::calculate_cross_min_content_contribution(FlexItem c
|
|||
auto const& computed_max_size = this->computed_cross_max_size(item.box);
|
||||
|
||||
auto clamp_min = (!computed_min_size.is_auto() && (resolve_percentage_min_max_sizes || !computed_min_size.contains_percentage())) ? specified_cross_min_size(item.box) : 0;
|
||||
auto clamp_max = (!computed_max_size.is_auto() && (resolve_percentage_min_max_sizes || !computed_max_size.contains_percentage())) ? specified_cross_max_size(item.box) : NumericLimits<float>::max();
|
||||
auto clamp_max = (!computed_max_size.is_none() && (resolve_percentage_min_max_sizes || !computed_max_size.contains_percentage())) ? specified_cross_max_size(item.box) : NumericLimits<float>::max();
|
||||
|
||||
auto clamped_inner_size = css_clamp(larger_size, clamp_min, clamp_max);
|
||||
|
||||
|
|
@ -1677,7 +1695,7 @@ float FlexFormattingContext::calculate_cross_max_content_contribution(FlexItem c
|
|||
auto const& computed_max_size = this->computed_cross_max_size(item.box);
|
||||
|
||||
auto clamp_min = (!computed_min_size.is_auto() && (resolve_percentage_min_max_sizes || !computed_min_size.contains_percentage())) ? specified_cross_min_size(item.box) : 0;
|
||||
auto clamp_max = (!computed_max_size.is_auto() && (resolve_percentage_min_max_sizes || !computed_max_size.contains_percentage())) ? specified_cross_max_size(item.box) : NumericLimits<float>::max();
|
||||
auto clamp_max = (!computed_max_size.is_none() && (resolve_percentage_min_max_sizes || !computed_max_size.contains_percentage())) ? specified_cross_max_size(item.box) : NumericLimits<float>::max();
|
||||
|
||||
auto clamped_inner_size = css_clamp(larger_size, clamp_min, clamp_max);
|
||||
|
||||
|
|
@ -1737,32 +1755,32 @@ bool FlexFormattingContext::flex_item_is_stretched(FlexItem const& item) const
|
|||
return computed_cross_size.is_auto() && !item.margins.cross_before_is_auto && !item.margins.cross_after_is_auto;
|
||||
}
|
||||
|
||||
CSS::LengthPercentage const& FlexFormattingContext::computed_main_size(Box const& box) const
|
||||
CSS::Size const& FlexFormattingContext::computed_main_size(Box const& box) const
|
||||
{
|
||||
return is_row_layout() ? box.computed_values().width() : box.computed_values().height();
|
||||
}
|
||||
|
||||
CSS::LengthPercentage const& FlexFormattingContext::computed_main_min_size(Box const& box) const
|
||||
CSS::Size const& FlexFormattingContext::computed_main_min_size(Box const& box) const
|
||||
{
|
||||
return is_row_layout() ? box.computed_values().min_width() : box.computed_values().min_height();
|
||||
}
|
||||
|
||||
CSS::LengthPercentage const& FlexFormattingContext::computed_main_max_size(Box const& box) const
|
||||
CSS::Size const& FlexFormattingContext::computed_main_max_size(Box const& box) const
|
||||
{
|
||||
return is_row_layout() ? box.computed_values().max_width() : box.computed_values().max_height();
|
||||
}
|
||||
|
||||
CSS::LengthPercentage const& FlexFormattingContext::computed_cross_size(Box const& box) const
|
||||
CSS::Size const& FlexFormattingContext::computed_cross_size(Box const& box) const
|
||||
{
|
||||
return !is_row_layout() ? box.computed_values().width() : box.computed_values().height();
|
||||
}
|
||||
|
||||
CSS::LengthPercentage const& FlexFormattingContext::computed_cross_min_size(Box const& box) const
|
||||
CSS::Size const& FlexFormattingContext::computed_cross_min_size(Box const& box) const
|
||||
{
|
||||
return !is_row_layout() ? box.computed_values().min_width() : box.computed_values().min_height();
|
||||
}
|
||||
|
||||
CSS::LengthPercentage const& FlexFormattingContext::computed_cross_max_size(Box const& box) const
|
||||
CSS::Size const& FlexFormattingContext::computed_cross_max_size(Box const& box) const
|
||||
{
|
||||
return !is_row_layout() ? box.computed_values().max_width() : box.computed_values().max_height();
|
||||
}
|
||||
|
|
|
|||
|
|
@ -107,15 +107,15 @@ private:
|
|||
Optional<float> specified_size_suggestion(FlexItem const&) const;
|
||||
Optional<float> transferred_size_suggestion(FlexItem const&) const;
|
||||
float content_size_suggestion(FlexItem const&) const;
|
||||
CSS::LengthPercentage const& computed_main_size(Box const&) const;
|
||||
CSS::LengthPercentage const& computed_main_min_size(Box const&) const;
|
||||
CSS::LengthPercentage const& computed_main_max_size(Box const&) const;
|
||||
CSS::LengthPercentage const& computed_cross_size(Box const&) const;
|
||||
CSS::LengthPercentage const& computed_cross_min_size(Box const&) const;
|
||||
CSS::LengthPercentage const& computed_cross_max_size(Box const&) const;
|
||||
CSS::Size const& computed_main_size(Box const&) const;
|
||||
CSS::Size const& computed_main_min_size(Box const&) const;
|
||||
CSS::Size const& computed_main_max_size(Box const&) const;
|
||||
CSS::Size const& computed_cross_size(Box const&) const;
|
||||
CSS::Size const& computed_cross_min_size(Box const&) const;
|
||||
CSS::Size const& computed_cross_max_size(Box const&) const;
|
||||
|
||||
float get_pixel_width(Box const& box, Optional<CSS::LengthPercentage> const& length_percentage) const;
|
||||
float get_pixel_height(Box const& box, Optional<CSS::LengthPercentage> const& length_percentage) const;
|
||||
float get_pixel_width(Box const& box, Optional<CSS::Size> const& length_percentage) const;
|
||||
float get_pixel_height(Box const& box, Optional<CSS::Size> const& length_percentage) const;
|
||||
|
||||
bool flex_item_is_stretched(FlexItem const&) const;
|
||||
|
||||
|
|
|
|||
|
|
@ -217,9 +217,9 @@ static Gfx::FloatSize solve_replaced_size_constraint(LayoutState const& state, f
|
|||
auto height_of_containing_block = CSS::Length::make_px(containing_block_state.content_height());
|
||||
|
||||
auto specified_min_width = box.computed_values().min_width().is_auto() ? 0 : box.computed_values().min_width().resolved(box, width_of_containing_block).to_px(box);
|
||||
auto specified_max_width = box.computed_values().max_width().is_auto() ? w : box.computed_values().max_width().resolved(box, width_of_containing_block).to_px(box);
|
||||
auto specified_max_width = box.computed_values().max_width().is_none() ? w : box.computed_values().max_width().resolved(box, width_of_containing_block).to_px(box);
|
||||
auto specified_min_height = box.computed_values().min_height().is_auto() ? 0 : box.computed_values().min_height().resolved(box, height_of_containing_block).to_px(box);
|
||||
auto specified_max_height = box.computed_values().max_height().is_auto() ? h : box.computed_values().max_height().resolved(box, height_of_containing_block).to_px(box);
|
||||
auto specified_max_height = box.computed_values().max_height().is_none() ? h : box.computed_values().max_height().resolved(box, height_of_containing_block).to_px(box);
|
||||
|
||||
auto min_width = min(specified_min_width, specified_max_width);
|
||||
auto max_width = max(specified_min_width, specified_max_width);
|
||||
|
|
@ -357,14 +357,14 @@ float FormattingContext::compute_auto_height_for_block_formatting_context_root(L
|
|||
}
|
||||
|
||||
// 10.3.2 Inline, replaced elements, https://www.w3.org/TR/CSS22/visudet.html#inline-replaced-width
|
||||
float FormattingContext::tentative_width_for_replaced_element(LayoutState const& state, ReplacedBox const& box, CSS::LengthPercentage const& computed_width)
|
||||
float FormattingContext::tentative_width_for_replaced_element(LayoutState const& state, ReplacedBox const& box, CSS::Size const& computed_width)
|
||||
{
|
||||
// Treat percentages of indefinite containing block widths as 0 (the initial width).
|
||||
if (computed_width.is_percentage() && !state.get(*box.containing_block()).has_definite_width())
|
||||
return 0;
|
||||
|
||||
auto height_of_containing_block = CSS::Length::make_px(containing_block_height_for(box, state));
|
||||
auto computed_height = box.computed_values().height().resolved(box, height_of_containing_block).resolved(box);
|
||||
auto const& computed_height = box.computed_values().height();
|
||||
|
||||
float used_width = computed_width.resolved(box, CSS::Length::make_px(containing_block_width_for(box, state))).to_px(box);
|
||||
|
||||
|
|
@ -442,7 +442,7 @@ float FormattingContext::compute_width_for_replaced_element(LayoutState const& s
|
|||
// 2. The tentative used width is greater than 'max-width', the rules above are applied again,
|
||||
// but this time using the computed value of 'max-width' as the computed value for 'width'.
|
||||
auto computed_max_width = box.computed_values().max_width();
|
||||
if (!computed_max_width.is_auto()) {
|
||||
if (!computed_max_width.is_none()) {
|
||||
if (used_width > computed_max_width.resolved(box, width_of_containing_block_as_length).to_px(box)) {
|
||||
used_width = tentative_width_for_replaced_element(state, box, computed_max_width);
|
||||
}
|
||||
|
|
@ -462,13 +462,13 @@ float FormattingContext::compute_width_for_replaced_element(LayoutState const& s
|
|||
|
||||
// 10.6.2 Inline replaced elements, block-level replaced elements in normal flow, 'inline-block' replaced elements in normal flow and floating replaced elements
|
||||
// https://www.w3.org/TR/CSS22/visudet.html#inline-replaced-height
|
||||
float FormattingContext::tentative_height_for_replaced_element(LayoutState const& state, ReplacedBox const& box, CSS::LengthPercentage const& computed_height)
|
||||
float FormattingContext::tentative_height_for_replaced_element(LayoutState const& state, ReplacedBox const& box, CSS::Size const& computed_height)
|
||||
{
|
||||
// Treat percentages of indefinite containing block heights as 0 (the initial height).
|
||||
if (computed_height.is_percentage() && !state.get(*box.containing_block()).has_definite_height())
|
||||
return 0;
|
||||
|
||||
auto computed_width = box.computed_values().width();
|
||||
auto const& computed_width = box.computed_values().width();
|
||||
|
||||
// If 'height' and 'width' both have computed values of 'auto' and the element also has
|
||||
// an intrinsic height, then that intrinsic height is the used value of 'height'.
|
||||
|
|
@ -630,19 +630,19 @@ void FormattingContext::compute_width_for_absolutely_positioned_non_replaced_ele
|
|||
|
||||
// 2. The tentative used width is greater than 'max-width', the rules above are applied again,
|
||||
// but this time using the computed value of 'max-width' as the computed value for 'width'.
|
||||
auto specified_max_width = computed_values.max_width().resolved(box, width_of_containing_block_as_length).resolved(box);
|
||||
if (!specified_max_width.is_auto()) {
|
||||
if (used_width.to_px(box) > specified_max_width.to_px(box)) {
|
||||
used_width = try_compute_width(specified_max_width);
|
||||
if (!computed_values.max_width().is_none()) {
|
||||
auto max_width = computed_values.max_width().resolved(box, width_of_containing_block_as_length).resolved(box);
|
||||
if (used_width.to_px(box) > max_width.to_px(box)) {
|
||||
used_width = try_compute_width(max_width);
|
||||
}
|
||||
}
|
||||
|
||||
// 3. If the resulting width is smaller than 'min-width', the rules above are applied again,
|
||||
// but this time using the value of 'min-width' as the computed value for 'width'.
|
||||
auto specified_min_width = computed_values.min_width().resolved(box, width_of_containing_block_as_length).resolved(box);
|
||||
if (!specified_min_width.is_auto()) {
|
||||
if (used_width.to_px(box) < specified_min_width.to_px(box)) {
|
||||
used_width = try_compute_width(specified_min_width);
|
||||
if (!computed_values.min_width().is_auto()) {
|
||||
auto min_width = computed_values.min_width().resolved(box, width_of_containing_block_as_length).resolved(box);
|
||||
if (used_width.to_px(box) < min_width.to_px(box)) {
|
||||
used_width = try_compute_width(min_width);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -714,7 +714,7 @@ void FormattingContext::compute_height_for_absolutely_positioned_non_replaced_el
|
|||
}
|
||||
|
||||
float used_height = tentative_height.to_px(box);
|
||||
if (!computed_max_height.is_auto())
|
||||
if (!computed_max_height.is_none())
|
||||
used_height = min(used_height, computed_max_height.resolved(box, height_of_containing_block_as_length).resolved(box).to_px(box));
|
||||
if (!computed_min_height.is_auto())
|
||||
used_height = max(used_height, computed_min_height.resolved(box, height_of_containing_block_as_length).resolved(box).to_px(box));
|
||||
|
|
|
|||
|
|
@ -86,8 +86,8 @@ protected:
|
|||
float preferred_minimum_width { 0 };
|
||||
};
|
||||
|
||||
static float tentative_width_for_replaced_element(LayoutState const&, ReplacedBox const&, CSS::LengthPercentage const& computed_width);
|
||||
static float tentative_height_for_replaced_element(LayoutState const&, ReplacedBox const&, CSS::LengthPercentage const& computed_height);
|
||||
static float tentative_width_for_replaced_element(LayoutState const&, ReplacedBox const&, CSS::Size const& computed_width);
|
||||
static float tentative_height_for_replaced_element(LayoutState const&, ReplacedBox const&, CSS::Size const& computed_height);
|
||||
static float compute_auto_height_for_block_formatting_context_root(LayoutState const&, BlockContainer const&);
|
||||
static float compute_auto_height_for_block_level_element(LayoutState const&, Box const&);
|
||||
|
||||
|
|
|
|||
|
|
@ -184,7 +184,7 @@ void LayoutState::UsedValues::set_node(NodeWithStyleAndBoxModelMetrics& node, Us
|
|||
|
||||
auto const& computed_values = node.computed_values();
|
||||
|
||||
auto is_definite_size = [&](CSS::LengthPercentage const& size, float& resolved_definite_size, bool width) {
|
||||
auto is_definite_size = [&](CSS::Size const& size, float& resolved_definite_size, bool width) {
|
||||
// A size that can be determined without performing layout; that is,
|
||||
// a <length>,
|
||||
// a measure of text (without consideration of line-wrapping),
|
||||
|
|
@ -206,6 +206,8 @@ void LayoutState::UsedValues::set_node(NodeWithStyleAndBoxModelMetrics& node, Us
|
|||
}
|
||||
|
||||
if (size.is_length()) {
|
||||
if (size.length().is_calculated())
|
||||
return false;
|
||||
resolved_definite_size = size.length().to_px(node);
|
||||
return true;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -489,19 +489,13 @@ void NodeWithStyle::apply_style(const CSS::StyleProperties& computed_style)
|
|||
|
||||
m_visible = computed_values.opacity() != 0 && computed_values.visibility() == CSS::Visibility::Visible;
|
||||
|
||||
if (auto maybe_length_percentage = computed_style.length_percentage(CSS::PropertyID::Width); maybe_length_percentage.has_value())
|
||||
computed_values.set_width(maybe_length_percentage.release_value());
|
||||
if (auto maybe_length_percentage = computed_style.length_percentage(CSS::PropertyID::MinWidth); maybe_length_percentage.has_value())
|
||||
computed_values.set_min_width(maybe_length_percentage.release_value());
|
||||
if (auto maybe_length_percentage = computed_style.length_percentage(CSS::PropertyID::MaxWidth); maybe_length_percentage.has_value())
|
||||
computed_values.set_max_width(maybe_length_percentage.release_value());
|
||||
computed_values.set_width(computed_style.size_value(CSS::PropertyID::Width));
|
||||
computed_values.set_min_width(computed_style.size_value(CSS::PropertyID::MinWidth));
|
||||
computed_values.set_max_width(computed_style.size_value(CSS::PropertyID::MaxWidth));
|
||||
|
||||
if (auto maybe_length_percentage = computed_style.length_percentage(CSS::PropertyID::Height); maybe_length_percentage.has_value())
|
||||
computed_values.set_height(maybe_length_percentage.release_value());
|
||||
if (auto maybe_length_percentage = computed_style.length_percentage(CSS::PropertyID::MinHeight); maybe_length_percentage.has_value())
|
||||
computed_values.set_min_height(maybe_length_percentage.release_value());
|
||||
if (auto maybe_length_percentage = computed_style.length_percentage(CSS::PropertyID::MaxHeight); maybe_length_percentage.has_value())
|
||||
computed_values.set_max_height(maybe_length_percentage.release_value());
|
||||
computed_values.set_height(computed_style.size_value(CSS::PropertyID::Height));
|
||||
computed_values.set_min_height(computed_style.size_value(CSS::PropertyID::MinHeight));
|
||||
computed_values.set_max_height(computed_style.size_value(CSS::PropertyID::MaxHeight));
|
||||
|
||||
computed_values.set_inset(computed_style.length_box(CSS::PropertyID::Left, CSS::PropertyID::Top, CSS::PropertyID::Right, CSS::PropertyID::Bottom, CSS::Length::make_auto()));
|
||||
computed_values.set_margin(computed_style.length_box(CSS::PropertyID::MarginLeft, CSS::PropertyID::MarginTop, CSS::PropertyID::MarginRight, CSS::PropertyID::MarginBottom, CSS::Length::make_px(0)));
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue