mirror of
https://github.com/RGBCube/serenity
synced 2025-07-19 01:07:39 +00:00
LibWeb: Plumb style/computed values for backdrop-filter
This commit is contained in:
parent
d1b99282d8
commit
ec4de1e07d
5 changed files with 53 additions and 0 deletions
38
Userland/Libraries/LibWeb/CSS/BackdropFilter.h
Normal file
38
Userland/Libraries/LibWeb/CSS/BackdropFilter.h
Normal file
|
@ -0,0 +1,38 @@
|
||||||
|
/*
|
||||||
|
* Copyright (c) 2022, MacDue <macdue@dueutil.tech>
|
||||||
|
*
|
||||||
|
* SPDX-License-Identifier: BSD-2-Clause
|
||||||
|
*/
|
||||||
|
|
||||||
|
#pragma once
|
||||||
|
|
||||||
|
#include <AK/Variant.h>
|
||||||
|
#include <LibWeb/CSS/StyleValue.h>
|
||||||
|
|
||||||
|
namespace Web::CSS {
|
||||||
|
|
||||||
|
class BackdropFilter {
|
||||||
|
public:
|
||||||
|
BackdropFilter() = default;
|
||||||
|
BackdropFilter(FilterValueListStyleValue const& filter_value_list)
|
||||||
|
: m_filter_value_list { filter_value_list } {};
|
||||||
|
|
||||||
|
static inline BackdropFilter make_none()
|
||||||
|
{
|
||||||
|
return BackdropFilter {};
|
||||||
|
}
|
||||||
|
|
||||||
|
bool has_filters() const { return m_filter_value_list; }
|
||||||
|
bool is_none() const { return !has_filters(); }
|
||||||
|
|
||||||
|
Span<FilterFunction const> filters() const
|
||||||
|
{
|
||||||
|
VERIFY(has_filters());
|
||||||
|
return m_filter_value_list->filter_value_list().span();
|
||||||
|
}
|
||||||
|
|
||||||
|
private:
|
||||||
|
RefPtr<FilterValueListStyleValue const> m_filter_value_list { nullptr };
|
||||||
|
};
|
||||||
|
|
||||||
|
}
|
|
@ -7,6 +7,7 @@
|
||||||
#pragma once
|
#pragma once
|
||||||
|
|
||||||
#include <AK/Optional.h>
|
#include <AK/Optional.h>
|
||||||
|
#include <LibWeb/CSS/BackdropFilter.h>
|
||||||
#include <LibWeb/CSS/Clip.h>
|
#include <LibWeb/CSS/Clip.h>
|
||||||
#include <LibWeb/CSS/LengthBox.h>
|
#include <LibWeb/CSS/LengthBox.h>
|
||||||
#include <LibWeb/CSS/StyleValue.h>
|
#include <LibWeb/CSS/StyleValue.h>
|
||||||
|
@ -32,6 +33,7 @@ public:
|
||||||
static CSS::TextTransform text_transform() { return CSS::TextTransform::None; }
|
static CSS::TextTransform text_transform() { return CSS::TextTransform::None; }
|
||||||
static CSS::Display display() { return CSS::Display { CSS::Display::Outside::Inline, CSS::Display::Inside::Flow }; }
|
static CSS::Display display() { return CSS::Display { CSS::Display::Outside::Inline, CSS::Display::Inside::Flow }; }
|
||||||
static Color color() { return Color::Black; }
|
static Color color() { return Color::Black; }
|
||||||
|
static CSS::BackdropFilter backdrop_filter() { return BackdropFilter::make_none(); }
|
||||||
static Color background_color() { return Color::Transparent; }
|
static Color background_color() { return Color::Transparent; }
|
||||||
static CSS::ListStyleType list_style_type() { return CSS::ListStyleType::Disc; }
|
static CSS::ListStyleType list_style_type() { return CSS::ListStyleType::Disc; }
|
||||||
static CSS::Visibility visibility() { return CSS::Visibility::Visible; }
|
static CSS::Visibility visibility() { return CSS::Visibility::Visible; }
|
||||||
|
@ -167,6 +169,7 @@ public:
|
||||||
CSS::Visibility visibility() const { return m_inherited.visibility; }
|
CSS::Visibility visibility() const { return m_inherited.visibility; }
|
||||||
CSS::ImageRendering image_rendering() const { return m_inherited.image_rendering; }
|
CSS::ImageRendering image_rendering() const { return m_inherited.image_rendering; }
|
||||||
CSS::JustifyContent justify_content() const { return m_noninherited.justify_content; }
|
CSS::JustifyContent justify_content() const { return m_noninherited.justify_content; }
|
||||||
|
CSS::BackdropFilter const& backdrop_filter() const { return m_noninherited.backdrop_filter; }
|
||||||
Vector<ShadowData> const& box_shadow() const { return m_noninherited.box_shadow; }
|
Vector<ShadowData> const& box_shadow() const { return m_noninherited.box_shadow; }
|
||||||
CSS::BoxSizing box_sizing() const { return m_noninherited.box_sizing; }
|
CSS::BoxSizing box_sizing() const { return m_noninherited.box_sizing; }
|
||||||
CSS::LengthPercentage const& width() const { return m_noninherited.width; }
|
CSS::LengthPercentage const& width() const { return m_noninherited.width; }
|
||||||
|
@ -267,6 +270,7 @@ protected:
|
||||||
CSS::LengthBox inset { InitialValues::inset() };
|
CSS::LengthBox inset { InitialValues::inset() };
|
||||||
CSS::LengthBox margin { InitialValues::margin() };
|
CSS::LengthBox margin { InitialValues::margin() };
|
||||||
CSS::LengthBox padding { InitialValues::padding() };
|
CSS::LengthBox padding { InitialValues::padding() };
|
||||||
|
CSS::BackdropFilter backdrop_filter { InitialValues::backdrop_filter() };
|
||||||
BorderData border_left;
|
BorderData border_left;
|
||||||
BorderData border_top;
|
BorderData border_top;
|
||||||
BorderData border_right;
|
BorderData border_right;
|
||||||
|
@ -347,6 +351,7 @@ public:
|
||||||
void set_overflow_y(CSS::Overflow value) { m_noninherited.overflow_y = 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_list_style_type(CSS::ListStyleType value) { m_inherited.list_style_type = value; }
|
||||||
void set_display(CSS::Display value) { m_noninherited.display = value; }
|
void set_display(CSS::Display value) { m_noninherited.display = value; }
|
||||||
|
void set_backdrop_filter(CSS::BackdropFilter backdrop_filter) { m_noninherited.backdrop_filter = move(backdrop_filter); }
|
||||||
void set_border_bottom_left_radius(CSS::BorderRadiusData value) { m_noninherited.border_bottom_left_radius = value; }
|
void set_border_bottom_left_radius(CSS::BorderRadiusData value) { m_noninherited.border_bottom_left_radius = value; }
|
||||||
void set_border_bottom_right_radius(CSS::BorderRadiusData value) { m_noninherited.border_bottom_right_radius = value; }
|
void set_border_bottom_right_radius(CSS::BorderRadiusData value) { m_noninherited.border_bottom_right_radius = value; }
|
||||||
void set_border_top_left_radius(CSS::BorderRadiusData value) { m_noninherited.border_top_left_radius = value; }
|
void set_border_top_left_radius(CSS::BorderRadiusData value) { m_noninherited.border_top_left_radius = value; }
|
||||||
|
|
|
@ -355,6 +355,14 @@ Optional<CSS::Appearance> StyleProperties::appearance() const
|
||||||
return appearance;
|
return appearance;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
CSS::BackdropFilter StyleProperties::backdrop_filter() const
|
||||||
|
{
|
||||||
|
auto value = property(CSS::PropertyID::BackdropFilter);
|
||||||
|
if (value->is_filter_value_list())
|
||||||
|
return BackdropFilter(value->as_filter_value_list());
|
||||||
|
return BackdropFilter::make_none();
|
||||||
|
}
|
||||||
|
|
||||||
Optional<CSS::Position> StyleProperties::position() const
|
Optional<CSS::Position> StyleProperties::position() const
|
||||||
{
|
{
|
||||||
auto value = property(CSS::PropertyID::Position);
|
auto value = property(CSS::PropertyID::Position);
|
||||||
|
|
|
@ -70,6 +70,7 @@ public:
|
||||||
Optional<CSS::AlignItems> align_items() const;
|
Optional<CSS::AlignItems> align_items() const;
|
||||||
Optional<CSS::AlignSelf> align_self() const;
|
Optional<CSS::AlignSelf> align_self() const;
|
||||||
Optional<CSS::Appearance> appearance() const;
|
Optional<CSS::Appearance> appearance() const;
|
||||||
|
CSS::BackdropFilter backdrop_filter() const;
|
||||||
float opacity() const;
|
float opacity() const;
|
||||||
Optional<CSS::Visibility> visibility() const;
|
Optional<CSS::Visibility> visibility() const;
|
||||||
Optional<CSS::ImageRendering> image_rendering() const;
|
Optional<CSS::ImageRendering> image_rendering() const;
|
||||||
|
|
|
@ -393,6 +393,7 @@ void NodeWithStyle::apply_style(const CSS::StyleProperties& computed_style)
|
||||||
computed_values.set_flex_shrink(computed_style.flex_shrink());
|
computed_values.set_flex_shrink(computed_style.flex_shrink());
|
||||||
computed_values.set_order(computed_style.order());
|
computed_values.set_order(computed_style.order());
|
||||||
computed_values.set_clip(computed_style.clip());
|
computed_values.set_clip(computed_style.clip());
|
||||||
|
computed_values.set_backdrop_filter(computed_style.backdrop_filter());
|
||||||
|
|
||||||
auto justify_content = computed_style.justify_content();
|
auto justify_content = computed_style.justify_content();
|
||||||
if (justify_content.has_value())
|
if (justify_content.has_value())
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue