| Index: sky/tests/lowlevel/layers.sky
|
| diff --git a/sky/tests/lowlevel/layers.sky b/sky/tests/lowlevel/layers.sky
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..f61ec8fb922ab1ff8d64bd775e862b2c18a0b2a6
|
| --- /dev/null
|
| +++ b/sky/tests/lowlevel/layers.sky
|
| @@ -0,0 +1,59 @@
|
| +<sky>
|
| +
|
| +<import src="../resources/run-after-display.sky" as="runAfterDisplay" />
|
| +<style>
|
| + sky {
|
| + padding: 10px;
|
| + }
|
| + div {
|
| + width: 50px;
|
| + height: 50px;
|
| + white-space: nowrap;
|
| + }
|
| +</style>
|
| +Transforms
|
| +<div style="transform: translate3d(10px, 10px, 0); background-color: pink;">
|
| + One
|
| + <div style="transform: translate3d(10px, 10px, 0); background-color: salmon;">
|
| + Two
|
| + <div style="transform: translate3d(10px, 10px, 0); background-color: papayawhip;">
|
| + Three
|
| + </div>
|
| + </div>
|
| +</div>
|
| +
|
| +<div style="position: absolute; right: 50px;">
|
| + <div style="background-color: red;">
|
| + 1
|
| + </div>
|
| + <div style="position: absolute; left: 40px; top: 40px; z-index: 2; background-color: pink;">
|
| + 4
|
| + </div>
|
| + <div style="position: absolute; left: 20px; top: 20px; z-index: 0; background-color: salmon;">
|
| + 2
|
| + </div>
|
| + <div style="position: absolute; left: 35px; top: 20px; z-index: 1; background-color: papayawhip;">
|
| + 3
|
| + </div>
|
| + <div style="background-color: green;">
|
| + 1
|
| + </div>
|
| + z-index
|
| +</div>
|
| +
|
| +<div style="position: absolute; bottom: 50px;">
|
| + Clip-path
|
| + <div style="background-color: pink; -webkit-clip-path: circle(25px at 25px 25px);">
|
| + <div style="background-color: salmon; -webkit-clip-path: circle(25px at 35px 35px);">
|
| + <div style="background-color: papayawhip; -webkit-clip-path: circle(25px at 45px 45px);"></div>
|
| + </div>
|
| + </div>
|
| +</div>
|
| +
|
| +<script>
|
| +runAfterDisplay(function() {
|
| + internals.notifyTestComplete("");
|
| +});
|
| +</script>
|
| +
|
| +</sky>
|
|
|