haikuwebkit/LayoutTests/css3/filters/backdrop/backdrop-filter-with-border...

33 lines
832 B
HTML

<head>
<meta name="viewport" content="width=device-width">
<title>This tests that we correctly remove the reflection of an element with a backdrop-filter applied to it.</title>
<style>
svg {
position: absolute;
top: 0px;
left: 0px;
width: 200px;
height: 200px;
background-color: lightgray;
}
.backdrop {
position: absolute;
top: 10px;
left: 60px;
width: 80px;
height: 80px;
background-color: rgba(255, 255, 255, 0.5);
border-radius: 20px;
-webkit-backdrop-filter: invert(100%);
}
</style>
</head>
<svg viewbox="0 0 2 2">
<rect fill="black" x="0" y="0" width="1" height="1"></rect>
<rect fill="black" x="1" y="1" width="1" height="1"></rect>
</svg>
<div class="backdrop"></div>