1
Fork 0
mirror of https://github.com/RGBCube/serenity synced 2025-07-24 21:47:43 +00:00

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
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 float Length::relative_length_to_px(const LayoutNode& layout_node) const
{ {
switch (m_type) { switch (m_type) {
case Type::Ex:
return m_value * layout_node.specified_style().font().x_height();
case Type::Em: case Type::Em:
return m_value * layout_node.font_size(); return m_value * layout_node.font_size();
case Type::Rem: case Type::Rem:
@ -49,6 +51,8 @@ const char* Length::unit_name() const
return "px"; return "px";
case Type::Pt: case Type::Pt:
return "pt"; return "pt";
case Type::Ex:
return "ex";
case Type::Em: case Type::Em:
return "em"; return "em";
case Type::Rem: case Type::Rem:

View file

@ -39,6 +39,7 @@ public:
Auto, Auto,
Px, Px,
Pt, Pt,
Ex,
Em, Em,
Rem, Rem,
}; };
@ -84,7 +85,7 @@ public:
bool is_percentage() const { return m_type == Type::Percentage; } bool is_percentage() const { return m_type == Type::Percentage; }
bool is_auto() const { return m_type == Type::Auto; } bool is_auto() const { return m_type == Type::Auto; }
bool is_absolute() const { return m_type == Type::Px || m_type == Type::Pt; } 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; } float raw_value() const { return m_value; }
ALWAYS_INLINE float to_px(const LayoutNode& layout_node) const 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")) { } else if (view.to_string().to_lowercase().ends_with("em")) {
type = CSS::Length::Type::Em; type = CSS::Length::Type::Em;
value = try_parse_float(view.substring_view(0, view.length() - 2)); 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") { } else if (view == "0") {
type = CSS::Length::Type::Px; type = CSS::Length::Type::Px;
value = 0; value = 0;