OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <meta charset="UTF-8"> | 2 <meta charset="UTF-8"> |
3 <style> | 3 <style> |
4 .target { | 4 .target { |
5 width: 40px; | 5 width: 40px; |
6 height: 40px; | 6 height: 40px; |
7 background-color: black; | 7 background-color: black; |
8 } | 8 } |
9 .expected { | 9 .expected { |
10 background-color: green; | 10 background-color: green; |
(...skipping 44 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
55 assertComposition({ | 55 assertComposition({ |
56 property: 'box-shadow', | 56 property: 'box-shadow', |
57 underlying: 'rgb(10, 20, 30) 1px 2px 3px 4px, rgb(20, 40, 60) 2px 4px 6px 8px'
, | 57 underlying: 'rgb(10, 20, 30) 1px 2px 3px 4px, rgb(20, 40, 60) 2px 4px 6px 8px'
, |
58 addFrom: 'rgb(100, 100, 100) 10px 20px 30px 40px', | 58 addFrom: 'rgb(100, 100, 100) 10px 20px 30px 40px', |
59 replaceTo: 'rgb(200, 200, 200) 20px 40px 60px 80px', | 59 replaceTo: 'rgb(200, 200, 200) 20px 40px 60px 80px', |
60 }, [ | 60 }, [ |
61 {at: -0.3, is: 'rgb(83, 96, 109) 8.3px 16.6px 24.9px 33.2px, rgb(96, 122, 148)
9.6px 19.2px 28.8px 38.4px'}, | 61 {at: -0.3, is: 'rgb(83, 96, 109) 8.3px 16.6px 24.9px 33.2px, rgb(96, 122, 148)
9.6px 19.2px 28.8px 38.4px'}, |
62 {at: 0, is: 'rgb(110, 120, 130) 11px 22px 33px 44px, rgb(120, 140, 160) 12px 2
4px 36px 48px'}, | 62 {at: 0, is: 'rgb(110, 120, 130) 11px 22px 33px 44px, rgb(120, 140, 160) 12px 2
4px 36px 48px'}, |
63 {at: 0.5, is: 'rgb(155, 160, 165) 15.5px 31px 46.5px 62px, rgb(160, 170, 180)
16px 32px 48px 64px'}, | 63 {at: 0.5, is: 'rgb(155, 160, 165) 15.5px 31px 46.5px 62px, rgb(160, 170, 180)
16px 32px 48px 64px'}, |
64 {at: 1, is: 'rgb(200, 200, 200) 20px 40px 60px 80px'}, | 64 {at: 1, is: 'rgb(200, 200, 200) 20px 40px 60px 80px'}, |
65 {at: 1.5, is: 'rgba(255, 255, 255, 0.5) 24.5px 49px 73.5px 98px, rgba(255, 255
, 255, 0.5) 24px 48px 72px 96px'}, | 65 {at: 1.5, is: 'rgba(255, 255, 255, 0.501961) 24.5px 49px 73.5px 98px, rgba(255
, 255, 255, 0.501961) 24px 48px 72px 96px'}, |
66 ]); | 66 ]); |
67 | 67 |
68 assertComposition({ | 68 assertComposition({ |
69 property: 'box-shadow', | 69 property: 'box-shadow', |
70 underlying: 'rgb(10, 20, 30) 1px 2px 3px 4px, rgb(20, 40, 60) 2px 4px 6px 8px'
, | 70 underlying: 'rgb(10, 20, 30) 1px 2px 3px 4px, rgb(20, 40, 60) 2px 4px 6px 8px'
, |
71 replaceFrom: 'rgb(100, 100, 100) 10px 20px 30px 40px', | 71 replaceFrom: 'rgb(100, 100, 100) 10px 20px 30px 40px', |
72 addTo: 'rgb(200, 200, 200) 20px 40px 60px 80px', | 72 addTo: 'rgb(200, 200, 200) 20px 40px 60px 80px', |
73 }, [ | 73 }, [ |
74 {at: -0.3, is: 'rgba(96, 91, 87, 0.701961) 6.7px 13.4px 20.1px 26.8px, rgba(91
, 83, 74, 0.701961) 6.4px 12.8px 19.2px 25.6px'}, | 74 {at: -0.3, is: 'rgba(96, 91, 87, 0.701961) 6.7px 13.4px 20.1px 26.8px, rgba(91
, 83, 74, 0.701961) 6.4px 12.8px 19.2px 25.6px'}, |
75 {at: 0, is: 'rgb(100, 100, 100) 10px 20px 30px 40px'}, | 75 {at: 0, is: 'rgb(100, 100, 100) 10px 20px 30px 40px'}, |
76 {at: 0.5, is: 'rgb(155, 160, 165) 15.5px 31px 46.5px 62px, rgb(160, 170, 180)
16px 32px 48px 64px'}, | 76 {at: 0.5, is: 'rgb(155, 160, 165) 15.5px 31px 46.5px 62px, rgb(160, 170, 180)
16px 32px 48px 64px'}, |
77 {at: 1, is: 'rgb(210, 220, 230) 21px 42px 63px 84px, rgb(220, 240, 255) 22px 4
4px 66px 88px'}, | 77 {at: 1, is: 'rgb(210, 220, 230) 21px 42px 63px 84px, rgb(220, 240, 255) 22px 4
4px 66px 88px'}, |
78 {at: 1.5, is: 'rgb(255, 255, 255) 26.5px 53px 79.5px 106px, rgb(255, 255, 255)
28px 56px 84px 112px'}, | 78 {at: 1.5, is: 'rgb(255, 255, 255) 26.5px 53px 79.5px 106px, rgb(255, 255, 255)
28px 56px 84px 112px'}, |
79 ]); | 79 ]); |
80 | 80 |
81 assertComposition({ | 81 assertComposition({ |
82 property: 'box-shadow', | 82 property: 'box-shadow', |
83 underlying: 'rgb(10, 20, 30) 1px 2px 3px 4px, rgb(20, 40, 60) 2px 4px 6px 8px,
rgb(40, 80, 120) 4px 8px 12px 16px', | 83 underlying: 'rgb(10, 20, 30) 1px 2px 3px 4px, rgb(20, 40, 60) 2px 4px 6px 8px,
rgb(40, 80, 120) 4px 8px 12px 16px', |
84 addFrom: 'rgb(100, 100, 100) 10px 20px 30px 40px, rgb(200, 200, 200) 20px 40px
60px 80px', | 84 addFrom: 'rgb(100, 100, 100) 10px 20px 30px 40px, rgb(200, 200, 200) 20px 40px
60px 80px', |
85 replaceTo: 'rgb(200, 200, 200) 20px 40px 60px 80px', | 85 replaceTo: 'rgb(200, 200, 200) 20px 40px 60px 80px', |
86 }, [ | 86 }, [ |
87 {at: -0.3, is: 'rgb(83, 96, 109) 8.3px 16.6px 24.9px 33.2px, rgb(226, 252, 255
) 22.6px 45.2px 67.8px 90.4px, rgb(122, 174, 226) 12.2px 24.4px 36.6px 48.8px, r
gb(213, 226, 239) 21.3px 42.6px 63.9px 85.2px, rgb(96, 122, 148) 9.6px 19.2px 28
.8px 38.4px, rgb(252, 255, 255) 25.2px 50.4px 75.6px 100.8px'}, | 87 {at: -0.3, is: 'rgb(83, 96, 109) 8.3px 16.6px 24.9px 33.2px, rgb(226, 252, 255
) 22.6px 45.2px 67.8px 90.4px, rgb(122, 174, 226) 12.2px 24.4px 36.6px 48.8px, r
gb(213, 226, 239) 21.3px 42.6px 63.9px 85.2px, rgb(96, 122, 148) 9.6px 19.2px 28
.8px 38.4px, rgb(252, 255, 255) 25.2px 50.4px 75.6px 100.8px'}, |
88 {at: 0, is: 'rgb(110, 120, 130) 11px 22px 33px 44px, rgb(220, 240, 255) 22px 4
4px 66px 88px, rgb(140, 180, 220) 14px 28px 42px 56px, rgb(210, 220, 230) 21px 4
2px 63px 84px, rgb(120, 140, 160) 12px 24px 36px 48px, rgb(240, 255, 255) 24px 4
8px 72px 96px'}, | 88 {at: 0, is: 'rgb(110, 120, 130) 11px 22px 33px 44px, rgb(220, 240, 255) 22px 4
4px 66px 88px, rgb(140, 180, 220) 14px 28px 42px 56px, rgb(210, 220, 230) 21px 4
2px 63px 84px, rgb(120, 140, 160) 12px 24px 36px 48px, rgb(240, 255, 255) 24px 4
8px 72px 96px'}, |
89 {at: 0.5, is: 'rgb(155, 160, 165) 15.5px 31px 46.5px 62px, rgb(210, 220, 230)
21px 42px 63px 84px, rgb(170, 190, 210) 17px 34px 51px 68px, rgb(205, 210, 215)
20.5px 41px 61.5px 82px, rgb(160, 170, 180) 16px 32px 48px 64px, rgb(220, 240, 2
55) 22px 44px 66px 88px'}, | 89 {at: 0.5, is: 'rgb(155, 160, 165) 15.5px 31px 46.5px 62px, rgb(210, 220, 230)
21px 42px 63px 84px, rgb(170, 190, 210) 17px 34px 51px 68px, rgb(205, 210, 215)
20.5px 41px 61.5px 82px, rgb(160, 170, 180) 16px 32px 48px 64px, rgb(220, 240, 2
55) 22px 44px 66px 88px'}, |
90 {at: 1, is: 'rgb(200, 200, 200) 20px 40px 60px 80px'}, | 90 {at: 1, is: 'rgb(200, 200, 200) 20px 40px 60px 80px'}, |
91 {at: 1.5, is: 'rgba(255, 255, 255, 0.5) 24.5px 49px 73.5px 98px, rgba(255, 255
, 255, 0.5) 19px 38px 57px 76px, rgba(255, 255, 255, 0.5) 23px 46px 69px 92px, r
gba(255, 255, 255, 0.5) 19.5px 39px 58.5px 78px, rgba(255, 255, 255, 0.5) 24px 4
8px 72px 96px, rgba(255, 255, 255, 0.5) 18px 36px 54px 72px'}, | 91 {at: 1.5, is: 'rgba(255, 255, 255, 0.501961) 24.5px 49px 73.5px 98px, rgba(255
, 255, 255, 0.501961) 19px 38px 57px 76px, rgba(255, 255, 255, 0.501961) 23px 46
px 69px 92px, rgba(255, 255, 255, 0.501961) 19.5px 39px 58.5px 78px, rgba(255, 2
55, 255, 0.501961) 24px 48px 72px 96px, rgba(255, 255, 255, 0.501961) 18px 36px
54px 72px'}, |
92 ]); | 92 ]); |
93 </script> | 93 </script> |
94 </body> | 94 </body> |
OLD | NEW |