1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
|
# This tests a clip chain (clipid=6) that is composed of two clips (clipid=3
# and clipid=4) with a parent clip chain (composed of two more clips (clipid=1
# and clipid=2). This effectively tests a "complex" clip chain that includes
# and is applied to multiple non-hierarchical reference frames as well as
# having a similarly complicated parent. Each clip is a rounded corner which,
# when rotated, clips a box with all corners rounded.
root:
items:
-
bounds: [0, 0, 200, 200]
type: stacking-context
transform: rotate(180)
items:
- type: clip
id: 10
bounds: [0, 0, 200, 200]
complex:
- rect: [0, 0, 200, 200]
radius: {
top-left: 20,
}
- type: clip
id: 2
bounds: [0, 0, 200, 200]
complex:
- rect: [0, 0, 200, 200]
radius: {
top-right: 20,
}
-
bounds: [0, 0, 200, 200]
type: stacking-context
transform: rotate(-90)
items:
- type: clip
id: 3
bounds: [0, 0, 200, 200]
complex:
- rect: [0, 0, 200, 200]
radius: {
bottom-left: 20,
}
- type: clip
id: 4
bounds: [0, 0, 200, 200]
complex:
- rect: [0, 0, 200, 200]
radius: {
top-left: 20,
}
- type: clip-chain
id: 5
clips: [10, 2]
- type: clip-chain
id: 6
parent: 5
clips: [3, 4]
- type: rect
bounds: [0, 0, 200, 200]
color: green
clip-and-scroll: [root-scroll-node, 6]
|
