← Back to branch summary

~ubuntu-branches/ubuntu/vivid/ruby-compass/vivid-proposed

« back to all changes in this revision

Viewing changes to test/fixtures/stylesheets/compass/css/transform.css

  • Committer: Package Import Robot
  • Author(s): Jonas Smedegaard
  • Date: 2014-10-23 01:41:15 UTC
  • mfrom: (12.1.4 sid)
  • Revision ID: package-import@ubuntu.com-20141023014115-bfhklnxtb876j1k4
Tags: 1.0.1~dfsg-3
* Fix tighten dependencies on ruby-sass and ruby-chunky-png.
* Adjust watch file to track only stable releases.
* Update Vcs-Browser URL to use cgit web frontend.
* Declare compliance with Debian Policy 3.9.6.
* Add NEWS entry about Blueprint now packaged separately.
* Stop build-depend explicitly on ruby.

Show diffs side-by-side

added added

removed removed

Lines of Context:
test/fixtures/stylesheets/compass/css/transform.css
1
 
.apply-origin-2d {
2
 
  -webkit-transform-origin: 2px 5%;
3
 
  -moz-transform-origin: 2px 5%;
4
 
  -ms-transform-origin: 2px 5%;
5
 
  -o-transform-origin: 2px 5%;
6
 
  transform-origin: 2px 5%; }
7
 
 
8
 
.apply-origin-3d {
9
 
  -webkit-transform-origin: 2px 5% 2in;
10
 
  -moz-transform-origin: 2px 5% 2in;
11
 
  -ms-transform-origin: 2px 5% 2in;
12
 
  -o-transform-origin: 2px 5% 2in;
13
 
  transform-origin: 2px 5% 2in; }
14
 
 
15
 
.transform-origin-2d {
16
 
  -webkit-transform-origin: 100px 100px;
17
 
  -moz-transform-origin: 100px 100px;
18
 
  -ms-transform-origin: 100px 100px;
19
 
  -o-transform-origin: 100px 100px;
20
 
  transform-origin: 100px 100px; }
21
 
 
22
 
.transform-origin-3d {
23
 
  -webkit-transform-origin: 100px 100px 100px;
24
 
  -moz-transform-origin: 100px 100px 100px;
25
 
  -ms-transform-origin: 100px 100px 100px;
26
 
  -o-transform-origin: 100px 100px 100px;
27
 
  transform-origin: 100px 100px 100px; }
28
 
 
29
 
.transform-2d {
30
 
  -webkit-transform: rotateY(20deg);
31
 
  -moz-transform: rotateY(20deg);
32
 
  -ms-transform: rotateY(20deg);
33
 
  -o-transform: rotateY(20deg);
34
 
  transform: rotateY(20deg); }
35
 
 
36
 
.transform-3d {
37
 
  -webkit-transform: rotateZ(20deg);
38
 
  -moz-transform: rotateZ(20deg);
39
 
  -ms-transform: rotateZ(20deg);
40
 
  -o-transform: rotateZ(20deg);
41
 
  transform: rotateZ(20deg); }
42
 
 
43
 
.perspective {
44
 
  -webkit-perspective: 500;
45
 
  -moz-perspective: 500;
46
 
  -ms-perspective: 500;
47
 
  -o-perspective: 500;
48
 
  perspective: 500; }
49
 
 
50
 
.perspective-origin {
51
 
  -webkit-perspective-origin: 25% 25%;
52
 
  -moz-perspective-origin: 25% 25%;
53
 
  -ms-perspective-origin: 25% 25%;
54
 
  -o-perspective-origin: 25% 25%;
55
 
  perspective-origin: 25% 25%; }
56
 
 
57
 
.transform-style {
58
 
  -webkit-transform-style: preserve-3d;
59
 
  -moz-transform-style: preserve-3d;
60
 
  -ms-transform-style: preserve-3d;
61
 
  -o-transform-style: preserve-3d;
62
 
  transform-style: preserve-3d; }
63
 
 
64
 
.backface-visibility {
65
 
  -webkit-backface-visibility: hidden;
66
 
  -moz-backface-visibility: hidden;
67
 
  -ms-backface-visibility: hidden;
68
 
  -o-backface-visibility: hidden;
69
 
  backface-visibility: hidden; }
70
 
 
71
 
