Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(86)

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: LayoutTests/transforms/3d/point-mapping/3d-point-mapping-preserve-3d.html

Issue 637763002: Unprefix usage of -webkit-transform in tests (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master
Patch Set: Created 6 years, 2 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
« no previous file with comments | « LayoutTests/transforms/3d/point-mapping/3d-point-mapping-overlapping.html ('k') | LayoutTests/transforms/svg-vs-css.xhtml » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <html> 1 <html>
2 <head> 2 <head>
3 <title>Point mapping through 3D transform hierarchies</title> 3 <title>Point mapping through 3D transform hierarchies</title>
4 <script src="point-mapping-helpers.js" type="text/javascript" charset="utf-8"> </script> 4 <script src="point-mapping-helpers.js" type="text/javascript" charset="utf-8"> </script>
5 <script type="text/javascript" charset="utf-8"> 5 <script type="text/javascript" charset="utf-8">
6 6
7 function test() 7 function test()
8 { 8 {
9 // In non-test mode, show the mouse coords for testing 9 // In non-test mode, show the mouse coords for testing
10 if (!window.testRunner) 10 if (!window.testRunner)
(...skipping 88 matching lines...) Expand 10 before | Expand all | Expand 10 after
99 .transformed-3d { 99 .transformed-3d {
100 position: relative; 100 position: relative;
101 height: 100px; 101 height: 100px;
102 width: 100px; 102 width: 100px;
103 padding: 20px; 103 padding: 20px;
104 margin: 20px; 104 margin: 20px;
105 border: 1px solid black; 105 border: 1px solid black;
106 background-color: #81AA8A; 106 background-color: #81AA8A;
107 -webkit-transform-style: preserve-3d; 107 -webkit-transform-style: preserve-3d;
108 -webkit-box-sizing: border-box; 108 -webkit-box-sizing: border-box;
109 -webkit-transform: rotateY(-30deg); 109 transform: rotateY(-30deg);
110 } 110 }
111 111
112 .transformed-flat { 112 .transformed-flat {
113 position: relative; 113 position: relative;
114 height: 100px; 114 height: 100px;
115 width: 100px; 115 width: 100px;
116 padding: 20px; 116 padding: 20px;
117 margin: 20px; 117 margin: 20px;
118 border: 1px solid black; 118 border: 1px solid black;
119 background-color: #AA7994; 119 background-color: #AA7994;
120 -webkit-transform-style: flat; 120 -webkit-transform-style: flat;
121 -webkit-box-sizing: border-box; 121 -webkit-box-sizing: border-box;
122 -webkit-transform: rotateY(-30deg); 122 transform: rotateY(-30deg);
123 } 123 }
124 124
125 .inner { 125 .inner {
126 background-color: blue; 126 background-color: blue;
127 height: 90px; 127 height: 90px;
128 width: 90px; 128 width: 90px;
129 } 129 }
130 130
131 #results { 131 #results {
132 position: absolute; 132 position: absolute;
(...skipping 38 matching lines...) Expand 10 before | Expand all | Expand 10 after
171 <div class="transformed-3d box" id="box7"> 171 <div class="transformed-3d box" id="box7">
172 <div class="inner box" style="position: relative" id="box8"> 172 <div class="inner box" style="position: relative" id="box8">
173 </div> 173 </div>
174 </div> 174 </div>
175 </div> 175 </div>
176 </div> 176 </div>
177 <div class="test four"> 177 <div class="test four">
178 <!-- Nested transformed, preserve-3d divs in perpsective --> 178 <!-- Nested transformed, preserve-3d divs in perpsective -->
179 <div class="container box" id="box9"> 179 <div class="container box" id="box9">
180 <div class="transformed-3d box" id="box10"> 180 <div class="transformed-3d box" id="box10">
181 <div class="transformed-3d box" style="-webkit-transform: translateZ(20px) rotateY(50deg)" id="box11"> 181 <div class="transformed-3d box" style="transform: translateZ(20px) rotateY (50deg)" id="box11">
182 </div> 182 </div>
183 </div> 183 </div>
184 </div> 184 </div>
185 </div> 185 </div>
186 <div class="test five"> 186 <div class="test five">
187 <!-- Transformed, preserve-3d div in perpsective with non-layer child --> 187 <!-- Transformed, preserve-3d div in perpsective with non-layer child -->
188 <div class="container box" id="box12"> 188 <div class="container box" id="box12">
189 <div class="transformed-3d box" id="box13"> 189 <div class="transformed-3d box" id="box13">
190 <div class="transformed-3d box" style="-webkit-transform: translateZ(10px) rotateY(50deg)" id="box14"> 190 <div class="transformed-3d box" style="transform: translateZ(10px) rotateY (50deg)" id="box14">
191 <div class="inner box" id="box15"> 191 <div class="inner box" id="box15">
192 </div> 192 </div>
193 </div> 193 </div>
194 </div> 194 </div>
195 </div> 195 </div>
196 </div> 196 </div>
197 <div class="test six"> 197 <div class="test six">
198 <!-- Flatten in the middle of 3d --> 198 <!-- Flatten in the middle of 3d -->
199 <div class="container box" id="box16"> 199 <div class="container box" id="box16">
200 <div class="transformed-3d box" id="box17"> 200 <div class="transformed-3d box" id="box17">
201 <div class="transformed-3d box" style="-webkit-transform: translateZ(10px) rotateY(20deg)" id="box18"> 201 <div class="transformed-3d box" style="transform: translateZ(10px) rotateY (20deg)" id="box18">
202 <div class="transformed-flat box" style="-webkit-transform-style: flat; -webkit-transform: rotateX(-20deg)" id="box19"> 202 <div class="transformed-flat box" style="-webkit-transform-style: flat; transform: rotateX(-20deg)" id="box19">
203 <div class="inner box" id="box20"> 203 <div class="inner box" id="box20">
204 </div> 204 </div>
205 </div> 205 </div>
206 </div> 206 </div>
207 </div> 207 </div>
208 </div> 208 </div>
209 </div> 209 </div>
210 210
211 <div id="mousepos"></div> 211 <div id="mousepos"></div>
212 212
213 </body> 213 </body>
214 </html> 214 </html>
OLDNEW
« no previous file with comments | « LayoutTests/transforms/3d/point-mapping/3d-point-mapping-overlapping.html ('k') | LayoutTests/transforms/svg-vs-css.xhtml » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698