LibWeb: Handle CSS "ex" lengths (relative to font x-height)

These are pretty rare, but they do come up in some places and it's not
hard to support. The Gfx::Font information is approximate (and bad)
but we can fix that separately.
This commit is contained in:
Andreas Kling 2020-08-07 20:30:27 +02:00
parent 0bbced444b
commit 498845ea2f
Notes: sideshowbarker 2024-07-19 04:09:13 +09:00
3 changed files with 9 additions and 1 deletions

View File

@ -33,6 +33,8 @@ namespace Web::CSS {
float Length::relative_length_to_px(const LayoutNode& layout_node) const
{
switch (m_type) {
case Type::Ex:
return m_value * layout_node.specified_style().font().x_height();
case Type::Em:
return m_value * layout_node.font_size();
case Type::Rem:
@ -49,6 +51,8 @@ const char* Length::unit_name() const
return "px";
case Type::Pt:
return "pt";
case Type::Ex:
return "ex";
case Type::Em:
return "em";
case Type::Rem:

View File

@ -39,6 +39,7 @@ public:
Auto,
Px,
Pt,
Ex,
Em,
Rem,
};
@ -84,7 +85,7 @@ public:
bool is_percentage() const { return m_type == Type::Percentage; }
bool is_auto() const { return m_type == Type::Auto; }
bool is_absolute() const { return m_type == Type::Px || m_type == Type::Pt; }
bool is_relative() const { return m_type == Type::Em || m_type == Type::Rem; }
bool is_relative() const { return m_type == Type::Ex || m_type == Type::Em || m_type == Type::Rem; }
float raw_value() const { return m_value; }
ALWAYS_INLINE float to_px(const LayoutNode& layout_node) const

View File

@ -284,6 +284,9 @@ static CSS::Length parse_length(const CSS::ParsingContext& context, const String
} else if (view.to_string().to_lowercase().ends_with("em")) {
type = CSS::Length::Type::Em;
value = try_parse_float(view.substring_view(0, view.length() - 2));
} else if (view.to_string().to_lowercase().ends_with("ex")) {
type = CSS::Length::Type::Ex;
value = try_parse_float(view.substring_view(0, view.length() - 2));
} else if (view == "0") {
type = CSS::Length::Type::Px;
value = 0;