.scale {
72
 
  -webkit-transform: scale(30px, 50px);
73
 
  -moz-transform: scale(30px, 50px);
74
 
  -ms-transform: scale(30px, 50px);
75
 
  -o-transform: scale(30px, 50px);
76
 
  transform: scale(30px, 50px); }
77
 
 
78
 
.scale-3d {
79
 
  -webkit-transform: scale(30px, 50px);
80
 
  -moz-transform: scale(30px, 50px);
81
 
  -ms-transform: scale(30px, 50px);
82
 
  -o-transform: scale(30px, 50px);
83
 
  transform: scale(30px, 50px); }
84
 
 
85
 
.scale-with-perspective {
86
 
  -webkit-transform: perspective(500) scale(30px, 50px);
87
 
  -moz-transform: perspective(500) scale(30px, 50px);
88
 
  -ms-transform: perspective(500) scale(30px, 50px);
89
 
  -o-transform: perspective(500) scale(30px, 50px);
90
 
  transform: perspective(500) scale(30px, 50px); }
91
 
 
92
 
.scale-3d-with-perspective {
93
 
  -webkit-transform: perspective(500) scale(30px, 50px);
94
 
  -moz-transform: perspective(500) scale(30px, 50px);
95
 
  -ms-transform: perspective(500) scale(30px, 50px);
96
 
  -o-transform: perspective(500) scale(30px, 50px);
97
 
  transform: perspective(500) scale(30px, 50px); }
98
 
 
99
 
.scale-x {
100
 
  -webkit-transform: scaleX(30px);
101
 
  -moz-transform: scaleX(30px);
102
 
  -ms-transform: scaleX(30px);
103
 
  -o-transform: scaleX(30px);
104
 
  transform: scaleX(30px); }
105
 
 
106
 
.scale-x-3d {
107
 
  -webkit-transform: scaleX(30px);
108
 
  -moz-transform: scaleX(30px);
109
 
  -ms-transform: scaleX(30px);
110
 
  -o-transform: scaleX(30px);
111
 
  transform: scaleX(30px); }
112
 
 
113
 
.scale-x-with-perspective {
114
 
  -webkit-transform: perspective(500) scaleX(30px);
115
 
  -moz-transform: perspective(500) scaleX(30px);
116
 
  -ms-transform: perspective(500) scaleX(30px);
117
 
  -o-transform: perspective(500) scaleX(30px);
118
 
  transform: perspective(500) scaleX(30px); }
119
 
 
120
 
.scale-x-3d-with-perspective {
121
 
  -webkit-transform: perspective(500) scaleX(30px);
122
 
  -moz-transform: perspective(500) scaleX(30px);
123
 
  -ms-transform: perspective(500) scaleX(30px);
124
 
  -o-transform: perspective(500) scaleX(30px);
125
 
  transform: perspective(500) scaleX(30px); }
126
 
 
127
 
.scale-y {
128
 
  -webkit-transform: scaleY(50px);
129
 
  -moz-transform: scaleY(50px);
130
 
  -ms-transform: scaleY(50px);
131
 
  -o-transform: scaleY(50px);
132
 
  transform: scaleY(50px); }
133
 
 
134
 
.scale-y-3d {
135
 
  -webkit-transform: scaleY(50px);
136
 
  -moz-transform: scaleY(50px);
137
 
  -ms-transform: scaleY(50px);
138
 
  -o-transform: scaleY(50px);
139
 
  transform: scaleY(50px); }
140
 
 
141
 
.scale-y-with-perspective {
142
 
  -webkit-transform: perspective(500) scaleY(50px);
143
 
  -moz-transform: perspective(500) scaleY(50px);
144
 
  -ms-transform: perspective(500) scaleY(50px);
145
 
  -o-transform: perspective(500) scaleY(50px);
146
 
  transform: perspective(500) scaleY(50px); }
147
 
 
148
 
.scale-y-3d-with-perspective {
149
 
  -webkit-transform: perspective(500) scaleY(50px);
150
 
  -moz-transform: perspective(500) scaleY(50px);
151
 
  -ms-transform: perspective(500) scaleY(50px);
152
 
  -o-transform: perspective(500) scaleY(50px);
153
 
  transform: perspective(500) scaleY(50px); }
154
 
 
155
 
.scale-z {
156
 
  -webkit-transform: scaleZ(50px);
157
 
  -moz-transform: scaleZ(50px);
158
 
  -ms-transform: scaleZ(50px);
159
 
  -o-transform: scaleZ(50px);
160
 
  transform: scaleZ(50px); }
161
 
 
162
 
.scale-z-with-perspective {
163
 
  -webkit-transform: perspective(500) scaleZ(50px);
164
 
  -moz-transform: perspective(500) scaleZ(50px);
165
 
  -ms-transform: perspective(500) scaleZ(50px);
166
 
  -o-transform: perspective(500) scaleZ(50px);
167
 
  transform: perspective(500) scaleZ(50px); }
168
 
 
169
 
.scale3d {
170
 
  -webkit-transform: scale3d(30px, 50px, 100px);
171
 
  -moz-transform: scale3d(30px, 50px, 100px);
172
 
  -ms-transform: scale3d(30px, 50px, 100px);
173
 
  -o-transform: scale3d(30px, 50px, 100px);
174
 
  transform: scale3d(30px, 50px, 100px); }
175
 
 
176
 
.scaled3-with-perspective {
177
 
  -webkit-transform: perspective(500) scale3d(30px, 50px, 100px);
178
 
  -moz-transform: perspective(500) scale3d(30px, 50px, 100px);
179
 
  -ms-transform: perspective(500) scale3d(30px, 50px, 100px);
180
 
  -o-transform: perspective(500) scale3d(30px, 50px, 100px);
181
 
  transform: perspective(500) scale3d(30px, 50px, 100px); }
182
 
 
183
 
.rotate {
184
 
  -webkit-transform: perspective(500) rotate(25deg);
185
 
  -moz-transform: perspective(500) rotate(25deg);
186
 
  -ms-transform: perspective(500) rotate(25deg);
187
 
  -o-transform: perspective(500) rotate(25deg);
188
 
  transform: perspective(500) rotate(25deg); }
189
 
 
190
 
.rotate-with-perspective {
191
 
  -webkit-transform: perspective(500) rotate(25deg);
192
 
  -moz-transform: perspective(500) rotate(25deg);
193
 
  -ms-transform: perspective(500) rotate(25deg);
194
 
  -o-transform: perspective(500) rotate(25deg);
195
 
  transform: perspective(500) rotate(25deg); }
196
 
 
197
 
.rotate-z {
198
 
  -webkit-transform: rotate(25deg);
199
 
  -moz-transform: rotate(25deg);
200
 
  -ms-transform: rotate(25deg);
201
 
  -o-transform: rotate(25deg);
202
 
  transform: rotate(25deg); }
203
 
 
204
 
.rotate-z-with-perspective {
205
 
  -webkit-transform: perspective(500) rotate(25deg);
206
 
  -moz-transform: perspective(500) rotate(25deg);
207
 
  -ms-transform: perspective(500) rotate(25deg);
208
 
  -o-transform: perspective(500) rotate(25deg);
209
 
  transform: perspective(500) rotate(25deg); }
210
 
 
211
 
.rotate-x {
212
 
  -webkit-transform: rotateX(25deg);
213
 
  -moz-transform: rotateX(25deg);
214
 
  -ms-transform: rotateX(25deg);
215
 
  -o-transform: rotateX(25deg);
216
 
  transform: rotateX(25deg); }
217
 
 
218
 
.rotate-x-with-perspective {
219
 
  -webkit-transform: perspective(500) rotateX(25deg);
220
 
  -moz-transform: perspective(500) rotateX(25deg);
221
 
  -ms-transform: perspective(500) rotateX(25deg);
222
 
  -o-transform: perspective(500) rotateX(25deg);
223
 
  transform: perspective(500) rotateX(25deg); }
224
 
 
225
 
.rotate-y {
226
 
  -webkit-transform: rotateY(25deg);
227
 
  -moz-transform: rotateY(25deg);
228
 
  -ms-transform: rotateY(25deg);
229
 
  -o-transform: rotateY(25deg);
230
 
  transform: rotateY(25deg); }
231
 
 
232
 
.rotate-y-with-perspective {
233
 
  -webkit-transform: perspective(500) rotateY(25deg);
234
 
  -moz-transform: perspective(500) rotateY(25deg);
235
 
  -ms-transform: perspective(500) rotateY(25deg);
236
 
  -o-transform: perspective(500) rotateY(25deg);
237
 
  transform: perspective(500) rotateY(25deg); }
238
 
 
239
 
.rotate-3d {
240
 
  -webkit-transform: rotate3d(5, 2, 1, 75deg);
241
 
  -moz-transform: rotate3d(5, 2, 1, 75deg);
242
 
  -ms-transform: rotate3d(5, 2, 1, 75deg);
243
 
  -o-transform: rotate3d(5, 2, 1, 75deg);
244
 
  transform: rotate3d(5, 2, 1, 75deg); }
245
 
 
246
 
.rotate-3d-with-perspective {
247
 
  -webkit-transform: perspective(500) rotate3d(5, 2, 1, 75deg);
248
 
  -moz-transform: perspective(500) rotate3d(5, 2, 1, 75deg);
249
 
  -ms-transform: perspective(500) rotate3d(5, 2, 1, 75deg);
250
 
  -o-transform: perspective(500) rotate3d(5, 2, 1, 75deg);
251
 
  transform: perspective(500) rotate3d(5, 2, 1, 75deg); }
252
 
 
253
 
.translate {
254
 
  -webkit-transform: translate(20px, 30%);
255
 
  -moz-transform: translate(20px, 30%);
256
 
  -ms-transform: translate(20px, 30%);
257
 
  -o-transform: translate(20px, 30%);
258
 
  transform: translate(20px, 30%); }
259
 
 
260
 
.translate-with-perspective {
261
 
  -webkit-transform: perspective(500) translate(20px, 30%);
262
 
  -moz-transform: perspective(500) translate(20px, 30%);
263
 
  -ms-transform: perspective(500) translate(20px, 30%);
264
 
  -o-transform: perspective(500) translate(20px, 30%);
265
 
  transform: perspective(500) translate(20px, 30%); }
266
 
 
267
 
.translate-3d {
268
 
  -webkit-transform: translate(20px, 30%);
269
 
  -moz-transform: translate(20px, 30%);
270
 
  -ms-transform: translate(20px, 30%);
271
 
  -o-transform: translate(20px, 30%);
272
 
  transform: translate(20px, 30%); }
273
 
 
274
 
.translate-3d-with-perspective {
275
 
  -webkit-transform: perspective(500) translate(20px, 30%);
276
 
  -moz-transform: perspective(500) translate(20px, 30%);
277
 
  -ms-transform: perspective(500) translate(20px, 30%);
278
 
  -o-transform: perspective(500) translate(20px, 30%);
279
 
  transform: perspective(500) translate(20px, 30%); }
280
 
 
281
 
.translate-x {
282
 
  -webkit-transform: translateX(30px);
283
 
  -moz-transform: translateX(30px);
284
 
  -ms-transform: translateX(30px);
285
 
  -o-transform: translateX(30px);
286
 
  transform: translateX(30px); }
287
 
 
288
 
.translate-x-3d {
289
 
  -webkit-transform: translateX(30px);
290
 
  -moz-transform: translateX(30px);
291
 
  -ms-transform: translateX(30px);
292
 
  -o-transform: translateX(30px);
293
 
  transform: translateX(30px); }
294
 
 
295
 
.translate-x-with-perspective {
296
 
  -webkit-transform: perspective(500) translateX(30px);
297
 
  -moz-transform: perspective(500) translateX(30px);
298
 
  -ms-transform: perspective(500) translateX(30px);
299
 
  -o-transform: perspective(500) translateX(30px);
300
 
  transform: perspective(500) translateX(30px); }
301
 
 
302
 
.translate-x-3d-with-perspective {
303
 
  -webkit-transform: perspective(500) translateX(30px);
304
 
  -moz-transform: perspective(500) translateX(30px);
305
 
  -ms-transform: perspective(500) translateX(30px);
306
 
  -o-transform: perspective(500) translateX(30px);
307
 
  transform: perspective(500) translateX(30px); }
308
 
 
309
 
.translate-y {
310
 
  -webkit-transform: translateY(30px);
311
 
  -moz-transform: translateY(30px);
312
 
  -ms-transform: translateY(30px);
313
 
  -o-transform: translateY(30px);
314
 
  transform: translateY(30px); }
