mirror of
https://github.com/RGBCube/serenity
synced 2025-07-25 21:17:44 +00:00
LibHTML: Implement basic :hover pseudo-class support
This is currently very aggressive. Whenever the Document's hovered node changes, we invalidate all style and do a full relayout. It does look cool though. So cool that I'm adding it to the default stylesheet. :^)
This commit is contained in:
parent
605a225b53
commit
61ef17b87a
6 changed files with 52 additions and 1 deletions
|
@ -90,6 +90,10 @@ a {
|
|||
text-decoration: underline;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: red;
|
||||
}
|
||||
|
||||
hr {
|
||||
margin-top: 4;
|
||||
margin-bottom: 4;
|
||||
|
|
|
@ -1,10 +1,33 @@
|
|||
#include <LibHTML/CSS/SelectorEngine.h>
|
||||
#include <LibHTML/DOM/Document.h>
|
||||
#include <LibHTML/DOM/Element.h>
|
||||
|
||||
namespace SelectorEngine {
|
||||
|
||||
static bool matches_hover_pseudo_class(const Element& element)
|
||||
{
|
||||
auto* hovered_node = element.document().hovered_node();
|
||||
if (!hovered_node)
|
||||
return false;
|
||||
if (&element == hovered_node)
|
||||
return true;
|
||||
return element.is_ancestor_of(*hovered_node);
|
||||
}
|
||||
|
||||
bool matches(const Selector::Component& component, const Element& element)
|
||||
{
|
||||
switch (component.pseudo_class) {
|
||||
case Selector::Component::PseudoClass::None:
|
||||
break;
|
||||
case Selector::Component::PseudoClass::Link:
|
||||
ASSERT_NOT_REACHED();
|
||||
break;
|
||||
case Selector::Component::PseudoClass::Hover:
|
||||
if (!matches_hover_pseudo_class(element))
|
||||
return false;
|
||||
break;
|
||||
}
|
||||
|
||||
switch (component.type) {
|
||||
case Selector::Component::Type::Id:
|
||||
return component.value == element.attribute("id");
|
||||
|
|
|
@ -195,3 +195,13 @@ const LayoutDocument* Document::layout_node() const
|
|||
{
|
||||
return static_cast<const LayoutDocument*>(Node::layout_node());
|
||||
}
|
||||
|
||||
void Document::set_hovered_node(Node* node)
|
||||
{
|
||||
if (m_hovered_node == node)
|
||||
return;
|
||||
|
||||
m_hovered_node = node;
|
||||
invalidate_style();
|
||||
}
|
||||
|
||||
|
|
|
@ -38,7 +38,7 @@ public:
|
|||
|
||||
virtual String tag_name() const override { return "#document"; }
|
||||
|
||||
void set_hovered_node(Node* node) { m_hovered_node = node; }
|
||||
void set_hovered_node(Node*);
|
||||
Node* hovered_node() { return m_hovered_node; }
|
||||
const Node* hovered_node() const { return m_hovered_node; }
|
||||
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue