summaryrefslogtreecommitdiff
path: root/Userland
diff options
context:
space:
mode:
Diffstat (limited to 'Userland')
-rw-r--r--Userland/Libraries/LibWeb/CSS/ComputedValues.h6
-rw-r--r--Userland/Libraries/LibWeb/CSS/Enums.json24
-rw-r--r--Userland/Libraries/LibWeb/CSS/Identifiers.json6
-rw-r--r--Userland/Libraries/LibWeb/CSS/Properties.json7
-rw-r--r--Userland/Libraries/LibWeb/CSS/StyleProperties.cpp6
-rw-r--r--Userland/Libraries/LibWeb/CSS/StyleProperties.h1
-rw-r--r--Userland/Libraries/LibWeb/Layout/FlexFormattingContext.cpp36
-rw-r--r--Userland/Libraries/LibWeb/Layout/FlexFormattingContext.h2
-rw-r--r--Userland/Libraries/LibWeb/Layout/Node.cpp4
9 files changed, 83 insertions, 9 deletions
diff --git a/Userland/Libraries/LibWeb/CSS/ComputedValues.h b/Userland/Libraries/LibWeb/CSS/ComputedValues.h
index a8043b875b..5e5a8c4671 100644
--- a/Userland/Libraries/LibWeb/CSS/ComputedValues.h
+++ b/Userland/Libraries/LibWeb/CSS/ComputedValues.h
@@ -1,5 +1,5 @@
/*
- * Copyright (c) 2020, Andreas Kling <kling@serenityos.org>
+ * Copyright (c) 2020-2022, Andreas Kling <kling@serenityos.org>
*
* SPDX-License-Identifier: BSD-2-Clause
*/
@@ -38,6 +38,7 @@ public:
static CSS::ImageRendering image_rendering() { return CSS::ImageRendering::Auto; }
static CSS::JustifyContent justify_content() { return CSS::JustifyContent::FlexStart; }
static CSS::AlignItems align_items() { return CSS::AlignItems::Stretch; }
+ static CSS::AlignSelf align_self() { return CSS::AlignSelf::Auto; }
static CSS::Overflow overflow() { return CSS::Overflow::Visible; }
static CSS::BoxSizing box_sizing() { return CSS::BoxSizing::ContentBox; }
static CSS::PointerEvents pointer_events() { return CSS::PointerEvents::Auto; }
@@ -150,6 +151,7 @@ public:
float flex_shrink() const { return m_noninherited.flex_shrink; }
int order() const { return m_noninherited.order; }
CSS::AlignItems align_items() const { return m_noninherited.align_items; }
+ CSS::AlignSelf align_self() const { return m_noninherited.align_self; }
float opacity() const { return m_noninherited.opacity; }
CSS::Visibility visibility() const { return m_inherited.visibility; }
CSS::ImageRendering image_rendering() const { return m_inherited.image_rendering; }
@@ -264,6 +266,7 @@ protected:
float flex_shrink { InitialValues::flex_shrink() };
int order { InitialValues::order() };
CSS::AlignItems align_items { InitialValues::align_items() };
+ CSS::AlignSelf align_self { InitialValues::align_self() };
CSS::JustifyContent justify_content { InitialValues::justify_content() };
CSS::Overflow overflow_x { InitialValues::overflow() };
CSS::Overflow overflow_y { InitialValues::overflow() };
@@ -333,6 +336,7 @@ public:
void set_flex_shrink(float value) { m_noninherited.flex_shrink = value; }
void set_order(int value) { m_noninherited.order = 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_opacity(float value) { m_noninherited.opacity = value; }
void set_justify_content(CSS::JustifyContent value) { m_noninherited.justify_content = value; }
void set_box_shadow(Vector<ShadowData>&& value) { m_noninherited.box_shadow = move(value); }
diff --git a/Userland/Libraries/LibWeb/CSS/Enums.json b/Userland/Libraries/LibWeb/CSS/Enums.json
index e006111bf8..62b512c2fa 100644
--- a/Userland/Libraries/LibWeb/CSS/Enums.json
+++ b/Userland/Libraries/LibWeb/CSS/Enums.json
@@ -1,10 +1,28 @@
{
"align-items": [
- "flex-start",
- "flex-end",
+ "baseline",
"center",
+ "flex-end",
+ "flex-start",
+ "normal",
+ "safe",
+ "self-end",
+ "self-start",
+ "stretch",
+ "unsafe"
+ ],
+ "align-self": [
+ "auto",
"baseline",
- "stretch"
+ "center",
+ "flex-end",
+ "flex-start",
+ "normal",
+ "safe",
+ "self-end",
+ "self-start",
+ "stretch",
+ "unsafe"
],
"background-attachment": [
"fixed",
diff --git a/Userland/Libraries/LibWeb/CSS/Identifiers.json b/Userland/Libraries/LibWeb/CSS/Identifiers.json
index a1c9460ec3..8493b6ef30 100644
--- a/Userland/Libraries/LibWeb/CSS/Identifiers.json
+++ b/Userland/Libraries/LibWeb/CSS/Identifiers.json
@@ -181,8 +181,8 @@
"nwse-resize",
"oblique",
"opaque",
- "optimizespeed",
"optimizequality",
+ "optimizespeed",
"outset",
"outside",
"overline",
@@ -217,9 +217,12 @@
"ruby-text-container",
"run-in",
"s-resize",
+ "safe",
"sans-serif",
"scroll",
"se-resize",
+ "self-end",
+ "self-start",
"separate",
"serif",
"slow",
@@ -262,6 +265,7 @@
"ui-sans-serif",
"ui-serif",
"underline",
+ "unsafe",
"upper-alpha",
"upper-latin",
"upper-roman",
diff --git a/Userland/Libraries/LibWeb/CSS/Properties.json b/Userland/Libraries/LibWeb/CSS/Properties.json
index 02b4fe809e..37a1eef20d 100644
--- a/Userland/Libraries/LibWeb/CSS/Properties.json
+++ b/Userland/Libraries/LibWeb/CSS/Properties.json
@@ -6,6 +6,13 @@
"align-items"
]
},
+ "align-self": {
+ "inherited": false,
+ "initial": "auto",
+ "valid-types": [
+ "align-self"
+ ]
+ },
"background": {
"affects-layout": false,
"inherited": false,
diff --git a/Userland/Libraries/LibWeb/CSS/StyleProperties.cpp b/Userland/Libraries/LibWeb/CSS/StyleProperties.cpp
index da699579ce..c0a412d3cd 100644
--- a/Userland/Libraries/LibWeb/CSS/StyleProperties.cpp
+++ b/Userland/Libraries/LibWeb/CSS/StyleProperties.cpp
@@ -310,6 +310,12 @@ Optional<CSS::AlignItems> StyleProperties::align_items() const
return value_id_to_align_items(value->to_identifier());
}
+Optional<CSS::AlignSelf> StyleProperties::align_self() const
+{
+ auto value = property(CSS::PropertyID::AlignSelf);
+ return value_id_to_align_self(value->to_identifier());
+}
+
Optional<CSS::Position> StyleProperties::position() const
{
auto value = property(CSS::PropertyID::Position);
diff --git a/Userland/Libraries/LibWeb/CSS/StyleProperties.h b/Userland/Libraries/LibWeb/CSS/StyleProperties.h
index 9505efdd0a..319f5b5a86 100644
--- a/Userland/Libraries/LibWeb/CSS/StyleProperties.h
+++ b/Userland/Libraries/LibWeb/CSS/StyleProperties.h
@@ -67,6 +67,7 @@ public:
float flex_shrink() const;
int order() const;
Optional<CSS::AlignItems> align_items() const;
+ Optional<CSS::AlignSelf> align_self() const;
float opacity() const;
Optional<CSS::Visibility> visibility() const;
Optional<CSS::ImageRendering> image_rendering() const;
diff --git a/Userland/Libraries/LibWeb/Layout/FlexFormattingContext.cpp b/Userland/Libraries/LibWeb/Layout/FlexFormattingContext.cpp
index 410db6a442..bf1fbf4c00 100644
--- a/Userland/Libraries/LibWeb/Layout/FlexFormattingContext.cpp
+++ b/Userland/Libraries/LibWeb/Layout/FlexFormattingContext.cpp
@@ -1072,13 +1072,12 @@ void FlexFormattingContext::calculate_cross_size_of_each_flex_line(float const c
// https://www.w3.org/TR/css-flexbox-1/#algo-stretch
void FlexFormattingContext::determine_used_cross_size_of_each_flex_item()
{
- // FIXME: Get the alignment via "align-self" of the item (which accesses "align-items" of the parent if unset)
for (auto& flex_line : m_flex_lines) {
for (auto& flex_item : flex_line.items) {
// If a flex item has align-self: stretch, its computed cross size property is auto,
// and neither of its cross-axis margins are auto, the used outer cross size is the used cross size of its flex line,
// clamped according to the itemโ€™s used min and max cross sizes.
- if (flex_item->box.computed_values().align_items() == CSS::AlignItems::Stretch
+ if (alignment_for_item(*flex_item) == CSS::AlignItems::Stretch
&& is_cross_auto(flex_item->box)
&& !flex_item->margins.cross_before_is_auto
&& !flex_item->margins.cross_after_is_auto) {
@@ -1201,14 +1200,43 @@ void FlexFormattingContext::dump_items() const
}
}
+CSS::AlignItems FlexFormattingContext::alignment_for_item(FlexItem const& item) const
+{
+ switch (item.box.computed_values().align_self()) {
+ case CSS::AlignSelf::Auto:
+ return flex_container().computed_values().align_items();
+ case CSS::AlignSelf::Normal:
+ return CSS::AlignItems::Normal;
+ case CSS::AlignSelf::SelfStart:
+ return CSS::AlignItems::SelfStart;
+ case CSS::AlignSelf::SelfEnd:
+ return CSS::AlignItems::SelfEnd;
+ case CSS::AlignSelf::FlexStart:
+ return CSS::AlignItems::FlexStart;
+ case CSS::AlignSelf::FlexEnd:
+ return CSS::AlignItems::FlexEnd;
+ case CSS::AlignSelf::Center:
+ return CSS::AlignItems::Center;
+ case CSS::AlignSelf::Baseline:
+ return CSS::AlignItems::Baseline;
+ case CSS::AlignSelf::Stretch:
+ return CSS::AlignItems::Stretch;
+ case CSS::AlignSelf::Safe:
+ return CSS::AlignItems::Safe;
+ case CSS::AlignSelf::Unsafe:
+ return CSS::AlignItems::Unsafe;
+ default:
+ VERIFY_NOT_REACHED();
+ }
+}
+
void FlexFormattingContext::align_all_flex_items_along_the_cross_axis()
{
- // FIXME: Get the alignment via "align-self" of the item (which accesses "align-items" of the parent if unset)
// FIXME: Take better care of margins
float line_cross_offset = 0;
for (auto& flex_line : m_flex_lines) {
for (auto* flex_item : flex_line.items) {
- switch (flex_container().computed_values().align_items()) {
+ switch (alignment_for_item(*flex_item)) {
case CSS::AlignItems::Baseline:
// FIXME: Implement this
// Fallthrough
diff --git a/Userland/Libraries/LibWeb/Layout/FlexFormattingContext.h b/Userland/Libraries/LibWeb/Layout/FlexFormattingContext.h
index 1bf265e1cb..eccceaee85 100644
--- a/Userland/Libraries/LibWeb/Layout/FlexFormattingContext.h
+++ b/Userland/Libraries/LibWeb/Layout/FlexFormattingContext.h
@@ -116,6 +116,8 @@ private:
void calculate_cross_size_of_each_flex_line(float cross_min_size, float cross_max_size);
+ CSS::AlignItems alignment_for_item(FlexItem const&) const;
+
void determine_used_cross_size_of_each_flex_item();
void distribute_any_remaining_free_space();
diff --git a/Userland/Libraries/LibWeb/Layout/Node.cpp b/Userland/Libraries/LibWeb/Layout/Node.cpp
index 7d03843352..bab1b79afc 100644
--- a/Userland/Libraries/LibWeb/Layout/Node.cpp
+++ b/Userland/Libraries/LibWeb/Layout/Node.cpp
@@ -423,6 +423,10 @@ void NodeWithStyle::apply_style(const CSS::StyleProperties& computed_style)
if (align_items.has_value())
computed_values.set_align_items(align_items.value());
+ auto align_self = computed_style.align_self();
+ if (align_self.has_value())
+ computed_values.set_align_self(align_self.value());
+
auto position = computed_style.position();
if (position.has_value())
computed_values.set_position(position.value());
generated by cgit v1.2.3 (git 2.25.1) at 2024-11-17 04:55:05 +0000