315
 
 
316
 
.translate-y-3d {
317
 
  -webkit-transform: translateY(30px);
318
 
  -moz-transform: translateY(30px);
319
 
  -ms-transform: translateY(30px);
320
 
  -o-transform: translateY(30px);
321
 
  transform: translateY(30px); }
322
 
 
323
 
.translate-y-with-perspective {
324
 
  -webkit-transform: perspective(500) translateY(30px);
325
 
  -moz-transform: perspective(500) translateY(30px);
326
 
  -ms-transform: perspective(500) translateY(30px);
327
 
  -o-transform: perspective(500) translateY(30px);
328
 
  transform: perspective(500) translateY(30px); }
329
 
 
330
 
.translate-y-3d-with-perspective {
331
 
  -webkit-transform: perspective(500) translateY(30px);
332
 
  -moz-transform: perspective(500) translateY(30px);
333
 
  -ms-transform: perspective(500) translateY(30px);
334
 
  -o-transform: perspective(500) translateY(30px);
335
 
  transform: perspective(500) translateY(30px); }
336
 
 
337
 
.translate-z {
338
 
  -webkit-transform: translateZ(30px);
339
 
  -moz-transform: translateZ(30px);
340
 
  -ms-transform: translateZ(30px);
341
 
  -o-transform: translateZ(30px);
342
 
  transform: translateZ(30px); }
343
 
 
344
 
.translate-z-with-perspective {
345
 
  -webkit-transform: perspective(500) translateZ(30px);
346
 
  -moz-transform: perspective(500) translateZ(30px);
347
 
  -ms-transform: perspective(500) translateZ(30px);
348
 
  -o-transform: perspective(500) translateZ(30px);
349
 
  transform: perspective(500) translateZ(30px); }
350
 
 
351
 
.translate-3d {
352
 
  -webkit-transform: translate3d(30px, 50px, 75px);
353
 
  -moz-transform: translate3d(30px, 50px, 75px);
354
 
  -ms-transform: translate3d(30px, 50px, 75px);
355
 
  -o-transform: translate3d(30px, 50px, 75px);
356
 
  transform: translate3d(30px, 50px, 75px); }
357
 
 
358
 
.translate-3d-with-perspective {
359
 
  -webkit-transform: perspective(500) translate3d(30px, 50px, 75px);
360
 
  -moz-transform: perspective(500) translate3d(30px, 50px, 75px);
361
 
  -ms-transform: perspective(500) translate3d(30px, 50px, 75px);
362
 
  -o-transform: perspective(500) translate3d(30px, 50px, 75px);
363
 
  transform: perspective(500) translate3d(30px, 50px, 75px); }
364
 
 
365
 
.skew {
366
 
  -webkit-transform: skew(20deg, 50deg);
367
 
  -moz-transform: skew(20deg, 50deg);
368
 
  -ms-transform: skew(20deg, 50deg);
369
 
  -o-transform: skew(20deg, 50deg);
370
 
  transform: skew(20deg, 50deg); }
371
 
 
372
 
.skew-3d {
373
 
  -webkit-transform: skew(20deg, 50deg);
374
 
  -moz-transform: skew(20deg, 50deg);
375
 
  -ms-transform: skew(20deg, 50deg);
376
 
  -o-transform: skew(20deg, 50deg);
377
 
  transform: skew(20deg, 50deg); }
378
 
 
379
 
.skew-x {
380
 
  -webkit-transform: skewX(20deg);
381
 
  -moz-transform: skewX(20deg);
382
 
  -ms-transform: skewX(20deg);
383
 
  -o-transform: skewX(20deg);
384
 
  transform: skewX(20deg); }
385
 
 
386
 
.skew-x-3d {
387
 
  -webkit-transform: skewX(20deg);
388
 
  -moz-transform: skewX(20deg);
389
 
  -ms-transform: skewX(20deg);
390
 
  -o-transform: skewX(20deg);
391
 
  transform: skewX(20deg); }
392
 
 
393
 
.skew-y {
394
 
  -webkit-transform: skewY(20deg);
395
 
  -moz-transform: skewY(20deg);
396
 
  -ms-transform: skewY(20deg);
397
 
  -o-transform: skewY(20deg);
398
 
  transform: skewY(20deg); }
399
 
 
400
 
