Browse Source

LibWeb: Establish stacking context when backdrop-filter is not 'none'

Luke Wilde 2 years ago
parent
commit
8ace6b4f1d

+ 1 - 0
Userland/Libraries/LibWeb/CSS/Properties.json

@@ -29,6 +29,7 @@
   },
   },
   "backdrop-filter": {
   "backdrop-filter": {
     "affects-layout": false,
     "affects-layout": false,
+    "affects-stacking-context": true,
     "inherited": false,
     "inherited": false,
     "initial": "none",
     "initial": "none",
     "valid-types": [
     "valid-types": [

+ 7 - 0
Userland/Libraries/LibWeb/Layout/Node.cpp

@@ -117,6 +117,13 @@ bool Node::establishes_stacking_context() const
     if (parent() && parent()->display().is_grid_inside() && computed_values().z_index().has_value())
     if (parent() && parent()->display().is_grid_inside() && computed_values().z_index().has_value())
         return true;
         return true;
 
 
+    // https://drafts.fxtf.org/filter-effects-2/#backdrop-filter-operation
+    // A computed value of other than none results in the creation of both a stacking context [CSS21] and a Containing Block for absolute and fixed position descendants,
+    // unless the element it applies to is a document root element in the current browsing context.
+    // Spec Note: This rule works in the same way as for the filter property.
+    if (!computed_values().backdrop_filter().is_none())
+        return true;
+
     return computed_values().opacity() < 1.0f;
     return computed_values().opacity() < 1.0f;
 }
 }