aboutsummaryrefslogtreecommitdiff
path: root/node_modules/ninja-components/image3d.reel/image3d.html
diff options
context:
space:
mode:
Diffstat (limited to 'node_modules/ninja-components/image3d.reel/image3d.html')
-rw-r--r--node_modules/ninja-components/image3d.reel/image3d.html95
1 files changed, 95 insertions, 0 deletions
diff --git a/node_modules/ninja-components/image3d.reel/image3d.html b/node_modules/ninja-components/image3d.reel/image3d.html
new file mode 100644
index 00000000..f7b46bd0
--- /dev/null
+++ b/node_modules/ninja-components/image3d.reel/image3d.html
@@ -0,0 +1,95 @@
1<!DOCTYPE html>
2<!-- <copyright>
3 This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
4 No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
5 (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
6 </copyright> -->
7<html>
8<head>
9 <script type="text/montage-serialization">
10 {
11 "owner": {
12 "module": "montage/ui/image3d.reel",
13 "name": "Image3D",
14 "properties": {
15 "element": {"#": "Image3D"},
16 "left": {"#": "left"},
17 "right": {"#": "right"}
18 }
19 }
20 }
21 </script>
22</head>
23<style>
24 .Image3D {
25 width: 320px;
26 height: 320px;
27 -webkit-transform-style: preserve-3d;
28 -webkit-backface-visibility: hidden;
29 }
30 .Image3D .left {
31 position: absolute;
32 width: 320px;
33 height: 30px;
34 -webkit-transform-origin: 0 0 0;
35 -webkit-transform: translate3d(0.5px, 320px, -30px) rotateY(-90deg) rotateZ(-90deg);
36 line-height: 30px;
37 font-size: 14px;
38 font-family: Helvetica, Arial, sans-serif;
39 text-align: center;
40 color: white;
41 background: black;
42 -webkit-backface-visibility: hidden;
43 }
44 .Image3D .right {
45 position: absolute;
46 width: 320px;
47 height: 30px;
48 -webkit-transform-origin: 0 0 0;
49 -webkit-transform: translate3d(319.5px, 320px, 0) rotateY(90deg) rotateZ(-90deg);
50 line-height: 30px;
51 font-size: 14px;
52 font-family: Helvetica, Arial, sans-serif;
53 text-align: center;
54 color: white;
55 background: black;
56 -webkit-backface-visibility: hidden;
57 }
58 .Image3D .top {
59 position: absolute;
60 width: 320px;
61 height: 30px;
62 -webkit-transform-origin: 0 0 0;
63 -webkit-transform: translate3d(0, .5px, -30px) rotateX(90deg);
64 background: #444;
65 -webkit-backface-visibility: hidden;
66 }
67 .Image3D .bottom {
68 position: absolute;
69 width: 320px;
70 height: 30px;
71 -webkit-transform-origin: 0 0 0;
72 -webkit-transform: translate3d(0, 319.5px, 0) rotateX(-90deg);
73 background: #444;
74 -webkit-backface-visibility: hidden;
75 }
76 .Image3D .back {
77 position: absolute;
78 width: 320px;
79 height: 320px;
80 background: inherit;
81 -webkit-transform-origin: 0 0 0;
82 -webkit-transform: translate3d(320px, 0, -30px) rotateY(-180deg);
83 -webkit-backface-visibility: hidden;
84 }
85</style>
86<body>
87 <div id="Image3D" class="Image3D">
88 <div id="left" class="left"></div>
89 <div id="right" class="right"></div>
90 <div class="top"></div>
91 <div class="bottom"></div>
92 <div id="back" class="back"></div>
93 </div>
94</body>
95</html>