.skew-y-3d {
401
 
  -webkit-transform: skewY(20deg);
402
 
  -moz-transform: skewY(20deg);
403
 
  -ms-transform: skewY(20deg);
404
 
  -o-transform: skewY(20deg);
405
 
  transform: skewY(20deg); }
406
 
 
407
 
.create-transform-2d {
408
 
  -webkit-transform: perspective(500) scale(20px, 20px) rotateX(25deg) rotateY(25deg) rotate3d(false 50px) translateX(50px) translateZ(50deg) skew(50deg, 50%);
409
 
  -moz-transform: perspective(500) scale(20px, 20px) rotateX(25deg) rotateY(25deg) rotate3d(false 50px) translateX(50px) translateZ(50deg) skew(50deg, 50%);
410
 
  -ms-transform: perspective(500) scale(20px, 20px) rotateX(25deg) rotateY(25deg) rotate3d(false 50px) translateX(50px) translateZ(50deg) skew(50deg, 50%);
411
 
  -o-transform: perspective(500) scale(20px, 20px) rotateX(25deg) rotateY(25deg) rotate3d(false 50px) translateX(50px) translateZ(50deg) skew(50deg, 50%);
412
 
  transform: perspective(500) scale(20px, 20px) rotateX(25deg) rotateY(25deg) rotate3d(false 50px) translateX(50px) translateZ(50deg) skew(50deg, 50%);
413
 
  -webkit-transform-origin: 50%;
414
 
  -moz-transform-origin: 50%;
415
 
  -ms-transform-origin: 50%;
416
 
  -o-transform-origin: 50%;
417
 
  transform-origin: 50%; }
418
 
 
419
 
.create-transform-3d {
420
 
  -webkit-transform: perspective(500) scale3d(20px, 20px, 20px) rotateX(25deg) rotateY(25deg) rotateZ(25deg) rotate3d(false 50px) translate3d(50px, 50px, 50deg) skew(50deg, 50%);
421
 
  -moz-transform: perspective(500) scale3d(20px, 20px, 20px) rotateX(25deg) rotateY(25deg) rotateZ(25deg) rotate3d(false 50px) translate3d(50px, 50px, 50deg) skew(50deg, 50%);
422
 
  -ms-transform: perspective(500) scale3d(20px, 20px, 20px) rotateX(25deg) rotateY(25deg) rotateZ(25deg) rotate3d(false 50px) translate3d(50px, 50px, 50deg) skew(50deg, 50%);
423
 
  -o-transform: perspective(500) scale3d(20px, 20px, 20px) rotateX(25deg) rotateY(25deg) rotateZ(25deg) rotate3d(false 50px) translate3d(50px, 50px, 50deg) skew(50deg, 50%);
424
 
  transform: perspective(500) scale3d(20px, 20px, 20px) rotateX(25deg) rotateY(25deg) rotateZ(25deg) rotate3d(false 50px) translate3d(50px, 50px, 50deg) skew(50deg, 50%);
425
 
  -webkit-transform-origin: 50% 50%;
426
 
  -moz-transform-origin: 50% 50%;
427
 
  -ms-transform-origin: 50% 50%;
428
 
  -o-transform-origin: 50% 50%;
429
 
  transform-origin: 50% 50%; }
430
 
 
431
 
.simple-transform {
432
 
  -webkit-transform:  scale(25px, 25px) rotateZ(25deg) translate(10px, 10px) skew(30deg, 30deg);
433
 
  -moz-transform:  scale(25px, 25px) rotateZ(25deg) translate(10px, 10px) skew(30deg, 30deg);
434
 
  -ms-transform:  scale(25px, 25px) rotateZ(25deg) translate(10px, 10px) skew(30deg, 30deg);
435
 
  -o-transform:  scale(25px, 25px) rotateZ(25deg) translate(10px, 10px) skew(30deg, 30deg);
436
 
  transform:  scale(25px, 25px) rotateZ(25deg) translate(10px, 10px) skew(30deg, 30deg);
437
 
  -webkit-transform-origin: 10% 10%;
438
 
  -moz-transform-origin: 10% 10%;
439
 
  -ms-transform-origin: 10% 10%;
440
 
  -o-transform-origin: 10% 10%;
441
 
  transform-origin: 10% 10%; }